【vue】--代理方式跨域

正向代理與反向代理

前端使用代理主要用於跨域請求，

關於跨域：經常使用的方式

• JSONP：利用script標籤可跨域的特色，在跨域腳本中能夠直接回調當前腳本的函數。

• CORS：服務器設置HTTP響應頭中Access-Control-Allow-Origin值，解除跨域限制    

可是這兩個跨域方案都存在一個致命的缺陷，嚴重依賴後端的協助，

代理 就能夠做爲 前端獨立解決跨域的方案

正向代理

是指一個位於客戶端和目標服務器(target server)之間的服務器，爲了從目標服務器取得內容，客戶端向代理髮送一個請求並指定目標(目標服務器)，而後代理向目標服務器轉交請求並將得到的內容返回給客戶端。

 　　vue-cli 3.x  新建vue.config.js文件

module.exports = {
    devServer: {
        proxy: {
            // proxy all requests starting with /api to jsonplaceholder
            '/api': {
                target: 'http://localhost:8080',   //代理接口
                changeOrigin: true,
                pathRewrite: {
                    '^/api': '/mock'    //代理的路徑
                }
            }
        }
    }
}

反向代理

反向代理（Reverse Proxy）是指以代理服務器來接受internet上的鏈接請求，而後將請求轉發給內部網絡上的服務器，並將從服務器上獲得的結果返回給internet上請求鏈接的客戶端，此時代理服務器對外就表現爲一個反向代理服務器。

 

http://www.javashuo.com/article/p-unmzbxjn-cg.html