Vue
发布时间:2019-10-10 发布网站:大佬教程 code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Vue项目中跨域问题解决方案,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
方法
- 后台更改header
- 使用http-proxy-middleware 代理解决(项目使用vue-cli脚手架搭建)
- Jquery jsonp
后台更改header
);//允许所有来源访问
header('Access-Control-Allow-Method:POST,GET'
);//允许访问的方式
使用http-proxy-middleware 代理解决(项目使用vue-cli脚手架搭建)
打开config/index.js,在proxyTable中添写如下代码:
{
'/api':
{
target: '填写请求源地址',//源地址
changeOrigin: true,//是否跨域
pathRewrite:
{
'^/api': '' //路径重写
}
}
}
使用axios
axios的配置(main.js)
s.default
s.header
s.post["Content-type"]="application/json";
Vue.prototype.$axios=axios;
使用ES6fetch请求
{
return result.json()
}).then(data=>
{
console.log(data
);
})
使用jquery jsonp
{
getData ()
{
var self = this
$.ajax(
{
url: '地址',type: 'GET',dataType: 'JSONP',@R_
489_6048@s: function (res)
{
self.data = re
s.data.slice(0,3)
self
.opencode = re
s.data
[0].opencode.split(',')
}
})
}
}
总结
以上所述是小编给大家介绍的Vue项目中跨域问题解决方案。菜鸟教程 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得菜鸟教程不错,可分享给好友!感谢支持。
大佬总结
以上是大佬教程为你收集整理的Vue项目中跨域问题解决方案全部内容,希望文章能够帮你解决Vue项目中跨域问题解决方案所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。