一尘不染

我的XML文件没有被Google Chrome和Internet Explorer占用

ajax

我正在制作一个简单的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.

阅读 242

收藏
2020-07-26

共1个答案

一尘不染

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

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

以下是在每个OS上提供开关的说明

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

可能最简单的方法是设置本地Web服务器,并与其中的xml文件一起运行您的应用程序,这样您就不必在任何一个浏览器中都担心此问题。

编辑

我知道后期编辑。我想把这个扔出去,以防其他人遇到问题。

使用jQuery请求xml文档时,应 始终 在settings对象中提供dataType。在内部,jQuery最好猜测返回的内容,而我认为它是HTML
/ XHTML的一个很好的xml文档。

为此,添加 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'));
}

?>

CAVEAT
我强烈建议修改上面的脚本,以允许您仅通过验证q或进一步限制isAjax功能来计划为客户代码提供服务的那些位置。我不是PHP开发人员,所以我不假装了解PHP安全性的最佳做法。如果有人对改进PHP代码段有任何建议,我会很乐意应用它们。

2020-07-26