Shulou(Shulou.com)06/01 Report--

What this article shares with you is about the reverse proxy configuration of the nginx interface. The editor thinks it is very practical, so I share it with you. I hope you can get something after reading this article. Let's follow the editor to have a look.

1. What is a proxy server

In the proxy server, when the client sends the request, it will not send it directly to the destination host, but first send it to the proxy server. after receiving the request from the client, the proxy service sends it to the host and receives the data returned by the destination host. It is stored in the hard disk of the proxy server and then sent to the client.

2. Why use a proxy server

1) improve access speed

Because the data returned by the target host will be stored in the hard disk of the proxy server, the next time the customer visits the same site data, it will be read directly from the hard disk of the proxy server, which plays the role of cache. especially for popular sites, it can significantly improve the speed of requests.

2) the function of firewall

Because all client requests must access the remote site through the proxy server, you can set limits on the proxy server to filter some unsafe information.

3) access the inaccessible target site through the proxy server

There are many developed proxy servers on the Internet. when access is limited, clients can access the target site through unrestricted proxy servers. generally speaking, the wall-climbing browser we use is the use of proxy servers, although they cannot go abroad. But you can also access the external network directly.

Reverse proxy VS forward proxy

1. What is a forward agent? What is a reverse proxy?

The forward proxy, which is set up between the client and the target host, is only used to proxy Internet connection requests from the internal network. The client must specify a proxy server and send the http requests that should be sent directly to the Web server to the proxy server.

The reverse proxy server is set up on the server side, which alleviates the workload of the server by buffering the frequently requested pages, forwards the client request to the target server on the internal network, and returns the result obtained from the server to the client requesting connection on the Internet. At this time, the proxy server behaves as a server with the target host.

2. What are the main applications of reverse proxy?

Reverse proxies are now used on many large web sites. In addition to preventing the vicious attack of the external network on the intranet server and caching to reduce the pressure on the server and access security control, it can also carry out load balancing and distribute user requests to multiple servers.

As a front-end development, it is time-consuming and time-consuming to debug the interface and send the code to the test server.

In order to improve efficiency, we think of nginx reverse proxy to solve this problem.

Interface address:

Test.com

Access address:

Localhost

The core problem is that when logging in, I can't write to cookie. In order to solve this problem, I have taken a lot of detours.

Worker_processes 1 leading 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 Dizugamot workspacepace; index index.html;} location ~ *\. (html | htm | gif | jpeg | bmp | ico | txt | css | swf | woff | woff2 | ttf json | svg | cur | vue | otf | eot) ${charset utf-8 Root expires workspace upgrade; expires 3d;} location = / socket/v2 {proxy_pass and 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;}

The core code is on three lines of code:

Proxy_set_header Cookie $http_cookie;proxy_cookie_domain test.com localhost;proxy_set_header Host test.com

I also have little knowledge of the specific explanation:

The first one is to carry cookie.

The second one sets the domain of cookie

The third one sets the real host

Important note: do not reverse the order of the above three, otherwise the agent fails, I do not know why.

How to debug on the mobile phone?

It is impossible to directly access the localhost on the mobile phone. You can connect the mobile phone and the computer to the same network segment and use the computer's ip to access it.

But only localhost is represented here, and there is no ip for computers.

So, you need to make a copy of the server {...} above, just change all the localhost in it to your computer ip, and the final code:

Worker_processes 1 leading 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 Dizugamot workspacepace; index index.html;} location ~ *\. (html | htm | gif | jpeg | bmp | ico | txt | css | swf | woff | woff2 | ttf json | svg | cur | vue | otf | eot) ${charset utf-8 Root expires workspace upgrade; expires 3d;} location = / socket/v2 {proxy_pass and 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 Index index.html;} location *\. (html | htm | gif | jpg | jpeg | png | ico | txt | js | css | swf | woff | woff2 | ttf | svg | cur | vue | otf | eot) ${charset utf-8; root Dvirtual workspacehammer; 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;}

Access method: http://xx.xx.xx.xx:8080

If the packaging tool is used to generate and add this configuration, you can use nodejs to dynamically obtain your computer's ip

Function getIPAdress () {var interfaces = require ('os'). NetworkInterfaces (); for (var devName in interfaces) {var iface = interfaces [devName]; for (var I = 0; I < iface.length; iTunes +) {var alias = iface [I] If (alias.family = = 'IPv4' & & alias.address! = =' 127.0.0.1'& &! alias.internal) {return alias.address;}

So, here is a tool for dynamically generating 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; iTunes +) {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 | bmp | png | ico | txt | js | css | swf | woff | woff2 | 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 affairs 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; above is the reverse proxy configuration of the nginx API. The editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.