nginx インターフェイスのリバース プロキシ構成の概要
作为前端开发,每次调试接口,把代码发到测试服务器,是很费时费事的一件事情。
为了提高效率,想到了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教程
以上がnginx インターフェイスのリバース プロキシ構成の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











クラウドサーバーでnginxドメイン名を構成する方法:クラウドサーバーのパブリックIPアドレスを指すレコードを作成します。 NGINX構成ファイルに仮想ホストブロックを追加し、リスニングポート、ドメイン名、およびWebサイトルートディレクトリを指定します。 nginxを再起動して変更を適用します。ドメイン名のテスト構成にアクセスします。その他のメモ:SSL証明書をインストールしてHTTPSを有効にし、ファイアウォールがポート80トラフィックを許可し、DNS解像度が有効になることを確認します。

nginxが開始されるかどうかを確認する方法:1。コマンドラインを使用します:SystemCTLステータスnginx(Linux/unix)、netstat -ano | FindStr 80(Windows); 2。ポート80が開いているかどうかを確認します。 3.システムログのnginx起動メッセージを確認します。 4. Nagios、Zabbix、Icingaなどのサードパーティツールを使用します。

すべてのコンテナ(Docker PS)をリストする手順に従って、Dockerコンテナ名を照会できます。コンテナリストをフィルタリングします(GREPコマンドを使用)。コンテナ名(「名前」列にあります)を取得します。

nginxバージョンを照会できるメソッドは次のとおりです。nginx-vコマンドを使用します。 nginx.confファイルでバージョンディレクティブを表示します。 nginxエラーページを開き、ページタイトルを表示します。

Windowsでnginxを構成する方法は? nginxをインストールし、仮想ホスト構成を作成します。メイン構成ファイルを変更し、仮想ホスト構成を含めます。 nginxを起動またはリロードします。構成をテストし、Webサイトを表示します。 SSLを選択的に有効にし、SSL証明書を構成します。ファイアウォールを選択的に設定して、ポート80および443のトラフィックを許可します。

NGINXサーバーを起動するには、異なるオペレーティングシステムに従って異なる手順が必要です。Linux/UNIXシステム:NGINXパッケージをインストールします(たとえば、APT-GetまたはYumを使用)。 SystemCtlを使用して、NGINXサービスを開始します(たとえば、Sudo SystemCtl Start NGinx)。 Windowsシステム:Windowsバイナリファイルをダウンロードしてインストールします。 nginx.exe実行可能ファイルを使用してnginxを開始します(たとえば、nginx.exe -c conf \ nginx.conf)。どのオペレーティングシステムを使用しても、サーバーIPにアクセスできます

Dockerでコンテナを作成します。1。画像を引く:Docker Pull [ミラー名]2。コンテナを作成:Docker Run [Options] [Mirror Name] [コマンド]3。コンテナを起動:Docker Start [Container Name]

Docker Containerの起動手順:コンテナ画像を引く:「Docker Pull [Mirror Name]」を実行します。コンテナの作成:「docker create [options] [mirror name] [コマンドとパラメーター]」を使用します。コンテナを起動します:「docker start [container name or id]」を実行します。コンテナのステータスを確認してください:コンテナが「Docker PS」で実行されていることを確認します。
