前端解决跨域问题

最新推荐文章于 2023-02-20 23:24:49 发布

小小梦想程序猿

最新推荐文章于 2023-02-20 23:24:49 发布

阅读量172

点赞数 1

分类专栏：个人笔记文章标签： vue java

本文链接：https://blog.csdn.net/TryJavva/article/details/119185595

版权

个人笔记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文介绍了在vue-admin-template项目中如何通过配置proxy解决跨域问题。在开发环境中，由于'/dev-api'前缀的存在导致跨域，通过设置proxy，将目标URL重定向并开启跨域支持，实现前端的跨域请求。代码示例展示了具体的配置方法，适用于vue-cli3环境。

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

基于vue-admin-template解决跨域问题

在这个前后端分离的时代，跨域问题不可避免。我们可以通过后端网关解决跨域，通过nginx配置解决跨域。当然也可以在前端解决这个跨域问题，后端还是要加@CrossOrigin跨域注解。这里就来记录一下前端解决的代码块，很简单，代码送上：

    proxy: {
      '/dev-api': {     //这里是公共部分，在调用接口时后面接不相同的部分，/api就相当于http://192.168.0.199:8926/api这一段
        target: defaultSettings.BASE_API,   //这里写的是访问接口的域名和端口号
        changeOrigin: true, // 必须加上这个才能跨域请求
        pathRewrite: {  // 重命名
          '^/dev-api': ''
        }
      }
    },