Ajax cross-Domain Problem Resolution (3)--callee resolves cross-domain

Source: Internet
Author: User

Callee resolution cross-domain refers to the addition of the specified field in the HTTP response header, allowing callers to invoke

Can be added in two places
1.apache/nginx (HTTP server)
2.tomcat (Application Server)

How does the browser determine cross-domain?
A closer look reveals that there is an Origin field in the request header for cross-domain requests, and the value of this field is the information for the current field.
When the browser discovers that the request is cross-domain, it adds a field of information for the current field in the request header of the current request, and then checks that there is no corresponding information in the response header after returning.
If not, then an error.

Does the browser execute first or judge first?
Simple request first execution after judgment, non-simple request first judgment after execution.

What is a simple request?
A simple request is a request in the header:
1. No custom request Header
2.content-type are the following types:
Text/plain
Multipart/form-data
application/x-www-form-urlencoded
Common methods are:, POST

Non-simple request:
Aja Request for 1.put,delete method
2. Send an AJAX request in JSON format
3. Ajax requests with a custom header
For non-simple requests, the browser adds a field to the HTPP request header:
Access-control-request-headers:content-type
That is, ask the server to allow this Content-type request header
In this case, to make a non-trivial request pass the preflight, you need to add the following fields to the response header:
Access-control-allow-headers:content-type
that supports Content-type

The cross-domain code that executes a simple request discovers that the backend server returns data normally, and the returned data can be found in Chrome's network.
So, simply ask the browser to do it first and then judge.
When a non-simple request occurs across domains, the browser detects a non-trivial cross-domain request and automatically issues an option request, which is called a preflight command that sends a real request when the preflight passes.
That is, a non-trivial request can see two requests in the network, one option request, one real request.
Because a non-trivial command is too time consuming (two requests), you can add a field to the response request header:
access-control-max-age:3600 (unit of seconds)
That is, within one hours, the request can be cached.
At this point, the first access to this method requires two requests, and the second time only need to request once, remove the preflight command.
However, when Access-control-max-age and Access-control-allow-headers are removed, the request will still succeed because the request is already cached.

One: callee-Filter Solution

The filter solution is primarily to add the following information to the HTTP response header:
Access-control-allow-origin: Domain Name
The current cross-domain is supported as long as the domain name contains the value of the Origin field in the request header
If Access-control-allow-origin: *, all domain access is supported
This field is required

If you add Access-control-allow-methods: The request method, it means that only specific request methods are supported across domains.
The access-control-allow-methods:get indicates that only the Get method is supported for cross-domain.
If Access-control-allow-methods: * means that all methods are supported across domains, at this time, the same is written and not written.
This field is optional, not required.

Second: callee-Nginx Solution

Use Nginx to configure the proxy server, the front-end request address changed to Nginx configuration Proxy server.
It is possible to configure a similar response header in the filter solution in Nginx.

Third: callee-Apache Solution

Similar to Nginx solution, just use Apache instead of Nginx.

Four: callee-Spring Framework Solution

There is a note in the spring framework named @crossorigin that is used to handle cross-domain requests.
Using the @crossorigin annotations in your code, based on the spring framework, solves cross-domain issues.
@CrossOrigin can be added to a class, or added to a specific method, plus a class that represents all of the methods of this class support cross-domain, plus in the method that represents this method to support cross-domain.

Ajax cross-Domain Problem Resolution (3)--callee resolves cross-domain

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.