vue-cli專案 配置代理 解決跨域問題

• 問題描述
  

因為是自己寫前端也要自己寫介面,我使用的nodejs+express開的服務寫介面

• 但是vue 專案 執行除錯時會佔用一個埠
• 而node開啟服務也許要監聽一個埠
• 兩者雖然都是在一個ip地址,但是埠不同也就造成了跨域問題的出現

雖然可以在後端方面(node)通過安裝cors包 解決,但是cors是指定對應的ip和域來訪問,如果換個埠什麼的,就還是會有跨域問題的出現,所以就想到了使用 vue 使用代理的方式來解決

方法步驟

• 首先找到專案目錄下的config目錄下的index.js檔案
  

• 然後找到dev程式碼塊

  

  - 主要是修改proxyTable:{}內的資料,預設狀態下是空的{}

  

引數說明

• target: 介面域名
• changeOrigin: true, 表示是否跨域
• pathRewrite: {‘^/api’: ”} 表示需要rewrite重寫的,

配置好這寫之後就可以直接使用/api+介面名稱傳送請求了

• 例如:原來的請求地址為 192.168.1.1:8080/log
• 配置代理後直接使用 /api/log 就可以了

小白的踩坑之路~~~~希望大家多多指點更好的方法