Access to XMLHttpRequest at '…' from origin '…' has been blocked by CORS policy

Access to XMLHttpRequest at '…' from origin '…' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

服务器不允许跨域访问。跨域访问发生在客户端和服务器，而服务器和服务器间不会发生跨域访问问题，所以解决办法是使用请求代理。

在项目根目录下新建vue.config.js文件，该文件在老版vue中自带，但认为并不是每个项目中都会用到，所以改为了内置(名字和位置必须正确，否则vue不识别该文件)，现在要用的话需要自行创建。

module.exports = {
    //服务器配置
    devServer: {
        //代理
        proxy: {
            '/api': {
                //只要输入/api(该路径可自定义)会自动重定向(替换)为target中的地址(服务器地址)
                target: 'https://api.binstd.com/recipe/search',
                //changeOrigin：true 允许跨域
                changeOrigin: true,
                //路径重写，/api是自定义路径，真正项目中是没有这个路径的，所以要去掉
                pathRewrite: {
                    '^/api': ''
                }
            }
        }
    }
}

修改后记得要重启vue项目以便生效。