美文网首页Vue.js
VUE前后端分离解决跨域问题(配置前端服务器的nginx文件)

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

作者: 逆世界开发者 | 来源:发表于2019-06-04 20:03 被阅读1次

    在使用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;//服务器端接口地址

            }

    相关文章

      网友评论

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

        本文链接:https://www.haomeiwen.com/subject/ubgrxctx.html