jQuery“get”方法在本地不起作用[重复]答案

【问题标题】：jQuery "get" method not working locally [duplicate]jQuery“get”方法在本地不起作用[重复]
【发布时间】：2012-03-10 22:57:38
【问题描述】：

可能重复：
Why is cross-domain Ajax a security concern?

我在使用 jQuery 时遇到了一个大问题。我正在尝试让 jQuery 加载从远程 Web 服务器上的 PHP 页面生成的 HTML。但是每当我尝试在本地运行它时，什么都没有发生。但是，无论出于何种原因，当它在我的虚拟主机上时，它会运行得很好。

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Unicode" />
        <title>Decisive Shoutbox</title>
        <style type="text/css">
        body
        {
            margin: 0;
            width: 288;
            height: 160;
            font-family: verdana;
            font-size: 20px;
        }
        #gadgetContent
        {
            height: 160;
            overflow: auto;
            vertical-align: middle;
        }
        .shout
        {
            font-size: 8px;
        }
        .date
        {
            font-size: 6px;
            font-color: #010101;
        }
        </style>
        <link href="flexcrollstyles.css" rel="stylesheet" type="text/css" />
        <script type="text/jscript" src="scripts/flexcroll.js"></script>
        <script type="text/jscript" src="scripts/jquery.js"></script>
        <script type="text/jscript" language="jscript">
            $(document).ready(function() {
                $.get("http://decisive-media.net/gameguy/gadgets/shouts.php", function(data) {
                    $('#gadgetContent').html(data);
                    //fleXenv.fleXcrollMain('gadgetContent');
                    alert("done");
                });
            });
        </script>
    </head>

    <body>
        <div id="gadgetContent">
        </div>
    </body>
</html>

【问题讨论】：

您的浏览器将拒绝从与加载页面源域不同的域加载内容。它被称为“同源策略”。此外，一些/大多数/所有较新的浏览器将每个单独的“file://”URL 视为一个单独的域。
谢谢！我不知道这项政策。

标签： javascript jquery html get

【解决方案1】：

出于安全原因，浏览器将 ajax 调用限制在同一来源，从而禁止您连接到与网页不同域的远程服务器。你可以阅读same origin policy on MDN。

一个潜在的解决方法是JSONP，它使用不受相同原始策略约束的<script> 标签完成请求，但它需要服务器合作来实现 JSONP，因为它必须生成正确类型的响应使用<script> 标签工作。

我有一个自己构建的 Web 组件（一个 HTML5 幻灯片，它通过 ajax 查询服务器以获取幻灯片列表），我在本地测试并在 Web 上运行。在我的测试环境（硬盘上的 HTML 文件）中进行本地测试时，我使用 JSONP 从远程服务器获取数据以绕过安全限制，但是当它在真实环境中运行时，我使用常规 ajax我的应用会根据环境自动检测需要哪些。

【讨论】：

啊，非常感谢。这是我的小部件想法。感谢你的回答。 ^.^
@Drislen - 如果它是您的 PHP 服务器页面/应用程序，那么支持 JSONP 并以这种方式完成您的任务没什么大不了的。一旦您了解了它的工作原理，它就可以像 ajax 调用一样工作。
我会调查的，谢谢。 :3
我在浏览 jQuery api 时遇到了些许困惑。在此处的示例中。 api.jquery.com/jQuery.getJSON 它调用了域名之外的文件，但它仍然可以正常工作。这是如何运作的？我虽然浏览器阻止了那个？
见info about JSONP。然后，来自getJSON() 文档： JSONP - 如果 URL 包含字符串 "callback=?"（或类似的，由服务器端 API 定义），则将请求视为 JSONP。有关更多详细信息，请参阅 $.ajax() 中对 jsonp 数据类型的讨论。 JSONP 使用动态生成的 <script> 标记来绕过跨域限制，但需要服务器的合作以支持 callback= URL 选项并将数据适当地格式化为调用该回调的 javascript 函数调用。

【解决方案2】：

如果您执行 AJAX 请求，则应用同源策略。你可以阅读更多关于同源政策here。

如果你在本地运行它，你只能运行本地 ajax 请求，如果你在你的域上运行它，你只能在你的域上执行请求。

【讨论】：