vue.js 中的 CORS 策略。只能在后台访问？答案

【问题标题】：CORS policy in vue.js. Access only in backend?vue.js 中的 CORS 策略。只能在后台访问？
【发布时间】：2020-04-03 08:04:42
【问题描述】：

如果我在vue-cli 有项目而没有node.js（或express.js），我可以以某种方式解除对CORS 访问的阻止吗？我尝试在vue.config.js 中添加代码

vue.config.js:

       module.exports = {
        devServer: {
         proxy: {
         '/api': {
         target: 'http://18.700.121.3:8000/',
          ws: true,
         changeOrigin: true
       }
     }
   }
 }

vue template

 import axios from 'axios'
  export default {
   name: "Jokes",
  data () {
  return {
    songs: null,
  }
 },
 },
   mounted () {
    const config = {headers: {'Access-Control-Allow-Origin': '*'}};
    axios
    .get(`http://2.788.121.2:4000/`, config) //it a sample api
    .then(
        response => (
            this.songs= response.data))
   }

}
</script>

但这没有帮助。我还尝试打开 chrome 插件 Access-Control-Allow-Origin，在其中添加了对 localhost:8080 的访问权限，但仍然无法正常工作。所以有可能，唯一的选择是安装 node.js 并添加 res.header("Access-Control-Allow-Headers","*");

【问题讨论】：

将此添加到 devServer 配置中？
我将这部分代码添加到 vue.config.js 中。但是这个 res.header("Access-Control-Allow-Headers","*") 我没有添加，因为我看它应该在后端。
DevServer 是后端
好的，但是我没有node.js和express.js，所以可以在前端做点什么吗？或者只安装快递
因此您无法更改 api 服务器响应标头 - 因此您可以进行开发，例如代理将其传递给本地 ip，其中包含不关心 cors 的内容并添加 cors 标头 - SO 上应该有很多解决方案......或者使用不关心 cors 的浏览器

标签： javascript vue.js

【解决方案1】：

尝试从请求中删除标头const config = {headers: {'Access-Control-Allow-Origin': '*'}};

额外的标题只会混淆浏览器

【讨论】：

【解决方案2】：

第一种方式，在 chrome 中使用 Cors 插件，例如 Moseif CORS 或将您的 chrome 版本降级低于 71。

第二种方式，如果可以修改服务端代码（如果使用express）

添加以下代码，你可以轻松解决这个问题。

var cors = require('cors')

var app = express()
app.use(cors())

【讨论】：

【解决方案3】：

关闭 Chrome。
按住 Windows 键并按键盘上的 R。 “运行”对话框将打开。
插入以下输入字段chrome --disable-web-security --user-data-dir并运行它
现在运行您的 vue.js 应用程序

希望对你有帮助。

【讨论】：

现在不要在互联网上浏览任何东西，因为您的浏览器对各种讨厌的东西都敞开了大门
我怎样才能关闭这个？
关闭浏览器再打开。它将以通常的形式打开。