CORS cross-domain Nginx configuration is as follows (server or location)

  proxy_set_header Host $host;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  add_header Access-Control-Allow-Origin "$http_origin";
  add_header Access-Control-Allow-Credentials true;
  add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
  add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
  if ($request_method = 'OPTIONS') {
      return 204;
  }
Copy the code

What is a reverse proxy?

Nginx is a reverse proxy server. We can understand why it is a reverse proxy from the following figure. With NGINx-centric, the flow of data is from Server to Nginx to Client. Note that we are talking about data (response data), not requests. We all know that water must flow from upstream to downstream, so give Server a nicknameUpstream serverOf course, I didn’t define the nickname.

Difference between proxy_set_header and add_header

Difference: proxy_set_header is Nginx setting the request header to the upstream server, add_header is Nginx setting the response header to the browser.

proxy_set_header

If Nginx requests an upstream server and adds an additional request header, it needs to use proxy_set_header. In Java, use HttpServletRequest#getHeader(String name) to get the value of the request header. Name is the name of the request header.

For example, proxy_set_header x-request-uri $scheme://$host/$URI;

  String requestUrl = request.getHeader("X-Request-URI");
  if (requestUrl == null) {
    // Get the client request address from the Servlet server
    requestUrl = request.getRequestURL().toString();
  }
Copy the code

add_header

When Nginx responds to data, to tell the browser some header information, use add_header. For example, cross-domain access

add_header 'Access-Control-Allow-Origin' The '*';
Copy the code

Nginx addresses Host, x-real-IP, and X-Forwarded-for

Client address (address for requesting services) : 192.168.1.1

Nignx Server IP address: 192.168.1.2

Back-end server IP address: 192.168.1.3

X-Real-IP

This is the real IP address of the client. If $remote_ADDR is set, the back-end server can obtain the real IP address of the client, which is 192.168.1.1 in this example

Host

Set host to $proxy_host, which is the host value set in proxy_pass, 192.168.1.3, which is the server IP address.

$http_host = http://test.com $http_host = http://test.com $http_host = http://test.com

If the request header from the client does not contain the HOST field, $HOST indicates the address of the nginx proxy server, which in this case is 192.168.1.2.

$http_host is not a fixed variable. It is the result of a wildcard ($http_HEADER) containing the HEADER property. For example, $http_content_type represents the content-type property in the request HEADER. Similarly, $http_host refers to the host attribute in the request header.

X-Forwarded-For

The value of this variable is $proxy_add_X_forwarded_for and $remote_ADDR. In the case of only one proxy server forwarding, the effect of the two variables is similar, and both can actually display the original client IP.

For example, user A, whose IP address is 192.168.1.1, requests an application that has been forwarded twice by Nginx. On the first Nginx (192.168.1.2), the configuration is as follows:

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
Copy the code

Now $proxy_add_x_forwarded_for variables “X-ray Forwarded – For” part is empty, so only $remote_addr, and the value of $remote_addr is the user’s IP, The value of the X-Forwarded-For variable is the user’s IP address, 192.168.1.1.

On the second nginx, the configuration is as follows:

proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
Copy the code

If ($proxy_add_X_forwarded_for) {if ($forwarded_for) {if ($forwarded_FOR) {if ($forwarded_FOR) {if ($forwarded_FOR) {if ($forwarded_FOR) {if ($forwarded_FOR) { Then the value of X-Forwarded-For becomes “the real IP address of the user, the IP address of the first Nginx.” That is, 192.168.1.1,192.168.1.2.

Set x-Forwarded-For to $PROxy_ADD_X_FORWARded_for.

Cross domain header Settings

Access-Control-Allow-Origin

The response header specifies whether the resources for the response are allowed to be shared with the given Origin. Developer.mozilla.org/zh-CN/docs/…

Access-Control-Allow-Credentials

The response header indicates whether the response to the request can be exposed to the page. Returns true, and all other values do not. Credentials can be cookies, Authorization headers, or TLS Client certificates. Developer.mozilla.org/zh-CN/docs/…

Access-Control-Allow-Methods

The response to the Preflight Request. Specifies the allowed methods or list of methods for the resource the client is accessing. Developer.mozilla.org/zh-CN/docs/…

Access-Control-Allow-Headers

Used in a Preflight request to list the Headers that will appear in the access-Control-request-HEADERS field of a formal request. Developer.mozilla.org/zh-CN/docs/…

The OPTIONS request

The HTTP OPTIONS method is used to get the communication OPTIONS supported by the destination resource. In CORS, OPTIONS precheck requests are initiated when HTTP requests are complex. Developer.mozilla.org/zh-CN/docs/…

Simple and complex requests

A simple request

A request that meets the following conditions is a simple request: The request method can be GET, POST, or HEAD

There is no custom request header except for the following request header fields

  • Accept
  • Accept-Language
  • Content-Language
  • Content-Type
  • DPR
  • Downlink
  • Save-Data
  • Viewport-Width
  • Width
  • There are only three types of content-type values. Text /plain, multipart/form-data, Application /x-www-form-urlencoded

None of the XMLHttpRequestUpload objects in the request are registered with any event listeners (not validated)

The XMLHttpRequestUpload object can be accessed using the xmlHttprequest.upload attribute

ReadableStream object not used in request (not validated)

Complex request

Non-simple requests are complex requests. Complex requests can also be called requests that need to be prechecked before the actual request can be made.

Request with credentials

In general, browsers do not send identity credentials for cross-domain XMLHttpRequest or Fetch requests. If you want to send credential information, you need to set some special flag bit for XMLHttpRequest.

If the withCredentials set to True for XHR are used to send Cookies to the server, if the server needs to send Cookies to the client, The access-Control-allow-credentials: true response header information is also required.

For requests with credentials, the server must not set access-Control-allow-origin to *.

This is because the request header carries Cookie information, and if access-Control-Allow-Origin is set to *, the request will fail. Set access-Control-allow-Origin to http:// foo.example (request source) and the request will execute successfully.