3

XMLファイルをロードしてユーザーの前に表示する必要がある単純なjavascriptアプリケーションを作成しています。私のコードは 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 リクエストを許可しません。

スイッチを使用して Chrome を起動する必要があります--allow-file-access。

ここでは、各 OS でスイッチを指定する手順を示します。

IE のファイル プロトコルを有効にする方法がわかりません。

おそらく最も簡単な方法は、ローカル Web サーバーをセットアップし、その中の xml ファイルと共にアプリを実行することです。そうすれば、どちらのブラウザーでもこの問題を心配する必要はありません。

編集

遅い編集、私は知っています。他の人が問題を抱えている場合に備えて、これを捨てたかったのです。

jQuery を使用して xml ドキュメントを要求する場合は、常に設定オブジェクトで dataType を指定する必要があります。内部的には、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'));
}

?>

警告q上記のスクリプトを変更して、機能を検証するかさらに制限することにより、クライアント コードに提供する予定の場所のみを許可することを強くお勧めしますisAjax。私は PHP 開発者ではありませんし、PHP セキュリティのベスト プラクティスを知っているふりもしません。PHP スニペットを改善するための提案があれば、喜んで適用します。

于 2012-04-06T02:31:37.200 に答える