npm run dev 在本地調試出現跨域問題

在localhost:8080調試時會出現跨域問題，如圖：

我的項目是用webpack作為前端自動化構建工具，可以在webpack-dev-server中配置跨域。webpack-dev-server是一個小型的nodejs服務器，是基于express框架的，用于實時監聽和打包編譯靜態資源。其中里面有一個屬性是proxy，是專門來配置代理請求接口的。

// # 項目\config\index.js dev: {// PathsassetsSubDirectory: 'static',assetsPublicPath: '/',// # 配置代理proxyTable: {'/apis': {target: 'http://dev.daishutijian.com',changeOrigin: true,pathRewrite: {'^/apis': ''}}},// Various Dev Server settingshost: '0.0.0.0', // can be overwritten by process.env.HOSTport: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined... }, 復制代碼

將 http://dev.daishutijian.com映射為^/apis

// # 發送請求 const API_PATH = "apis/apps/api/"; function getOrderList(vm) {let url = API_PATH + 'user/order_list';// # http://dev.daishutijian.com/apps/api/user/order_listreturn new Promise((resolve, reject) => {Vue.http.get(url, {emulateJSON: true},).then((res) => {resolve(res.data);}).catch((res) => {console.log('warn');})}) } 復制代碼

設置代理，請求成功

轉載于:https://juejin.im/post/5bb03a25e51d450e9649fd87

總結

以上是生活随笔為你收集整理的npm run dev 在本地调试出现跨域问题解决方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。