jquery asynchronous requests (such as Getjson) cross-domain Solutions

Source: Internet
Author: User

I believe that everyone in the use of jquery asynchronous request is not their own site relative resources (through the URL of others site directly read) so often encounter the following error, in fact, these errors are browser security mechanism "ghost", just let us develop the road encountered a stumbling block.

When you request directly in the browser: "Http://www.weather.com.cn/adat/sk/101110101.html" will get the JSON data you need.

When you read through jquery's Getjson method, you get the following error.

Chrome Tip Error:

XMLHttpRequest cannot load http://www.weather.com.cn/adat/sk/101110101.html. No ' Access-control-allow-origin ' header is present on the requested resource. Origin ' null ' is therefore not allowed access.

Firefox tip error:

Cross-origin requests have been blocked: the same-origin policy prohibits reading remote resources located in http://www.weather.com.cn/adat/sk/101110101.html. (Reason: CORS header is missing ' Access-control-allow-origin ').

Understanding cross-Domain must first understand the Origin policy. The same-origin policy is a very important security policy that is implemented on the browser for security reasons.

    • What is the same Origin : The URL consists of a protocol, a domain name, a port, and a path, and if two URLs have the same protocol, domain name, and port, they are homologous.
    • Same- origin policy : The browser's same-origin policy restricts the "document" or script from different sources to read or set certain properties on the current document. Scripts loaded from one domain do not allow access to the document properties of another domain.

If it is a website developed by oneself that is very simple, only need to output JSON in the background (C #) while adding a header header to response, enabling cross-domain requests can be a perfect solution to the problem.

The C # backend only needs to add one of the following words:

Response.AddHeader ("Access-control-allow-origin", "null");

If it is someone else's website there is no way, can only use the background to deal with, after all, C # read There is no cross-domain problem. After C # reads, the background is converted to add the output after the response header, so that it can cross the domain.

The inspiration came from: "Eezzo.com" to me.

Of course, for those who could not develop their own, can directly invoke the Eezzo.com API direct conversion, so that we can perfectly solve the jquery in the browser cross-domain request problem. Paste the code below:

$ (document). Ready (function () {//test cross-domain request connection var requesturl = "http://www.weather.com.cn/adat/sk/101110101.html"; It is important to note that the actual requested URL is actually read from eezzo.com in the form of a parameter, so we will encode the URL and use the encodeURI method to $.getjson ("Http://eezzo.com/API/CD", {URL  : encodeURI (Requesturl)}, function (JSON) {alert (JSON); });});

With the above code, we can easily get the API data provided by the major websites. The JSON data read by the instance is traced as follows:

There are 2 ways of implementing cross-domain:

1, through their own writing code implementation;

2, through the eezzo.com provided by the API directly into the read, after all, take doctrine is still more reliable

Below are some of the materials used in the test to get the weather JSON data

C # Get weather JSON parsing http://blog.csdn.net/ecocn/article/details/8542152

Weather Forecast Interface | Api| City Code http://blog.csdn.net/a535537066/article/details/6656365

jquery asynchronous requests (such as Getjson) cross-domain Solutions

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.