javascript - Is there a way to retrieve an ajax response sent from an iframe? - Stack Overflow

admin管理员组

文章数量:1344949

I was wondering if there is any way to retrieve the response of an ajax request sent from an iframe.

The iframe does something like the following:

1. script in iframe sends an ajax request
2. iframe gets a response, and updates content within iframe

What I would like to do is to intercept that request outside of the iframe, and use that information to update the page.

If you go into chrome's dev tools, and go to the network tab, you can see the request/response that the iframe makes. It would be nice if there is a window event or something similar that triggers everytime a response es in on the page.

NOTE: the iframe is a page that is not in the same domain.

I was wondering if there is any way to retrieve the response of an ajax request sent from an iframe.

The iframe does something like the following:

1. script in iframe sends an ajax request
2. iframe gets a response, and updates content within iframe

What I would like to do is to intercept that request outside of the iframe, and use that information to update the page.

If you go into chrome's dev tools, and go to the network tab, you can see the request/response that the iframe makes. It would be nice if there is a window event or something similar that triggers everytime a response es in on the page.

NOTE: the iframe is a page that is not in the same domain.

• javascript
• html
• ajax

Share Improve this question Follow asked Jul 12, 2013 at 2:40 kennypukennypu 6,07122 gold badges2323 silver badges2929 bronze badges 2

• The cross-domain is the issue, not the placement of the response into the non-iframe document. The AJAX call is happening on the other domain? Do you also have the ability to author scripts on that domain? – DevlshOne Commented Jul 12, 2013 at 2:45
• Cross Domain = Not going to happen – epascarello Commented Jul 12, 2013 at 2:46

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

If the child iframe is in a different domain to the parent, you can't really do anything that's going to work across browsers. See jasonjifly's answer below for techniques that will work on some browsers assuming you have control over the client scripts on both frames.

If the parent and child are on the same domain, then you can achieve what you are looking for.

For example, assuming you're using jquery, you could have this code in your iframe:

$.ajax(function() {
   .....
   plete: function() {
       window.parent.onAjaxComplete('Hi there');
   }
});

Along with this code in your parent frame:

function onAjaxComplete(msg)
{
    alert(msg);
}

To achieve similar results in a cross-domain scenario you could have the parent frame poll the server. When the server receives an ajax request from the child iframe it could then alert the parent page via the polling service. Obviously this would only be suitable if you have control over the services called by the child iframe.

In theory, it's forbidden to municate between two cross domain iframe, due to the same-origin policy, please refer to this page: https://developer.mozilla/en-US/docs/Web/JavaScript/Same_origin_policy_for_JavaScript

Before HTML5, we have some workarounds:

1. If you just want to use iframe to get cross domain data, you can use JQuery:JSONP, the essence is using . "" allows executing a cross domain javascript.

2. Another way is "An iframe in an iframe in an iframe", you can refer to this page: http://blog.cakemail./the-iframe-cross-domain-policy-problem/

HTML5:

1. window.postMessage, refer to this page: https://developer.mozilla/en-US/docs/Web/API/window.postMessage

2. HTML5 CORS, you need to configure server, refer to this page: http://www.html5rocks./en/tutorials/cors/

My remendation is using solution 1, it can work on almost all mainstream browsers.

(function() {
    var origOpen = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function() {
        this.addEventListener('load', function() {
            var json = $.parseJSON(this.responseText);


        });
        origOpen.apply(this, arguments);
    };
})();

本文标签： javascriptIs there a way to retrieve an ajax response sent from an iframeStack Overflow