vue3.X 跨域问题，一直报错

Question

问题描述

最近尝试用vue3-cli，遇到跨域问题，参照官方配置vueconfig.js配置devServer.proxy,但是配置完后一直报404错误，实在没找出哪里写错了

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

vue.config.js
devServer: {

// 环境配置
host: "localhost",
port: 8080,
https: false,
hotOnly: false,
disableHostCheck: true, // 禁用webpack热重载检查 解决热更新失效问题
open: true, //配置自动启动浏览器
proxy: {
  // 配置多个代理(配置一个 proxy: 'http://localhost:4000' )
  "/api": {
    target: "http://is.snssdk.com",
    ws: true,
    changeOrigin: true,
    pathRewrite: {
      "^/api": "" //请求的时候使用这个api就可以
    }
  }
}

},
真实调用接口
getTodayNewsList(params) {

return instance.get(`api/news/feed/v51/`, {
  params: params
});

},
报错
xhr.js?b50d:178 GET http://localhost:8080/api/news/feed/v51/?category=news_hot 404 (Not Found)

你期待的结果是什么？实际看到的错误信息又是什么？

Answer 1

后端提供的接口是 /api/news/feed/v51 吗？如果是的话，把 pathRewrite 去掉试试
本地测试的截图：

Answer 2

你的proxy里面是"/api"，而请求时候用的是"api"没有前面的/,不知道是不是这个影响的。
我用的时候是这样的：

return axios.request({
    url: '/api/xxxx',
    method: 'post',
    data: param
  })

'/api': {
    target: 'http://'+BASE_IP+':18003', // 后台服务器的ip地址
    pathRewrite: { '^/api': '/' },
    changeOrigin: true
  }

Answer 3

你这不是跨域，是接口404，请求地址错了。

Answer 4

我也遇到这个问题，请问最后怎样解决的