vue项目部署后跨域请求后端失败（已解决）

未解决前

验证码加载失败

解决后

验证码加载成功

解决办法

在 nginx/conf/nginx.conf 下做如下配置

    server {
        listen       8080;           # 监听的端口号

        server_name 127.0.0.1;  # 服务器的ip地址

        root /usr/local/nginx/html;   # 服务器中项目所在文件夹

        #charset koi8-r;

        #access_log  logs/host.access.log  main;



        location / {
           # root   /usr/local/nginx/html/;
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }

        # 解决跨域请求
        location /req {
            rewrite ^.+req/?(.*)$ /$1 break;
            proxy_pass http://127.0.0.1;  #第一个跨域请求的地址
            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 /api {
            proxy_pass http://127.0.0.1:/login;  # 第二个跨域请求的地址
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection ‘upgrade’;
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
        }
 }

注意：以上提供了两种解决方法，但是当两个都使用第二中方法时会出现问题。

附：本地跨域问题的解决