多个AJAX请求冻结浏览器

Question

在页面加载时，我提出了两个AJAX请求：一个用于从Youtube频道提取最新视频，另一个用于从博客提取最新帖子。两个脚本都能正常工作

无论出于何种原因，我无法在任何浏览器（Chrome，Firefox，Safari和Opera）中对其进行测试。请求是否太大？我在使用Chrome时遇到了CORS支持方面的问题（至少这是我认为正在发生的事情），所以博客请求不在那里工作，并完全抵消了视频请求（它不起作用）。

这是我得到的JavaScript开发控制台在Chrome中的错误：

的XMLHttpRequest无法加载http://devingraham.blogspot.com/rss.xml。 Access-Control-Allow-Origin不允许Origin null。

如果我改变...

var tmp = $(this).find("content:first").text(); 

...只是觉得 “标题：第一”，相反，它呈现细微的Safari不结冰。如果我将它保存在内容中​​并加载页面，我可以很好地看到帖子加载，但是页面冻结并且不会加载视频。所以也许它太多了？我知道一个事实，即我正在拉的帖子是相当长的，但它会引起任何问题似乎很愚蠢。那么你有什么想法吗？

这里的脚本：

<script type="text/javascript" charset="utf-8"> 

    $(function() { 
      $.ajax({ 
      type: "GET", 
      url: "http://gdata.youtube.com/feeds/base/users/devinsupertramp/uploads?orderby=updated&alt=rss&client=ytapi-youtube-rss-redirect&v=2", 
      dataType: "xml", 
      success: parseVideo 
      }); 
      $.ajax({ 
      type: "GET", 
      url: "http://devingraham.blogspot.com/rss.xml", 
      dataType: "xml", 
      success: parseBlog 
      }); 
    }); 

    function parseVideo(xml) { 
     $(xml).find("item:first").each(
      function() { 
       var tmp = $(this).find("link:first").text(); 
       tmp = tmp.replace("http://www.youtube.com/watch?v=", ""); 
       tmp = tmp.replace("&feature=youtube_gdata", ""); 
       tmp2 = "http://www.youtube.com/embed/" + tmp + "?autoplay=1&controls=0&rel=0&showinfo=0&autohide=1"; 
       var iframe = $("#ytplayer"); 
       $(iframe).attr('src', tmp2); 
      } 
     ); 
    } 

    function parseBlog(xml) { 
     $(xml).find("entry:first").each(
      function() { 
       var tmp = $(this).find("content:first").text(); 
       var post = $("#blog"); 
       post.append(tmp); 
      } 
     ); 
    } 
</script> 

Answer 1

默认情况下，你不能因为同源策略的跨域AJAX请求。

你可以解决这个问题，但它需要cooperation of the site on the other domain明确地允许这种类型的请求。

参见：Ways to circumvent the same-origin policy