A. 在vue項目中配置proxy解決跨域問題
1.問題：
後端給的介面是：https://stg-pteppp.leanapp.cn/h5/jsconfig.前端在本地開發中調用該介面跨域。
2.解決方案：
* 在webpack中配置proxy。如下圖所示
如上：
1. target是你要代理的域名，必須要加上http。
2. 這里用'/api'代替target裡面的地址，組件中調用介面時直接用'/api'代替。比如我要調用'https://xxx.com/news.直接寫'/api/news'即可
3. changeOrigin必須為true
* 在頁面中請求寫法如下：
開心吧。數據終於拿到啦！！！
我們知道，vue2.0項目中的static文件夾存儲的是靜態資源，可以直接被訪問到的，如果我們將mock的數據放入static文件夾，在瀏覽器中直接訪問http://localhost:8080/static/json/list.json發現是可以訪問到數據的。於是我們在頁面將mock數據的請求寫成下面這樣：
則需要在webpack中做如下配置：
注意這里的http一定不能省略，否則數據請求不到。這樣做的好處是在本地開發時mock的介面和線上的介面一致，避免上線前大量改動介面名稱。
B. vue-配置代理解決跨域
我們需要向一台伺服器上上傳圖片，介面是 " http://xxxx.xxx.xx/file/upload_img ",直接向這台伺服器請求上傳圖片將會產生跨域問題，我們這里有兩種解決方式
1.讓後台幫忙配置,一下是node實橘罩現
2.前端配置代理（在前端請鄭伍激求node伺服器，node伺服器再幫我們發送真正的請喊襪求）
C. 前端開發環境中怎麼配置反向代理跨域獲取數據
upstream cjdby{ server pigoss; server tianyuan; } 在server節點中，只保留一下location，然後把proxy_pass改成這樣 proxy_pass http://cjdby; 其它的set_header不變
D. vue 前端設置跨域多代理
在項目開發的時候經常會遇到後端提供的多個服務請求地址域名或埠號不一致的情況這時候就需要前端設置多個proxy跨域代理，本文以vue-element-admin為例展示步驟如下：
1: 配置環境變數 .env.development
2: 配置項目根目錄下的vue.config.js 找到devServer
PS：注意VUE_APP_BASE_API 放在數組的最後一個，如果你VUE_APP_BASE_API跟我一樣設置為'' 的話，這樣才不會被代理的虛擬path覆蓋！
3: 找到項目中管理請求地址的文件 src/api/proxy.js （proxy.js 是我隨便起的名字😄）
打開proxy.js
proxy_api 就是你之前在步驟1：中定義的虛擬path
VUE_APP_BASE_API_PROXY = '/proxy-api'
const url = (path) => (proxy_api + path) 一個路徑處理函數，參數是'/xx/xxx/fetch/list'，return (proxy_api + path)
需要額外注意的是我在配置環境變數 .env.development的時候基礎api設置的是空：
所以不需要在src/utils/request.js 中對代理的請求進行攔截
如果你為VUE_APP_BASE_API設置了虛擬path路徑，那麼就需要在src/utils/request.js為這個虛擬路徑配置攔截，比較麻煩比不建議這么做。
至此跨域多代理已經設置完了，本文中設置兩個代理一個基礎代理VUE_APP_BASE_API，一個額外代理VUE_APP_BASE_API_PROXY，默認情況下走基礎代理，當請求匹配到匹'/proxy-api' 時走額外代理～
E. 前端跨域解決 （vscode live server proxy 代理）
這個顯然是處理前端跨域最優的方法了，在此記錄下來方便以後使用，附送scss 轉 css
使用 vscode IDE作為編寫工具
1.搜索並載入 vscode 插件 live server
2.要文件根目錄創建 ".vscode" 目錄
3.在 .vscode 目錄下創建settings.json
4.proxUri 為代理的目標地址
5.baseUri 識別代理的符號 （如下例中 baseUri: '/api', 則以"/api"開頭的網路請求都將被識別為需要代理轉發的地址，並把 『/api』重寫為空""）
1.ajax請求會受到瀏覽器同源策略的限制（同源 = 域名 + 埠 都一致）
2.ajax請求默認攜帶 同源下的所有cookie, 如果不做限制 a 去請求 b 的時候就等於把a所有的cookie 都告訴b。
3.同源下： 張三的網站只能訪問張三的內容如鞋子衣服吃飯等等，如果想訪問李四的，瀏覽器就不讓你幹了。如果充許這么乾的話，張三的cookie隱私將直接暴露給李四，李四有可能幹一些不懷好意的事情。
4.跨域情況：張三把錢都放在李四那裡，現在張三想去李四那邊取錢，這時候就需要跨域了。
5.跨域怎麼解決呢？接下來把解決問題的思路簡單描繪一下。
5.1：李四告訴全世界說我對錢不感興趣，只要我有，你們所有人都隨便來取。因此，當瀏覽器看到張三要取錢的人是李四這種慈善家，就不再攔著你了。
5.2：李四不是慈善家怎麼辦？於是張三這個時候就很討厭瀏覽器，想了個辦法繞過瀏覽器，然後另外找了個代理去跟李四取錢
5.2.1: 問題是繞過瀏覽器？怎麼繞呢？ 於是張三自己建了個伺服器，每次要跟李四取錢的時候就欺騙瀏覽器說我要跟自己的伺服器取錢，瀏覽器這個時候也就不再攔著你了
5.2.2：當張三自己的伺服器接收到跟李四取錢任務後，就以proxy代理的身份向李四取錢，取完錢之後再通過瀏覽器給了張三
5.2.3：vscode 中的live server 插件裡面就這個代理向李四取錢的代理伺服器功能，本文settings.json 中包含了配置信息
6.當然還有一些很多牛叉的解決跨域的方法。若有興趣的同學可以一起研究探討。