草庐IT

javascript - 跨源资源共享 (CORS) 概念

coder 2024-05-06 原文

我对跨域 JavaScript 的概念有疑问。

有一个服务器(ex amazon.com),只有选定的域可以使用他们的网络服务。 所以肯定的是,如果我尝试使用他们的服务,从我的本地,我不能。 我在我的控制台上得到了这个

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://football20.myfantasyleague.com/2014/export?TYPE=rosters&L=52761&W=&JSON=0. This can be fixed by moving the resource to the same domain or enabling CORS.

PS:我也用jquery跨域的方式,但是没用。

但是,如果所选域中的某个域使用 Amazon 的网络服务,则有一个 JavaScript,如果我们将其包含在我们的 html 中,它就可以工作。

<script src="http://example.com"></script>

他们有一种通过 Ajax 获得响应的方法。

我的问题是:

  1. 当我们从 Internet URL 引用 JavaScript 文件时会发生什么。我们的机器上有运行本地副本吗?
  2. 是否创建了 httpRequest,请求源将作为我的域或 xyz。

最佳答案

预先重要说明:如果另一端的服务器未启用它,则您无法在客户端代码中执行任何操作来允许跨源 ajax 请求。

在回答您的问题之前,让我给您介绍一下背景:

Same-Origin Security Policy

简单地说,同源安全策略确保来自一个源的脚本不能从其他源获取内容。现在向您解释起源的概念,让我引用部分Wikipedia article of Same-Origin Security Policy :

The following table gives an overview of typical outcomes for checks against the URL "http://www.example.com/dir/page.html".

Compared URL                                             Outcome  Reason
-------------------------------------------------------  -------  ----------------------
http://www.example.com/dir/page2.html                    Success  Same protocol and host
http://www.example.com/dir2/other.html                   Success  Same protocol and host
http://username:password@www.example.com/dir2/other.html Success  Same protocol and host
http://www.example.com:81/dir/other.html                 Failure  Same protocol and host but different port
https://www.example.com/dir/other.html                   Failure  Different protocol
http://en.example.com/dir/other.html                     Failure  Different host
http://example.com/dir/other.html                        Failure  Different host (exact match required)
http://v2.www.example.com/dir/other.html                 Failure  Different host (exact match required)
http://www.example.com:80/dir/other.html                 Depends  Port explicit. Depends on implementation in browser.

Unlike other browsers, Internet Explorer does not include the port in the calculation of the origin, using the Security Zone in its place.

因此,例如,您的 JavaScript 无法从除其来源服务器之外的 Web 服务器下载任何内容(也就是向其发出 HTTP 请求)。这正是您不能向其他域发出 XmlHttpRequests(又名 AJAX)的原因。


CORS 是另一端的服务器(不是浏览器中的客户端代码)可以relax the same-origin policy 的一种方式.

关于Cross Origin Resource Sharing (CORS)的过于简单的描述.

The CORS standard works by adding new HTTP headers which allow servers to serve resources to permitted origin domains. Browsers support these headers and respect the restrictions they establish.

示例:假设您的站点是 http://my-cool-site.com 并且您在域 http:/有一个第三方 API/third-party-site.com,您可以通过 AJAX 访问。

让我们假设来自您的服务器 my-cool-site.com 的页面向 third-party-site.com 发出了请求。通常,用户浏览器会根据 Same-Origin Security Policy 拒绝对您自己的域/子域以外的任何其他站点的 AJAX 调用。 .但是如果浏览器和第三方服务器支持CORS,会出现以下情况:

  • 浏览器会将 Origin HTTP header 发送到 third-party-site.com

    Origin: http://my-cool-site.com
    
  • 如果第三方服务器接受来自您域的请求,它将以 Access-Control-Allow-Origin HTTP header 响应:

    Access-Control-Allow-Origin: http://my-cool-site.com
    
  • 要允许所有域,第三方服务器可以发送此 header :

    Access-Control-Allow-Origin: *
    
  • 如果不允许您的站点,浏览器将抛出错误。

如果客户有相当现代的browsers that support CORS ,以及您的第三方服务器 supports CORS同样,CORS 对您也很有用。

在一些过时的浏览器(例如 IE8)中,您必须使用 Microsoft 特定的 XDomainRequest 对象而不是 XMLHttpRequest 来进行调用,以便正确地与CORS;现在这已经过时了,所有现代浏览器(包括来自 Microsoft 的浏览器)都在 XMLHttpRequest 中处理 CORS。但是如果你需要支持过时的浏览器,this page描述它:

To make a CORS request you simply use XMLHttpRequest in Firefox 3.5+, Safari 4+ and Chrome and XDomainRequest object in IE8+. When using XMLHttpRequest object, if the browser sees that you are trying to make a cross-domain request it will seamlessly trigger CORS behaviour.

Here is a javascript function that helps you create a cross browser CORS object.

function createCORSRequest(method, url){
    var xhr = new XMLHttpRequest();
    if ("withCredentials" in xhr){
        // XHR has 'withCredentials' property only if it supports CORS
        xhr.open(method, url, true);
    } else if (typeof XDomainRequest != "undefined"){ // if IE use XDR
        xhr = new XDomainRequest();
        xhr.open(method, url);
    } else {
        xhr = null;
    }
    return xhr;
}

同样,只有过时的浏览器才需要这样做。


上述原因是您无法从您的脚本中使用亚马逊的网络服务的原因。亚马逊服务器将只允许将他们的 JavaScript 文件下载到从选定域提供的页面。

回答您的编号问题:

    • 同源文件会被浏览器下载。
    • 如果不是同源,则在 CORS 请求成功时将下载该文件。
    • 否则,下载脚本将失败。
    • 如果下载成功,JavaScript 文件的内容将被加载到浏览器的内存中,并被解释和执行。
  1. 查看 CORS 上的说明以了解。

关于javascript - 跨源资源共享 (CORS) 概念,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25310450/

有关javascript - 跨源资源共享 (CORS) 概念的更多相关文章

  1. ruby - 通过 ruby​​ 进程共享变量 - 2

    我正在编写一个gem,我必须在其中fork两个启动两个webrick服务器的进程。我想通过基类的类方法启动这个服务器,因为应该只有这两个服务器在运行,而不是多个。在运行时,我想调用这两个服务器上的一些方法来更改变量。我的问题是,我无法通过基类的类方法访问fork的实例变量。此外,我不能在我的基类中使用线程,因为在幕后我正在使用另一个不是线程安全的库。所以我必须将每个服务器派生到它自己的进程。我用类变量试过了,比如@@server。但是当我试图通过基类访问这个变量时,它是nil。我读到在Ruby中不可能在分支之间共享类变量,对吗?那么,还有其他解决办法吗?我考虑过使用单例,但我不确定这是

  2. ruby - 安装 Ruby 时遇到问题(无法下载资源 "readline--patch") - 2

    当我尝试安装Ruby时遇到此错误。我试过查看this和this但无济于事➜~brewinstallrubyWarning:YouareusingOSX10.12.Wedonotprovidesupportforthispre-releaseversion.Youmayencounterbuildfailuresorotherbreakages.Pleasecreatepull-requestsinsteadoffilingissues.==>Installingdependenciesforruby:readline,libyaml,makedepend==>Installingrub

  3. ruby-on-rails - Rails 3,嵌套资源,没有路由匹配 [PUT] - 2

    我真的为这个而疯狂。我一直在搜索答案并尝试我找到的所有内容,包括相关问题和stackoverflow上的答案,但仍然无法正常工作。我正在使用嵌套资源,但无法使表单正常工作。我总是遇到错误,例如没有路线匹配[PUT]"/galleries/1/photos"表格在这里:/galleries/1/photos/1/edit路线.rbresources:galleriesdoresources:photosendresources:galleriesresources:photos照片Controller.rbdefnew@gallery=Gallery.find(params[:galle

  4. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  5. ruby - Chef LW 资源属性默认值如何引用另一个属性? - 2

    我正在尝试将一个资源属性的默认值设置为另一个属性的值。我正在为我正在构建的tomcat说明书定义一个资源,其中包含以下定义。我想要可以独立设置的“名称”和“服务名称”属性。当未设置服务名称时,我希望它默认为为“名称”提供的任何内容。以下不符合我的预期:attribute:name,:kind_of=>String,:required=>true,:name_attribute=>trueattribute:service_name,:kind_of=>String,:default=>:name注意第二行末尾的“:default=>:name”。当我在Recipe的新block中引用我

  6. ruby - 在模块/类之间共享全局记录器 - 2

    在许多ruby​​类之间共享记录器实例的最佳(正确)方法是什么?现在我只是将记录器创建为全局$logger=Logger.new变量,但我觉得有更好的方法可以在不使用全局变量的情况下执行此操作。如果我有以下内容:moduleFooclassAclassBclassC...classZend在所有类之间共享记录器实例的最佳方式是什么?我是以某种方式在Foo模块中声明/创建记录器还是只是使用全局$logger没问题? 最佳答案 在模块中添加常量:moduleFooLogger=Logger.newclassAclassBclassC..

  7. ruby - 如何使用 cucumber 在场景之间共享状态 - 2

    我有一个功能“从外部网站导入文章”。在我的第一个场景中,我测试从外部网站导入链接列表。Feature:ImportingarticlesfromexternalwebsiteScenario:Searchingarticlesonexample.comandreturnthelinksGiventhereisanImporterAnditsURLis"http://example.com"Whenwesearchfor"demo"ThentheImportershouldreturn25linksAndoneofthelinksshouldbe"http://example.com/d

  8. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接,但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  9. ruby - Sinatra 路由中定义的全局变量是否在请求之间共享? - 2

    假设我有:get'/'do$random=Random.rand()response.body=$randomend如果我每秒有数千个请求到达/,$random是否会被共享并“泄漏”到上下文之外,或者它会像getblock的“本地”变量一样?我想如果它是在get'/'do的上下文之外定义的,它确实会被共享,但我想知道在ruby​​中是否有我不知道的$机制。 最佳答案 ThispartoftheSinatraREADMEaboutscopeisalwayshelpfultoread但是,如果您只需要为请求保留变量,那么我认为我建议使用

  10. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的? 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map,但任何事情都可能发生)首先要知道的是,这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

随机推荐