-
使用JQuery提供的jsonp
methods: { getData () { var self = this $.ajax({ url: 'http://f.apiplus.cn/bj11x5.json', type: 'GET', dataType: 'JSONP', success: function (res) { self.data = res.data.slice(0, 3) self.opencode = res.data[0].opencode.split(',') } }) } }
-
依靠vue-cli脚手架搭建的项目
proxyTable: { '/api': { //使用"/api"来代替"http://f.apiplus.c" target: 'http://f.apiplus.cn', //源地址 changeOrigin: true, //改变源 pathRewrite: { '^/api': ' ' //路径重写 } } } 使用: getData () { axios.get('/api/bj11x5.json', function (res) { console.log(res) })
-
在VUE项目中引入jQuery
//下载 cnpm install jquery --save-dev //在webpack.base.conf.js文件中加入 plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery" }) ], //在需要的temple里引入 import $ from 'jquery' 例子: <template> <div class="source">{{data}}</div> </template> <script> import $ from 'jquery' export default({ name:"source", data(){ return{ data:"" } }, created(){ this.getData() }, methods:{ getData () { var self = this $.ajax({ url: '你要请求的url', type: 'GET', dataType: 'JSONP', success: function (res) { self.data = res.result } }) } } }) </script>
-
附:后台配置
header('Access-Control-Allow-Origin:*');//允许所有来源访问 header('Access-Control-Allow-Method:POST,GET');//允许访问的方式
JS 前端跨域解决方案
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- Address:https://www.zybuluo.com/XiangZhou/note/208532 Exp...
- github地址,欢迎大家提交更新。 express() express()用来创建一个Express的程序。ex...
- 文|阿章传奇 佛曰:“命由己造,相由心生。境随心转,有容乃大。”人的面相是会随着环境、心态的变化而变化的。其中心态...