DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> Javascript實現關聯數據(Linked Data)查詢及注意細節
Javascript實現關聯數據(Linked Data)查詢及注意細節
編輯:關於JavaScript     
前言
自由百科全書不僅僅應當可以自由編寫,而更應該可以自由獲得。
DBpedia對Wikipedia的數據變成Linked Data形式,使得機器也能讀懂並自由獲得這些數據。
本文的主要目的是利用Javascript從DBpedia中獲取我們想要的數據。
對Linked Data不太了解的請參考:關聯數據入門——RDF。

SPARQL
Trying to use the Semantic Web without SPARQL is like trying to use a relational database without SQL.
—— Tim Berners-Lee
SPARQL是Semantic Web(語義網)的SQL,用於數據查詢的語言。

SPARQL Endpoint
SPARQL查詢終端,是一種HTTP綁定協議,用於通過HTTP進行SPARQL查詢,並返回相應數據。
DBpedia的SPARQL Endpoint地址是:http://dbpedia.org/sparql
大家可以通過浏覽器打開這個頁面,進行SPARQL查詢(最好翻牆,沒翻牆查詢經常失敗,不太明白為什麼= =)。
不過這種查詢最終返回結果是HTML頁面,並不是我們想要的,我們可以通過設置Request Header的Accept屬性來指定返回數據類型。
例如如果指定為:text/xml,那麼返回的便是RDF格式數據。
那麼我們如何輸入SPARQL查詢代碼呢?
只需通過get或者post方法用參數query,將代碼傳過去。例如:
如果想查詢:select distinct ?Concept where {[] a ?Concept} LIMIT 100
則可利用該鏈接得到數據:
http://dbpedia.org/sparql?query=select%20distinct%20?Concept%20where%20{[]%20a%20?Concept}%20LIMIT%20100
其中空格被轉成%20。

實現細節
•跨域
我們可以通過AJAX實現這一功能,但是AJAX在部分浏覽器中無法跨域,然而很顯然我們想要的Linked Data幾乎都是跨域的。
實際上,在一些較老版本的浏覽器,我們沒有不改變其數據形式的方法在前端進行動態跨域異步讀取。
不過我們可以通過服務器代理的方法來解決跨域問題。
•GET or POST
使用GET還POST呢?
這個可能出於很多方面考慮,但是考慮到GET可能被緩存,所以我們使用POST來避免數據被緩存。
•以什麼形式返回數據
前面我們說到用text/xml可以返回RDF數據,但是RDF在Javascript中並不好處理,所以我們使用json方式返回,也就是需要將Accept設置成application/sparql-results+json。

實現
接口參考Python的SPARQL Wrapper
復制代碼 代碼如下:
(function(root, factory) {
if(typeof define === "function"){
define("SPARQLWrapper", factory); // AMD || CMD
}else{
root.SPARQLWrapper = factory(); // <script>
}
}(this, function(){
'use strict'
function SPARQLWrapper(endpoint){
this.endpoint = endpoint;
this.queryPart = "";
this.type = "json";
}
SPARQLWrapper.prototype = {
constructor: SPARQLWrapper,
setQuery: function(query){
this.queryPart = "query=" + encodeURI(query);
},
setType: function(type){
this.type = type.toLowerCase();
},
query: function(type, callback){
callback = callback === undefined ? type : this.setType(type) || callback;
var xhr = new XMLHttpRequest();
xhr.open('POST', this.endpoint, true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
switch(this.type){
case "json":
type = "application/sparql-results+json";
break;
case "xml":
type = "text/xml";
break;
case "html":
type = "text/html";
break;
default:
type = "application/sparql-results+json";
break;
}
xhr.setRequestHeader("Accept", type);
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
var sta = xhr.status;
if(sta == 200 || sta == 304){
callback(xhr.responseText);
}else{
console && console.error("Sparql query error: " + xhr.status + " " + xhr.responseText);
}
window.setTimeout(function(){
xhr.onreadystatechange= new Function();
xhr = null;
},0);
}
}
xhr.send(this.queryPart);
}
}
return SPARQLWrapper;
}));

使用方法,例如需要查詢:
select distinct ?Concept where {[] a ?Concept} LIMIT 100
則該頁面為:
復制代碼 代碼如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="SPARQLWrapper.js" type="text/javascript"></script>
</head>
<body>
<script>
var sparql = new SPARQLWrapper("http://dbpedia.org/sparql");
sparql.setQuery('select distinct ?Concept where {[] a ?Concept} LIMIT 100');
sparql.query(function(json){
console.log(eval('(' + json + ')');
});
</script>
</body>
</html>

小例子:下載
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved