Separation of front and rear ends of nginx to solve cross-domain problems
This article focuses on "nginx front and rear separation to solve cross-domain problems", interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Next, let the editor take you to learn "nginx front and rear separation to solve cross-domain problems"!
Scene
It is suitable for the company to have a front end, and the project adopts front-end separation. Similar to the interface provided by our back-end springboot, the front end specifically writes html to call the corresponding interface to solve cross-domain problems.
Configuration description worker_processes 1 worker_connections events {include mime.types; default_type application/octet-stream; client_max_body_size 10240;} http {include mime.types; default_type application/octet-stream; client_max_body_size 200M; client_header_buffer_size 8k; large_client_header_buffers 8 16k Log_format main'$remote_addr-$remote_user [$time_local] "$request"'$status $body_bytes_sent "$http_referer"'"$http_user_agent"$http_x_forwarded_for"; access_log on; sendfile on; keepalive_timeout 300; gzip on; gzip_http_version 1.0 Gzip_disable "MSIE [1-6]."; gzip_types text/plain application/x-javascript text/css text/javascript; server {listen 80; server_name localhost; client_header_buffer_size 8k; large_client_header_buffers 8 16k; root / usr/share/nginx/html Location / {# forwards the request under the path to the development server opened by the front-end tool chain (such as gulp,webstorm,anywhere) # if it is a production environment, configure it as a static file server # proxy_pass http://localhost:80; # proxy_redirect default using instructions such as root } location / management/ {# forward the request under the / api path to the real back-end server proxy_pass http://192.168.199.131:8090/management/; proxy_cookie_path / management/ /; proxy_set_header Host $host; proxy_set_header Cookie $http_cookie; proxy_set_header Remote_Addr $remote_addr Proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; client_max_body_size 200m; proxy_connect_timeout 18000; proxy_send_timeout 18000; proxy_read_timeout 18000;} location / agents/ {proxy_pass http://192.168.199.131:8092/; Proxy_cookie_path / agents/ /; proxy_set_header Host $host; proxy_set_header Cookie $http_cookie; proxy_set_header Remote_Addr $remote_addr; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; client_max_body_size 200m Proxy_connect_timeout 18000; proxy_send_timeout 18000; proxy_read_timeout 18000;}
Focus on the configuration of location.
For example, the request address http://localhost:80/index.html of frontend html
The address of the front-end calling interface is http://localhost:80/api. In fact, api is not under the changed domain. Under http://192.168.199.111:8888/, two problems need to be solved. The front-end ajax is forwarded to the corresponding location across domains and interfaces.
* * focus on 1 2 3 * *
Location / api/ {/ / 1 proxy_pass http://192.168.199.111:8888/; / / 2 proxy_cookie_path / api/ /; / 3 proxy_set_header Host $host; proxy_set_header Cookie $http_cookie; / / send cookie to solve the session consistency problem proxy_set_header Remote_Addr $remote_addr; proxy_set_header X-Real-IP $remote_addr Proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; client_max_body_size 200m; proxy_connect_timeout 18000; proxy_send_timeout 18000; proxy_read_timeout 18000;} so far, I believe you have a deeper understanding of "nginx front and back end separation to solve cross-domain problems". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!
