Skip to content

常见问题整理

解决跨域问题

项目上线解决跨域问题

  • 线上配置文件需要通过nginx做转发,才能解决
ini

# 解决使用history模式的时候刷新页面404的问题
  location / {
       try_files $uri $uri/ /index.html;
  }
# 解决项目跨域的问题
location /跨域地址 {  # location /pro_api {
    proxy_pass 项目地址; # proxy_pass http://127.0.0.1:9999/api/v1;
    client_max_body_size 100M;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

# socket.io配置跨域问题
location /socket.io/ {        
  # 此处改为 socket.io 后端的 ip 和端口即可
  proxy_pass http://127.0.0.1:9999;

  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "upgrade";
  proxy_http_version 1.1;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header Host $host;
}

# websocket配置隐藏端口号
location /wss{
    # 此处改为websocket后端的 ip 和端口即可
    proxy_pass http://127.0.0.1:23481;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
    proxy_set_header X-Real-IP $remote_addr;
}
  • 后端解决跨域问题

开发项目解决跨域问题

同时需要在.env.development中进行相应的配置

VUE_APP_API_URL="http://127.0.0.1:8099/api/v1"
VUE_APP_DOWNLOAD_URL="http://127.0.0.1:8099/"
VUE_APP_STATIC_URL="http://127.0.0.1:8099/"
VUE_APP_BASE_API="/dev-api"
VUE_APP_SOCKET_API="/socket.io"
VUE_APP_SOCKET_URL="http://127.0.0.1:8099"

需要在本地的vue.config.js中进行配置

js
const devServerPort = 8801; // 配置端口号
export default{
 devServer: {
    port: devServerPort,
    open: true, // 启动项目自动打开
    // 显示警告和错误
    overlay: {
      warnings: false,
      errors: true
    },
    // 是否将运行进度输出到控制台
    progress: false,
    // 配置代理
    proxy: {
    // 域名数据代理
      [process.env.VUE_APP_BASE_API]: {
        target: process.env.VUE_APP_API_URL,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
        }
      },
    // socketIO代理
      [process.env.VUE_APP_SOCKET_API]: {
        changeOrigin: true,
        target: process.env.VUE_APP_SOCKET_URL,
        logLevel: 'debug'
      }
    }
  },
}

Released under the MIT License.