VUE项目IIS部署 使用nginx代理访问后端接口

项目使用 vue-element-admin 方案，采用History模式打包后部署在IIS，在访问接口时状态返回200，但是响应提示 We're sorry but Vue Admin Template doesn't work properly without JavaScript enabled. Please enable it to continue.

---

搜索发现可能的原因：

1.浏览器JS未启用

2.vue项目打包路径有问题

3.vue路由模式需要改成hash模式

4.接口代理问题

---

已经尝试方法：

浏览器JS已经启用，

尝试修改publicPath 从 "./"  "/"  "/xx/"  都无法解决这个问题

尝试将vue路由模式由history修改为hash模式也无法正常访问接口

尝试使用IIS 的ARR代理接口，仍无法解决（这个方法可能是我没有弄明白）

---

最终解决办法：

使用nginx代理后端接口，配置如下

    server {
        listen 8888;
        server_name localhost;
        location / {
            #try_files $uri $uri/  /index.html;  # 解决页面刷新
            proxy_pass http://200.200.200.200:200; #web在IIS的部署地址
            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 /api1{
            rewrite  ^/api1/(.*)$ /$1 break;
            proxy_pass http://100.100.100.100:100;#api1的后端接口地址
            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 /api2{
            rewrite  ^/api2/(.*)$ /$1 break;
            proxy_pass https://xxxx.xxxxx.com; #api2的后端接口地址
            proxy_pass_header X-Accel-Buffering;            
            proxy_read_timeout 1800s;
            proxy_set_header Origanization-Id qiancheng;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host xxxx.xxxxx.com;
            #不加下面这些 在https 报403错误
            proxy_ssl_server_name on; 
            proxy_ssl_name xxxx.xxxxx.com;

        }

参考文档：

windows环境下 nginx+iis 反向代理解决跨域问题 - 骇客HK - 博客园 (cnblogs.com)

IIS上开启反向代理实现Vue项目接口跨域处理_iis 反向代理 跨域-CSDN博客