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

{ console.log(data); })

axios的配置(main.js)

s.defaults.headers.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 = res.data.slice(0,3) self.opencode = res.data[0].opencode.split(',') } }) } }

总结

以上所述是小编给大家介绍的Vue项目中跨域问题解决方案。菜鸟教程 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得菜鸟教程不错,可分享给好友!感谢支持。

大佬总结

以上是大佬教程为你收集整理的Vue项目中跨域问题解决方案全部内容,希望文章能够帮你解决Vue项目中跨域问题解决方案所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: