vue 前端项目部署,nginx 跨域配置(nginx跨域效率最高,推荐使用)

一、前端代码:所有接口前增加 api 前缀,如下

vue 前端项目部署,nginx 跨域配置(nginx跨域效率最高,推荐使用)

vue 前端项目部署,nginx 跨域配置(nginx跨域效率最高,推荐使用)

 

二、nginx 配置

server {
        listen       1888;
        server_name  localhost;
        root   project/dist;
        index  index.html index.htm;
        
      location /api {
            rewrite  ^.+api/?(.*)$ /$1 break;
            proxy_pass  http://172.16.10.202:8888/;    #node api server 即需要代理的IP地址
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         }

        location ~* .*\.gz$ {
        add_header Content-Encoding gzip;
        }
    }

 

特此记录,防止以后出错