Nginx solves cross-origin problems and nginx solves cross-origin problems

Source: Internet
Author: User

Nginx solves cross-origin problems and nginx solves cross-origin problems

Here, we use the reverse proxy function of Nginx to solve cross-domain problems. As for what is the reverse proxy of Nginx, please use Baidu or Google. As a reverse proxy server, nginx forwards http requests to another or some servers. By ing a local url prefix to the web server for cross-origin access, you can implement cross-origin access. The browser accesses a url on the same origin server. Nginx detects the url prefix and forwards the http request to the real physical server. Use the rewrite command to remove the prefix. In this way, the real server can process the request correctly and does not know that the request is from the proxy server.

The specific solution is as follows:

Edit in nginx. conf

Server {location/{root html; index index.html index.htm; // Allow cros cross-Origin Access add_header 'access-Control-Allow-origin ''*';} // customize the local path location/apis {rewrite ^. + apis /? (. *) $/$1 break; include uwsgi_params; proxy_pass http://www.lyz.com ;}}

Then, I deployed the project in the nginx html root directory and set the url from http://www.lyz.com/apistest/testto /apis/apistest/test.

For example, the Ajax request is as follows:

$. Ajax ({type: "post", dataType: "json", data: {'parameter ': JSON. stringify (data)}, url: "http://www.lyz.com/apistest/test", async: flag, beforeSend: function (xhr) {xhr. setRequestHeader ("Content-Type", submitType. content_Type); xhr. setRequestHeader ("user-id", submitType. user_id); xhr. setRequestHeader ("role-type", submitType. role_type); xhr. setRequestHeader ("access-token", getAccessToken (). token) ;}, success: function (result, status, xhr) {}, error: function (e) {layerMsg ('request failed, please try again later ')}});

Modify it to the following request:

$. Ajax ({type: "post", dataType: "json", data: {'parameter ': JSON. stringify (data)}, url: "/apis/apistest/test", async: flag, beforeSend: function (xhr) {xhr. setRequestHeader ("Content-Type", submitType. content_Type); xhr. setRequestHeader ("user-id", submitType. user_id); xhr. setRequestHeader ("role-type", submitType. role_type); xhr. setRequestHeader ("access-token", getAccessToken (). token) ;}, success: function (result, status, xhr) {}, error: function (e) {layerMsg ('request failed, please try again later ')}});

Now, the problem is solved.

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.