首先看看說明圖,先有一個總體的理解。html
是指是一個位於客戶端和原始服務器之間的服務器,爲了從原始服務器取得內容, 客戶端向代理髮送一個請求並指定目標(原始服務器),而後代理向原始服務器轉交請求並將得到的內容返回給客戶端。客戶端才能使用正向代理。vue
是指以代理服務器來接受 Internet 上的鏈接請求,而後將請求轉發給內部網絡上的服務器,並將從服務器上獲得的結果返回給 Internet 上請求鏈接的客戶端,此時代理服務器對外就表現爲一個反向代理服務器。web
接下來我提煉一下各自的特色。vue-cli
說了這麼多,如今說說代理在工做中的時機應用場景吧。api
咱們知道在國內用訪問 www.google.com
是沒法訪問的,由於正常狀況下是會被 GFW 限制訪問的。跨域
但是你仍是想使用 google 的話,這個時候咱們就須要一些代理(FQ軟件)來幫咱們去請求 www.google.com
,代理再把響應結果返回給你。緩存
GFW 的做用主要是用於分析和過濾中國境內外網絡間的互相訪問。也就是說,他不只能限制國內網民訪問境外的某些站點,也能限制國外用戶訪問國內的站點。 咱們一般說的「被牆」,就是指訪問被 GFW 所限制。而」FQ「,顧名思義,則是突破 GFW 的限制。安全
Nginx 服務器的功能有不少,諸如反向代理、負載均衡、靜態資源服務器等。bash
客戶端原本能夠直接經過 HTTP 協議訪問服務器,不過咱們能夠在中間加上一個 Nginx 服務器,客戶端請求 Nginx 服務器,Nginx 服務器請求應用服務器,而後將結果返回給客戶端,此時 Nginx 服務器就是反向代理服務器。服務器
# 虛擬主機的配置 server { listen 8080; # 監聽的端口 server_name 192.168.1.1; # 配置訪問域名 root /data/toor; # 站點根目錄 error_page 502 404 /page/404.html; # 錯誤頁面 location ^~ /api/ { # 使用 /api/ 代理 proxy_pass 的值 proxy_pass http://192.168.20.1:8080; # 被代理的應用服務器 HTTP 地址 } } 複製代碼
以上簡單的配置就能夠實現反向代理的功能。
固然反向代理也能夠處理跨域問題。
對於使用 vue-cli 搭建的工程而言,咱們知道 vue-cli 採用 http-proxy-middleware 插件來進行代理服務器等各項配置。
因此咱們能夠利用 proxyTable,設置地址映射表。即便用 proxyTable
這個屬性進行相關的配置來解決跨域問題帶來的煩惱。配置以下:
...
proxyTable: {
'/weixin': { target: 'http://192.168.20.1:8080/', // 接口的域名 secure: false, // 若是是 https 接口,須要配置這個參數 changeOrigin: true, // 若是接口跨域,須要進行這個參數配置 pathRewrite: { '^/weixin': '' } }, }, ... 複製代碼
# upstream 表示負載服務器池,定義名字爲 my upstream my { server 192.168.2.1:8080 weight=1 max_fails=2 fail_timeout=30s; server 192.168.2.2:8080 weight=1 max_fails=2 fail_timeout=30s; server 192.168.2.3:8080 weight=1 max_fails=2 fail_timeout=30s; server 192.168.2.4:8080 weight=1 max_fails=2 fail_timeout=30s; # 即在 30s 內嘗試 2 次失敗即認爲主機不可用 } 複製代碼
負載均衡即將 請求/數據 輪詢分攤到多個服務器上執行,負載均衡的關鍵在於 均勻。
也能夠經過 ip-hash
的方式,根據客戶端 ip 地址的 hash 值將請求分配給固定的某一個服務器處理。
另外,服務器的硬件配置可能不一樣,配置好的服務器能夠處理更多的請求,這時能夠經過 weight
參數來控制。