您好,登錄后才能下訂單哦!
本篇文章給大家分享的是有關nginx接口實現反向代理配置,小編覺得挺實用的,因此分享給大家學習,希望大家閱讀完這篇文章后可以有所收獲,話不多說,跟著小編一起來看看吧。
1、什么是代理服務器
代理服務器,客戶機在發送請求時,不會直接發送給目的主機,而是先發送給代理服務器,代理服務接受客戶機請求之后,再向主機發出,并接收目的主機返回的數據,存放在代理服務器的硬盤中,再發送給客戶機。
2、為什么要使用代理服務器
1)提高訪問速度
由于目標主機返回的數據會存放在代理服務器的硬盤中,因此下一次客戶再訪問相同的站點數據時,會直接從代理服務器的硬盤中讀取,起到了緩存的作用,尤其對于熱門站點能明顯提高請求速度。
2)防火墻作用
由于所有的客戶機請求都必須通過代理服務器訪問遠程站點,因此可在代理服務器上設限,過濾某些不安全信息。
3)通過代理服務器訪問不能訪問的目標站點
互聯網上有許多開發的代理服務器,客戶機在訪問受限時,可通過不受限的代理服務器訪問目標站點,通俗說,我們使用的翻墻瀏覽器就是利用了代理服務器,雖然不能出國,但也可直接訪問外網。
反向代理 VS 正向代理
1、什么是正向代理?什么是反向代理?
正向代理,架設在客戶機與目標主機之間,只用于代理內部網絡對Internet的連接請求,客戶機必須指定代理服務器,并將本來要直接發送到Web服務器上的http請求發送到代理服務器中。
反向代理服務器架設在服務器端,通過緩沖經常被請求的頁面來緩解服務器的工作量,將客戶機請求轉發給內部網絡上的目標服務器;并將從服務器上得到的結果返回給Internet上請求連接的客戶端,此時代理服務器與目標主機一起對外表現為一個服務器。
2、反向代理有哪些主要應用?
現在許多大型web網站都用到反向代理。除了可以防止外網對內網服務器的惡性攻擊、緩存以減少服務器的壓力和訪問安全控制之外,還可以進行負載均衡,將用戶請求分配給多個服務器。
作為前端開發,每次調試接口,把代碼發到測試服務器,是很費時費事的一件事情。
為了提高效率,想到了nginx反向代理來解決這一問題。
接口地址:
test.com
訪問地址:
localhost
最核心的問題就是,登錄時,無法寫入cookie的問題,為了解決這個問題,走了不少彎路。
worker_processes 1; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 10; server { listen 80; server_name localhost; location =/ { add_header X-Frame-Options SAMEORIGIN; root D:/workspace/; index index.html; } location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ { charset utf-8; root D:/workspace/; expires 3d; } location = /socket/v2 { proxy_pass http://test.com; proxy_redirect off; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_connect_timeout 30; proxy_send_timeout 30; proxy_read_timeout 60; proxy_buffer_size 256k; proxy_buffers 4 256k; } location / { proxy_pass http://test.com; proxy_set_header Cookie $http_cookie; proxy_cookie_domain test.com localhost; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; } } }
核心代碼在三行代碼上:
proxy_set_header Cookie $http_cookie; proxy_cookie_domain test.com localhost; proxy_set_header Host test.com;
具體解釋我也是一知半解:
第一個是攜帶cookie,
第二個設置cookie 的 domain
第三個 設置真實的host
重要提示:以上3個的順序不要顛倒,否則代理失敗,我也不知道為什么。
如何在手機上調試呢?
手機上不可能直接訪問localhost,可以把手機和電腦連接到同一個網段,使用電腦的ip進行訪問。
但是這里只代理了localhost,并沒有代理電腦的ip
所以,需要把是上面的server{...}拷貝一份,只需要把里面的localhost全部改成你的電腦ip就可以了,最終代碼:
worker_processes 1; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 10; server { listen 80; server_name localhost; location =/ { add_header X-Frame-Options SAMEORIGIN; root D:/workspace/; index index.html; } location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ { charset utf-8; root D:/workspace/; expires 3d; } location = /socket/v2 { proxy_pass http://test.com; proxy_redirect off; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_connect_timeout 30; proxy_send_timeout 30; proxy_read_timeout 60; proxy_buffer_size 256k; proxy_buffers 4 256k; } location / { proxy_pass http://test.com; proxy_set_header Cookie $http_cookie; proxy_cookie_domain test.com localhost; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; } } server { listen 8080; server_name xx.xx.xx.xx; location =/ { add_header X-Frame-Options SAMEORIGIN; root D:/workspace/; index index.html; } location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ { charset utf-8; root D:/workspace/; expires 3d; } location = /socket/v2 { proxy_pass http://test.com; proxy_redirect off; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_connect_timeout 30; proxy_send_timeout 30; proxy_read_timeout 60; proxy_buffer_size 256k; proxy_buffers 4 256k; } location / { proxy_pass http://test.com; proxy_set_header Cookie $http_cookie; proxy_cookie_domain test.com xx.xx.xx.xx; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host test.com; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; } } }
訪問方法:http://xx.xx.xx.xx:8080 即可
如果是打包工具生成增這個配置的話,可以用nodejs動態獲取你電腦的ip
function getIPAdress() { var interfaces = require('os').networkInterfaces(); for (var devName in interfaces) { var iface = interfaces[devName]; for (var i = 0; i < iface.length; i++) { var alias = iface[i]; if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) { return alias.address; } } } }
所以,這里貼出來一個動態生成nginx.config的工具
function buildNginxConfig(config) { function getIPAdress() { var interfaces = require('os').networkInterfaces(); for (var devName in interfaces) { var iface = interfaces[devName]; for (var i = 0; i < iface.length; i++) { var alias = iface[i]; if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) { return alias.address; } } } } var cwd = process.cwd().replace(/\\/g, '/') + '/app'; var protocol = /https|443/.test(config.ip) ? 'https' : 'http'; var servers = [{ browserIp: 'localhost', port: 80, root: cwd, serverIp: config.ip, protocol: protocol, }, { browserIp: getIPAdress(), port: 8080, root: cwd, serverIp: config.ip, protocol: protocol, }].map(function(item) { return ` server { listen ${item.port}; server_name ${item.browserIp}; location =/ { add_header X-Frame-Options SAMEORIGIN; root ${item.root}; index index.html; } location ~* \\.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ { charset utf-8; root ${item.root}; expires 3d; } location = /socket/v2 { proxy_pass ${item.protocol}://${item.serverIp}; proxy_redirect off; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; proxy_set_header Host ${item.serverIp}; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_connect_timeout 30; proxy_send_timeout 30; proxy_read_timeout 60; proxy_buffer_size 256k; proxy_buffers 4 256k; } location / { proxy_pass ${item.protocol}://${item.serverIp}; proxy_set_header Cookie $http_cookie; proxy_cookie_domain ${item.serverIp} ${item.browserIp}; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host ${item.serverIp}; proxy_set_header X-Real-IP $remote_addr; proxy_set_header REMOTE-HOST $remote_addr; } }`; }).join('\n'); var str = `worker_processes 1; events { worker_connections 1024; } http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 10; ${servers} }`; return str; } exports = module.exports = buildNginxConfig;
以上就是nginx接口實現反向代理配置,小編相信有部分知識點可能是我們日常工作會見到或用到的。希望你能通過這篇文章學到更多知識。更多詳情敬請關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。