跨域问题解决

最新推荐文章于 2024-10-16 21:35:12 发布

屿葤Yuan

最新推荐文章于 2024-10-16 21:35:12 发布

阅读量399

点赞数

文章标签：前端 es6 vue.js

本文链接：https://blog.csdn.net/weixin_41812196/article/details/121282782

版权

本文主要介绍了在前端和后端如何处理跨域问题。前端方面，在生产环境中使用JSONP，开发环境下利用VueCLI的proxy代理。后端则通过CORS方式进行跨域配置。在Vue项目中，可以通过创建vue.config.js文件并设置proxy代理来实现API请求的跨域解决。

摘要由CSDN通过智能技术生成

1.原因

域名、端口、二级域名不同产生跨域

2.方法

1）前端

1.生产环境

jsonp

2.开发环境

proxy代理方式

2）后端

cors方式

proxy代理方式

创建 vue.config.js

module.exports = {
    devServer: {
        proxy: {
            '/api': {
                target: 'http://iwenwiki.com/',
                // ws: true,
                changeOrigin: true,
                pathRewrite:{
                    //路径重写
                    "^/api":""
                }
            }
            // '/foo': {
            //     target: '<other_url>'
            // }
        }
    }
}

配置参考 | Vue CLI