如何使用jQuery AJAX加载跨域html页面?
如何使用jQuery AJAX加载跨域HTML页面?
假设我想使用jQuery AJAX在我的域外获取一个页面:
$.get('http://www.domain.com/mypage.html', function(data) { alert(data); });
我可能会收到此错误消息:
XMLHttpRequest无法加载http://www.domain.com/path/filename 。 Access-Control-Allow-Origin不允许使用null。
由于Same-origin策略,我们无法使用AJAX加载跨域页面。
我可以尝试使用’jsonp’来绕过这个限制:
$.ajax({ type: "GET", url: url, dataType: "jsonp", success: function(data){ console.log(data); } });
但是如果这个网站不支持’jsonp’怎么办? 这可能是个问题。
如果我只想阅读外部页面并解析其HTML,该怎么办?
我知道这是一个老post。 但是,我希望这会帮助那些正在寻找同样的人。
只是你不能。 – 同源策略或您需要为www.domain.com
设置CORS标头
但是,如果您只想向页面获取外部页面内容,则可以执行以下解决方法:
在服务器中创建端点以返回给定外部URL的HTML内容。 (因为您无法获取浏览器的外部内容 – 同源策略 )
JS:
var encodedUrl = encodeURIComponent('http://www.domain.com/mypage.html'); $.get('http://www.yourdomain.com/getcontent?url=' + encodedUrl, function(data) { console.log(data); });
从URL读取到.NET中的字符串的最简单方法 – 可以使用它来创建/getcontent
端点
您可以使用’ AJAX Cross Origin ‘一个jQuery插件来加载跨域HTML页面。 AJAX Cross Origin是一个允许Cross Origin AJAX请求的jQuery插件。 使用此插件,我们可以轻松绕过Same-origin策略并执行跨域请求。
它使用起来非常简单:
$.ajax({ crossOrigin: true, url: url, success: function(data) { console.log(data); } });
您可以在这里阅读更多相关信息: http : //www.ajax-cross-origin.com/