VUE前后端分离解决跨域问题(配置前端服务器的nginx文件)

在使用vue实现前后端分离的项目中,很容易出现跨域问题,纠结了很久,经过网上查阅资料,终于解决了这个问题:

修改前端的nginx配置文件如下:

location / {


            root  /apps/webroot/lebaobei_edu/web;

            try_files $uri $uri/ /index.html =404;

            add_header Access-Control-Allow-Origin *;

            add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';

            add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

            if ($request_method = 'OPTIONS') {

                return 204;

            }

        }


# 匹配以/apis/开头的请求

        location ^~ /api/ {

            rewrite  ^/api/(.*)$ /$1 break;

            proxy_pass http://edu_lbb.bestshowgroup.com;//服务器端接口地址

        }

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容