描述:前后端分离,前端vue,后端接口用springBoot,请求出现403跨域问题
1.首先在npm中安装
npm install qs
2.页面导入
<script>
import qs from 'qs';
export default {
data(){
return {
name:'',
phone:'',
address_region:'',
address_info:'',
checked:true,
}
},
created(){
// this.$store.commit('headerShow',false)
// this.$store.commit('headerShow',{header:true,slot:'新增收货地址'})
},
methods:{
add:function () {
this.$http.post('http://localhost:8080/address/add',
qs.stringify({name:this.name,phone:this.phone,address_region:this.address_region,address_info:this.address_info,checked:this.checked}),{emulateJSON:true}).then(function(res){
console.log(res.data);
},function(res){
console.log(res.status);
});
}
},
computed:{},
components:{
}
}
</script>
3.后台代码
@ResponseBody
@PostMapping("/add")
public int addAddress(Address address){
//response.setHeader("Access-Control-Allow-Origin", "*");
return addressService.addAddress(address);
}