3

我正在制作一个简单的 javascript 应用程序,我需要在其中加载 xml 文件并将它们显示在用户面前。但我的代码只在 Mozilla Firefox 中有效,但在 chrome 和 Internet Explorer 中它们不起作用。我正在将我的 XML 文档加载到本地机器中。

$(document).ready(function() {
    $('.buttons').slideToggle('medium');

    $.ajax({ 
    url: "dictionary.xml", 
    success: function( xml ) { 
        $(xml).find("word").each(function(){ 
            $("ul").append("<li>" + $(this).text() + "</li>");
        }); 
   } 
    });
}

这是我的 XML

 <?xml version="1.0" encoding="UTF-8"?> 
  <xml> 

    <word> 
      <threeletter>RIP</threeletter> 
      <fourletter>PIER</fourletter>
      <fiveletter>SPIRE</fiveletter> 
      <sixletter>SPIDER</sixletter> 
     </word>

     <word> 
      <threeletter>SUE</threeletter> 
      <fourletter>EMUS</fourletter>
      <fiveletter>SERUM</fiveletter> 
      <sixletter>RESUME</sixletter> 
     </word>

     <word> 
      <threeletter>COO</threeletter> 
      <fourletter>CON</fourletter>
      <fiveletter>CONDO</fiveletter> 
      <sixletter>CONDOM</sixletter> 
     </word>

    </xml>

我发现了错误,在这里

XMLHttpRequest cannot load file:///C:/Users/John/Desktop/JsTwist/dictionary.xml. Origin null is not allowed by Access-Control-Allow-Origin.
4

1 回答 1

4

file://默认情况下,Google Chrome 不允许通过协议进行 AJAX 请求。

您需要使用--allow-file-access开关启动 Chrome。

以下是在每个操作系统上提供开关的说明。

我不确定如何为 IE 启用文件协议。

可能最简单的做法是设置本地 Web 服务器并运行您的应用程序以及其中的 xml 文件,那么您不必担心在任一浏览器中都会出现此问题。

编辑

后期编辑,我知道。我想把它扔在那里以防其他人有问题。

使用 jQuery 请求 xml 文档时,您应该始终在设置对象中提供数据类型。在内部,jQuery 最好猜测返回的内容,我已经让它认为一个非常好的 xml 文档是 HTML/XHTML。

为此,请添加dataType: "xml"。例如:

$(document).ready(function() {
    $('.buttons').slideToggle('medium');

    $.ajax({ 
        url: "dictionary.xml", 
        success: function( xml ) { 
            $(xml).find("word").each(function(){ 
                $("ul").append("<li>" + $(this).text() + "</li>");
            }); 
        },
        dataType: "xml"
    });
}

支持的数据类型在jQuery.ajax()的文档页面上可用。

此外,我在尝试从远程服务器获取 RSS 提要时遇到了上面的Access-Control-Allow-Origin错误。我决定解决这个问题的唯一方法是从服务器端代码代理请求 RSS 提要并通过一些代理脚本传递它。这是 PHP 中的一个简单示例:

<?php

 if(isset($_GET['q']) && isAjax())
 {
    $q = strip_tags($_GET['q']);
    header("Status: 200");
    header("Content-type: text/xml");
    echo  file_get_contents('http://'.$q);   
    exit();
 }

function isAjax() {
    return (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && 
    ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest'));
}

?>

CAVEATq我强烈建议修改上述脚本,通过验证或进一步限制isAjax功能,仅允许您计划为您的客户端代码提供服务的那些位置。我不是 PHP 开发人员,也不假装知道 PHP 安全性的最佳实践。如果有人有改进 PHP 片段的建议,我很乐意应用它们。

于 2012-04-06T02:31:37.200 回答