Javaスクリプトを使用してURLからXML/RSSを解析する

Question

こんにちは、私はhttp://rss.news.yahoo.com/rss/entertainmentのようなライブURLからxml/rssを（jqueryではなく）純粋なJavaスクリプトを使用して解析します。私はたくさんのグーグルで探せました。何も私のために働かなかった。誰でもコードの作業に役立つことができます。

Answer 1

をチェックしたJSONオブジェクトを印刷する必要がある場合は、worked around the Same Origin Policyを持っていたら（あなたが。多くのことをGoogleで検索していることができない）、およびリソースがXML MIME type（これit is in this case、で提供された場合に変換した後http://jsontoxml.utilities-online.info/

text/xml）、次の操作を実行できます。

var x = new XMLHttpRequest(); 
x.open("GET", "http://feed.example/", true); 
x.onreadystatechange = function() { 
    if (x.readyState == 4 && x.status == 200) 
    { 
    var doc = x.responseXML; 
    // … 
    } 
}; 
x.send(null); 

（他のイベントハンドラの小道具にもAJAX、およびXMLHttpRequest Level 2仕様[ワーキングドラフト]を参照してください。

本質的に：構文解析は必要ありません。 XMLデータにアクセスする場合は、標準のDOM Level 2+ CoreまたはDOM Level 3 XPathのメソッドを使用します（例：

/* DOM Level 2 Core */ 
var title = doc.getElementsByTagName("channel")[0].getElementsByTagName("title")[0].firstChild.nodeValue; 

/* DOM Level 3 Core */ 
var title = doc.getElementsByTagName("channel")[0].getElementsByTagName("title")[0].textContent; 

/* DOM Level 3 XPath (not using namespaces) */ 
var title = doc.evaluate('//channel/title/text()', doc, null, 0, null).iterateNext(); 

/* DOM Level 3 XPath (using namespaces) */ 
var namespaceResolver = (function() { 
    var prefixMap = { 
    media: "http://search.yahoo.com/mrss/", 
    ynews: "http://news.yahoo.com/rss/" 
    }; 

    return function (prefix) { 
    return prefixMap[prefix] || null; 
    }; 
}()); 

var url = doc.evaluate('//media:content/@url', doc, namespaceResolver, 0, null).iterateNext(); 

（jQueryのを使用していない便利な、名前空間を認識するDOM 3 XPathのラッパーのためにもJSX:xpath.jsを参照してください。）

しかし、いくつかの（間違った）理由MIMEタイプがXMLのMIMEでない場合DOM実装で認識されない場合は、最新のブラウザに組み込まれているパーサの1つを使用して、responseTextプロパティ値を解析することができます。 IE/MSXMLで動作するソリューションについては、pradeek's answerを参照してください。以下は他の場所でも有効です：

var parser = new DOMParser(); 
var doc = parser.parseFromString(x.responseText, "text/xml"); 

上記のように処理してください。

ランタイムに機能テストを使用して、特定の実装の正しいコードブランチを判断します。最も簡単な方法は次のとおりです。

if (typeof DOMParser != "undefined") 
{ 
    var parser = new DOMParser(); 
    // … 
} 
else if (typeof ActiveXObject != "undefined") 
{ 
    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
    // … 
} 

もDOMParserとHTML5: DOM Parsing and Serialization (Working Draft)参照してください。

Answer 2

大きな問題は、一般的に、データのクロスドメインを取得できないことです。これはほとんどのRSSフィードで大きな問題です。

JavaScriptのクロスドメインでデータを読み込むことに対処する一般的な方法は、JSONPを呼び出すことです。基本的には、取得しているデータがjavascriptコールバック関数にラップされていることを意味します。スクリプトタグを使用してURLをロードし、コードで関数を定義します。したがって、スクリプトがロードされると、関数が実行され、引数としてデータが渡されます。

ほとんどのxml/rssフィードの問題は、xmlのみを提供するサービスがJSONPラッピング機能を提供しない傾向があることです。

さらに先に進む前に、データソースにJSON形式とJSONP機能があるかどうかを確認してください。それはこれをもっと簡単にします。

データソースがにjsonとjsonpの機能を提供していない場合は、クリエイティブを取得する必要があります。

これを処理する比較的簡単な方法は、プロキシサーバーを使用することです。あなたのプロキシはあなたのコントロール下のどこかで動作し、データを得るための仲介者として機能します。サーバーはあなたのxmlを読み込み、あなたのjavascriptは代わりにリクエストを行います。プロキシサーバーが同じドメイン名で実行されている場合、標準のxhr（ajax）要求を使用するだけで、ドメイン間の関係について心配する必要はありません。

また、プロキシサーバーはjsonpコールバックでデータをラップすることができ、上記の方法を使用できます。

jQueryを使用している場合、xhrおよびjsonpリクエストは組み込みのメソッドであり、コーディングを非常に簡単にします。他の一般的なjsライブラリもこれらをサポートする必要があります。これを最初からすべてコーディングしている場合は、もう少し作業はしますが、それほど難しくはありません。

これで、一度データがうまくいけば、ちょうどjsonになります。その後、解析は必要ありません。

しかし、xml/rssのバージョンに固執することになり、jQueryの場合は、単にjQuery.parseXML http://api.jquery.com/jQuery.parseXML/を使用するだけです。

Answer 3

xmlをjsonに変換することをお勧めします。このチュートリアル http://www.w3schools.com/json/json_eval.asp