vue.js+springboot 解决跨域问题

vue.js 中自带解决方案,后端正常接收就可以了,这里就改vue.js项目就可以

在vue.js项目中的config文件夹中的index.js文件
找到

proxyTable: {},

加上代理内容

proxyTable: {
      '/api': {   //这里/api就是代表在使用/api前缀时会引用target,就是发送/api/list请求就是发送http://10.1.0.0:8762/api/list
        target: 'http://10.1.0.0:8762',
        changeOrigin: true,
        pathRewrite: {
            '^/api': '/yjj/Log'  //这里可以不写,但是我的后端接口没有http://10.1.0.0:8762/api/list,只有http://10.1.0.0:8762/yjj/Log/list,所以我用了,就是将api重写成/yjj/Log
        }
      }
    },

axios发送方法

methods: {
        add(form){
            this.$axios
            .post('/api/insertSelective', this.form)
            .then(successResponse => {
                console.log(successResponse)
            })
            .catch(failResponse => {})
        }
    }

此时如果发现get请求可以正常交流数据,说明代理成功了

但是如果发现post请求报500,可能是数据格式的问题,此时检查下自己有没有改变请求头的设置,比如:

axios.defaults.headers.post["Content-type"] = "application/json"

如果有,就注释掉,用默认的,后端用@RequestBody接收就可以了

如果还有问题可以留言

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值