Ajax cross-Origin

Source: Internet
Author: User

I used to think that AJAX cannot be cross-origin and never tried it. Today, I tried Ajax cross-origin request data. The same is true for sharing.

The company made a pure static html website, but the company's leaders said that we should add announcements because our background management system and static pages are on different servers and different domain names, the HTML server does not have a PHP environment, which requires data exchange between two domains. Various implementation methods were discussed, IFRAME was eliminated, and Script Loading technology was later used. The details are as follows:

<script src="http://www.baidu.com"></script>

This implementation method has a limitation. What if we need to pass the parameter? For example: http: // localhost/test/index. php? Id = 3

First, this is a purely static html page. You can only get Parameters Using Js.

JS obtained the get parameter and searched it online. The Code is as follows:

VaR url = Document. url; var para = ''; If (URL. lastindexof ("? ")> 0) {para = URL. substring (URL. lastindexof ("? ") + 1, URL. length); var arr = para. split ("&"); Para = ""; for (VAR I = 0; I <arr. length; I ++) {para = arr [I]. split ("=") [1];} // para is the value of the first parameter}

Obtain the parameter value and assemble it into the link we want to load. This makes it possible to implement our functions.

In fact, this is not the case. The method we implement is to load remote links using JavaScript. However, before loading, we need to obtain the parameter value to determine the link (for example, http: // localhost/test/index. php? Id = 3), but the working mechanism of the browser is to load the HTML before running the JS script. This implementation method fails!

I remember that I had a project before, similar to getting Sina stock data and displaying it in real time. The cross-origin of AJAX is used.

I searched the internet and found that JQuery has two solutions for Ajax cross-origin requests, but they only support the get method. They are JQuery. ajax jsonp and jquery. getScript. Http://www.open-open.com/lib/view/open1334026513327.html)

The Sina stock acquisition method uses the script method.

        $.ajax({            url:"http://localhost/index.php?id="+para,            dataType:"script",            cache:"false",            type:"GET",            success:function(a){                $("#title").html(announce_title);                $("#date").html(announce_date);                $("#content").html(announce_content);            }        }); 

Http: // localhost/index. php? Id = 3 is printed in this format.

  

var announce_title="mytitle"; var announce_date="2013-04-17 13:36:15"; var announce_content="this is a test";

Therefore, as long as the preceding data format is output remotely, data exchange between html and the system can be realized.

The rising posture again.

Related Article

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.