利用nginx解决本地项目AJAX跨域请求

     今天用sanic写前后端分离的项目时,用pycharm本地调试遇到ajax跨域问题。从网上搜索解决方案,用getJSON,jsonp,设置请求头等均达不到理想效果。最后,想到可以利用nginx反向代理来解决这个问题。

两个url只要协议、域名、端口有任何一个不同,都被当作是不同
的域,相互访问就会有跨域问题。

1.在pycharm中编写项目时,前端的url为

http://localhost:63342/Library/template/index.html

2.而我的后端请求地址为

http://localhost:8000/api/

3.解决这个问题,只要使页面的前缀和接口的前缀一致就可以了,因此可以使用nginx进行反向代理。打开nginx目录下的conf文件夹,在nginx.conf文件的配置如下

server {
        listen       80;
        server_name  localhost;

        location ^~ /library {
            alias E:/Document/python/sanicProject/Library/template;
            autoindex on;
            #add_header Access-Control-Allow-Origin "*";  
            #add_header Access-Control-Allow-Methods "POST, GET, PUT, OPTIONS, DELETE";  
            
        }
        location / {
    
            proxy_pass http://localhost:8000;
            #add_header Access-Control-Allow-Origin "*";
            add_header Access-Control-Allow-Methods "POST, GET, PUT, OPTIONS, DELETE";
        }
        
    }

4.重启nginx

nginx -s reload

5.现在应该访问正常了

你可能感兴趣的:(利用nginx解决本地项目AJAX跨域请求)