一.设置proxy

首先在项目创建vue.config.js

注意在ts环境下仍为js结尾

项目配置详情如下

module.exports ={
  devServer: {
    open: false, // 是否自动弹出浏览器页面    
    proxy: {
      '/api': { // '/api'是代理标识用于告诉nodeurl前面是/api的就是使用代理target: "http://localhost:3000", //目标地址,一般是指后台服务器地址
        changeOrigin: true, // 是否跨域
        ws: true, // 是否代理 websockets
        secure: false, // 是否https接口
        // pathRewrite: { // pathRewrite作用是把实际Request Url中的'/api'用""代替 如果有则不需要属性
        //   '^/api': "/api"
        // }
      }
    }
  }
}

二.问题出现

结果运行依然报错

三.解决方案

最后还是出现在axios默认基本路径配置代理发生了冲突代理本身是将请求基本路径代理到目标基本路径

比如:

项目基本路径是http:localhost:8080

axios 基本路径却设置http:localhost:3000,

代理目标路径为:http:localhost:3000

此时项目启动仍然报错跨域

所以axios的基本路径要么设置项目启动路径http:localhost:8080要么设置为空

此时问题解决

原文地址:https://blog.csdn.net/weixin_48813932/article/details/129668333

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_26502.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注