VUE前端请求跨域问题解决

解决方法:

  1. vue.config.js文件配置:
    复制代码
    module.exports = {
        devServer: {
            open: true,
            host: '192.168.1.193',
            port: 8080,
            https: false,
            //以上的ip和端口是我们本机的;下面为需要跨域的
            proxy: { //配置跨域
                '/api': {
                    target: 'http://api.tp6.com:6110',
                    changeOrigin: true,
                    ws: true,
                    pathRewrite: {'^/api': '/api'}
                }
            }
        },
    
        runtimeCompiler: true
    }
    复制代码
  2. axios配置:
    复制代码
        //2.1 请求拦截的作用
        instance.interceptors.request.use(config => {
                config.headers['Content-Type'] = 'application/json;charset=utf-8';
                let user = localStorage.getItem("uId")?JSON.parse(localStorage.getItem("uId")):null
                if (user) {
                    config.headers['token'] = localStorage.getItem("token") // 让每个请求携带自定义token 请根据实际情况自行修改
                }
                return config;
        }, err => { })
    复制代码
  3. axios具体的请求
    import { request } from "./request"
    
    export function getUserData() {
        return request({
            url: 'user/index'
        })
    }

     

posted on   醉舟903  阅读(273)  评论(0编辑  收藏  举报

相关博文:
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· 葡萄城 AI 搜索升级:DeepSeek 加持,客户体验更智能
· 什么是nginx的强缓存和协商缓存
· 一文读懂知识蒸馏

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

点击右上角即可分享
微信分享提示