Home > Developer > JavaScript
In WEB development, we often encounter problems with cross-domain requests. Cross-domain problems, there are many solutions: Proxy request, domain settings, flash mode, Jsonp way, Access-control-allow-origin. The JSONP is the most versatile and simple to use: A JavaScript callback is used to transmit data across domains.
JSONP solution for Cross-domain problems XHTML
<script src= "Http://www.other-domain.cn/api?callback=callback" ></script>
In the external interface (in this case http://www.other-domain.com/api), the dynamic output Javascript invoke code, with PHP code as an example:
Data Interface Code PHP
| The code is as follows | Copy Code |
| <?php $data = ' data '; $callback = Isset ($_get[' callback '))? $_get[' callback ']: ' Callback '; echo "$callback (' $data ');"; ?> |
|
In this way, you can read the data by implementing the callback function in the local page.
JSONP cross-domain data xhtml
| The code is as follows | Copy Code |
| <!doctype html> <meta charset= "Utf-8" > <title>Demo</title> <body> <script type= "Text/javascript" > function callback (data) { Alert (' The data obtained is: '); } </script> <script type= "Text/javascript" src= "Http://www.other-domain.com/api?callback=callback" ></script> </body> |
|
If the transmitted data is sensitive and does not want to be read by unauthorized Web sites, the usual practice is to make the requested Referer checksum in the API. If the Referer is not empty and is not a licensed domain name, the request is rejected. At this point, the code for the API is similar to the following:
Reject requests from untrusted Web sites php
| The code is as follows | Copy Code |
| <?php if (Isset ($_server[' http_referer ')) { $url _info = Parse_url ($_server[' http_referer ')); if ($url _info[' host ']!== ' www.allowed-domain.com ') { Header ("http/1.1 404 Not Found"); Exit } } $data = ' data '; $callback = Isset ($_get[' callback '))? $_get[' callback ']: ' Callback '; echo "$callback (' $data ');"; ?> |
|
If it is not authorized, the calling API will be rejected. In the above example, the corresponding is 404.
But is this really safe for the callee? Is the API's data really not readable by unauthorized web sites?
The answer is: No.
Analysis of the API interface code above shows that when requesting data, do not send HTTP Referer information, you can read the data normally.
So how do you load JS without sending HTTP Referer?
Usually, we load the JS file through the script tag, the browser will send Referer information to JS server:
Xhtml
| The code is as follows | Copy Code |
| Get/api.php?callback=callback http/1.1 Host:www.other-domain.com Connection:keep-alive Cache-control:max-age=0 Accept: */* Referer:http://www.fising.cn/demo/test.html Accept-encoding:gzip,deflate,sdch accept-language:zh-cn,zh;q=0.8,en;q=0.6,ja;q=0.4,zh-tw;q=0.2 |
|
However, by some means, you can make the browser load JS files, do not send HTTP Referer.
Method One: HTTPS page request HTTP JS
HTTP Referer is not sent when the request page differs from the URL Scheme of the requested resource. For example, open the Taobao login page (https://login.taobao.com/member/login.jhtml) and find that it will load a picture resource from the HTTP server, and then not send referer information:
HTTP request Header XHTML
| The code is as follows | Copy Code |
| get/imgextra/i2/10039155/tb2uqnjapxxxxaxxpxxxxxxxxxx_!! 10039155-0-matrixgapp.jpg http/1.1 Host:img02.taobaocdn.com Connection:keep-alive user-agent:mozilla/5.0 (Windows NT 6.1; WOW64) applewebkit/537.36 (khtml, like Gecko) chrome/37.0.2062.120 safari/537.36 Accept: */* Accept-encoding:gzip,deflate,sdch accept-language:zh-cn,zh;q=0.8,en;q=0.6,ja;q=0.4,zh-tw;q=0.2 If-modified-since:thu, Sep 2014 06:33:17 GMT |
|
When this page loads other pictures from the HTTPS server, the Referer message is sent.
Method II: Using RFC2397
RFC 2397 defines a URL format: data:[<mediatype>][;base64],<data>
It looks familiar, doesn't it? We took advantage of this by using the Base64 code to load pictures. Again, we can use this to load the JS file without sending Referer information:
Send request XHTML using the URL format defined in RFC 2397
| The code is as follows | Copy Code |
| <!doctype html> <meta charset= "Utf-8" > <title>Demo</title> <body> <iframe src= "Data:text/html;charset=utf-8,<script type= ' Text/javascript ' >function callback" (data) {alert (' The data obtained is: ' + data ';} </script><script src= ' http://www.other-domain.com/api?callback=callback ' ></script> ' > </body> |
|
You can grab the bag and see, this time loading the API file and not sending Referer information. Note that you need to specify charset, otherwise there may be garbled problems.
Method Three: IFrame label src attribute Hack method
iframe src Hack method xhtml
| The code is as follows | Copy Code |
| <!doctype html> <meta charset= "Utf-8" > <title>Demo</title> <body> <iframe src= "javascript: ' <script>function callback (data) {alert (' gets: ');} </script><script src= ' http://www.other-domain.cn/api?callback=callback ' ></script> ' ></ Iframe> </body> |
|
@
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
