栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

使用AJAX加载跨域端点

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

使用AJAX加载跨域端点

jQuery Ajax笔记

  • 由于浏览器安全性的限制,大多数 Ajax 请求都遵循相同的原始策略;该请求无法从其他域,子域,端口或协议成功检索数据。
  • 脚本和JSONP请求不受相同的原始策略限制。

有一些方法可以克服 跨域 障碍:

  • CORS代理替代
  • 打破跨领域障碍

有一些插件可以帮助处理 跨域 请求:

  • 带有YQL和jQuery的跨域AJAX请求
  • 使用jQuery.ajax的跨域请求

小心!

克服此问题的最佳方法是,在后端创建自己的代理,以便代理将指向其他域中的服务,因为在后端不存在 相同的原始策略
限制。但是,如果您不能在后端执行此操作,请注意以下提示。


警告!

使用第三方代理不是安全的做法,因为它们可以跟踪您的数据,因此可以与公共信息一起使用,但 绝不能 与私有数据一起使用。


下面显示的代码示例使用 jQuery.get()
jQuery.getJSON() ,它们都是
jQuery.ajax()的 简写方法。



任何地方的CORS

CORS Anywhere是一个 node.js代理 ,它将CORS标头添加到代理请求中。要使用API​​,只需在URL前面加上API URL。(支持 https:见github仓库)

如果要在需要时自动启用跨域请求,请使用以下代码段:

$.ajaxPrefilter( function (options) {  if (options.crossDomain && jQuery.support.cors) {    var http = (window.location.protocol === 'http:' ? 'http:' : 'https:');    options.url = http + '//cors-anywhere.herokuapp.com/' + options.url;    //options.url = "http://cors.corsproxy.io/url=" + options.url;  }});$.get(    'http://en.wikipedia.org/wiki/Cross-origin_resource_sharing',    function (response) {        console.log("> ", response);        $("#viewer").html(response);});

无论起源

无论起源如何,都是 跨域jsonp
访问。这是anyorigin.com的开源替代方案。

要从 google.com 获取数据 您可以使用以下代码段:

// It is good specify the charset you expect.// You can use the charset you want instead of utf-8.// See details for scriptCharset and contentType options: // http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings$.ajaxSetup({    scriptCharset: "utf-8", //or "ISO-8859-1"    contentType: "application/json; charset=utf-8"});$.getJSON('http://whateverorigin.org/get?url=' +     enpreURIComponent('http://google.com') + '&callback=?',    function (data) {        console.log("> ", data);        //If the expected response is text/plain        $("#viewer").html(data.contents);        //If the expected response is JSON        //var response = $.parseJSON(data.contents);});

CORS代理

CORS Proxy是一个简单的 node.js代理,可为任何网站启用CORS请求。它允许您站点上的javascript代码访问其他域上的资源,这些资源通常由于同源策略而被阻止。

  • CORS代理gr2m
  • CORS代理rmadhuram

它是如何工作的?CORS Proxy利用了跨域资源共享功能,该功能是随HTML
5一起添加的。服务器可以指定它们希望浏览器允许其他网站请求其托管的资源。CORS代理只是一个HTTP代理,它在响应中添加标头,说“任何人都可以请求此请求”。

这是实现目标的另一种方法(请参阅www.corsproxy.com)。您所要做的就是删除
http://www。 从要代理的URL中添加,并在URL前面加上

www.corsproxy.com/

$.get(    'http://www.corsproxy.com/' +    'en.wikipedia.org/wiki/Cross-origin_resource_sharing',    function (response) {        console.log("> ", response);        $("#viewer").html(response);});

CORS代理浏览器

最近,我发现了这个,它涉及各种面向安全性的跨源远程共享实用程序。但这是一个以Flash为后端的黑盒子。

您可以在此处查看其运行情况:CORS代理浏览器
在GitHub上获取源代码:koto / cors-proxy-browser



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/401606.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号