vue proxyTable 接口跨域請求調(diào)試的示例
在不同域之間訪問是比較常見,在本地調(diào)試訪問遠程服務(wù)器。。。。這就是有域問題。
VUE解決通過proxyTable:
在 config/index.js 配置文件中
dev: { env: require('./dev.env'), port: 8080, autoOpenBrowser: true, assetsSubDirectory: 'static', assetsPublicPath: '/', //proxyTable: {}, proxyTable: proxyConfig.proxyList, // CSS Sourcemaps off by default because relative paths are "buggy" // with this option, according to the CSS-Loader README // (https://github.com/webpack/css-loader#sourcemaps) // In our experience, they generally work as expected, // just be aware of this issue when enabling this option. cssSourceMap: false }
劃紅線部分就是設(shè)置代理參數(shù):
在config目錄創(chuàng)建,proxyConfig.js 寫入
module.exports = { proxyList: { '/apis': { // 測試環(huán)境 target: 'https://goods.footer.com', // 接口域名 changeOrigin: true, //是否跨域 pathRewrite: { '^/apis': '' //需要rewrite重寫的, } } } }
在 config/index.js 配置文件上邊引入
var proxyConfig = require('./proxyConfig')
使用:
服務(wù)器提供接口:https://goods.footer.com/health/list
Vue請求
var obj = { pageSize: 20 } this.$http.get( '/apis/health/list',{params: obj}) .then(function(res){ // 成功回調(diào) },function(){ alert("error") })
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
關(guān)于在vue-cli中使用微信自動登錄和分享的實例
本篇文章主要介紹了關(guān)于在vue-cli中使用微信自動登錄和分享的實例,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-06-06vue中的watch監(jiān)聽數(shù)據(jù)變化及watch中各屬性的詳解
這篇文章主要介紹了vue中的watch監(jiān)聽數(shù)據(jù)變化及watch中的immediate、handler和deep屬性詳解,本文大家介紹的非常詳細,具有一定的參考借鑒價值,需要的朋友參考下吧2018-09-09