VUE separated front and rear ends (front-end server's configuration file Nginx) cross-domain problem solving

Vue achieved using separate front and rear end of the project, it is prone to cross-domain problem, tangled for a long time, through online access to information, and finally solved the problem:

Nginx modified front end profile as follows:

location / {


            root  /apps/webroot/lebaobei_edu/web;

            try_files $ on $ a / /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;

            }

        }


# Match / begin with / apis requests

        location ^~ /api/ {

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

            proxy_pass http: //edu_lbb.bestshowgroup.com; // server interface address

        }

Reproduced in: https: //www.jianshu.com/p/f40724ce0e01

Guess you like

Origin blog.csdn.net/weixin_34261739/article/details/91280778