Javascript implements linked data query and pays attention to details_javascript skills

Foreword
A free encyclopedia should not only be freely written, but also freely available.
DBpedia converts Wikipedia data into Linked Data form, so that machines can also read and obtain the data freely.
The main purpose of this article is to use Javascript to get the data we want from DBpedia.
If you don’t know much about Linked Data, please refer to: Introduction to 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 is Semantic SQL for the Web (Semantic Web), a language for data query.

SPARQL Endpoint
SPARQL query terminal is an HTTP binding protocol used to perform SPARQL queries over HTTP and return corresponding data.
DBpedia’s SPARQL Endpoint address is: http://dbpedia.org/sparql
You can open this page through a browser and perform SPARQL queries (it is best to circumvent the wall, because queries often fail without circumventing the wall, and I don’t quite understand) Why = =).
However, the final result returned by this kind of query is an HTML page, which is not what we want. We can specify the return data type by setting the Accept attribute of the Request Header.
For example, if it is specified as: text/xml, then the data in RDF format will be returned.
So how do we enter the SPARQL query code?
Just use the parameter query through the get or post method to pass the code. For example:
If you want to query: select distinct ?Concept where {[] a ?Concept} LIMIT 100
You can use this link to get the data:
http://dbpedia.org/sparql?query=select distinct ?Concept where {[] a ?Concept} LIMIT 100
where spaces are converted to.

Implementation details
•Cross-domain
We can achieve this function through AJAX, but AJAX cannot cross-domain in some browsers, but obviously what we want Linked Data is almost always cross-domain.
In fact, in some older versions of browsers, we have no way to perform dynamic cross-domain asynchronous reading on the front end without changing its data form.
However, we can solve the cross-domain problem through server proxy.
•GET or POST
What about using GET or POST?
This may be due to many considerations, but considering that GET may be cached, we use POST to avoid data being cached.
•In what form to return data
We mentioned earlier that RDF data can be returned using text/xml, but RDF is not easy to process in Javascript, so we use json to return, which means we need to set Accept to application /sparql-results json.

Implementation
Interface reference Python's SPARQL Wrapper

Copy code The code is as follows :

(function(root, factory) {
if(typeof define === "function"){
define("SPARQLWrapper", factory); // AMD || CMD
}else{
root.SPARQLWrapper = factory(); // <script> <br>} <br>}(this, function(){ <br>'use strict' <br>function SPARQLWrapper(endpoint){ <br>this.endpoint = endpoint; <br>this.queryPart = ""; <br>this.type = "json"; <br>} <br>SPARQLWrapper.prototype = { <br> constructor: SPARQLWrapper, <br>setQuery: function(query){ <br>this.queryPart = "query=" encodeURI(query); <br>}, <br>setType: function(type){ <br>this. type = type.toLowerCase(); <br>}, <br>query: function(type, callback){ <br>callback = callback === undefined ? type : this.setType(type) || callback; <br>var xhr = new XMLHttpRequest(); <br>xhr.open('POST', this.endpoint, true); <br>xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded '); <br>switch(this.type){ <br>case "json": <br>type = "application/sparql-results json"; <br>break; <br>case "xml": <br>type = "text/xml"; <br>break; <br>case "html": <br>type = "text/html"; <br>break; <br>default: <br>type = "application /sparql-results json"; <br>break; <br>} <br>xhr.setRequestHeader("Accept", type); <br>xhr.onreadystatechange = function(){ <br>if(xhr.readyState = = 4){ <br>var sta = xhr.status; <br>if(sta == 200 || sta == 304){ <br>callback(xhr.responseText); <br>}else{ <br> console && console.error("Sparql query error: " xhr.status " " xhr.responseText); <br>} <br>window.setTimeout(function(){ <br>xhr.onreadystatechange= new Function(); <br>xhr = null; <br>},0); <br>} <br>} <br>xhr.send(this.queryPart); <br>} <br>} <br>return SPARQLWrapper; <br>})); <br> </div> <br>Usage method, for example, you need to query: <br>select distinct ?Concept where {[] a ?Concept} LIMIT 100 <br>Then the page is: <br><div class="codetitle"> <span><a style="CURSOR: pointer" data="81600" class="copybut" id="copybut81600" onclick="doCopy('code81600')"><u>Copy code</u></a></span> The code is as follows:</div> <div class="codebody" id="code81600"> <br><!DOCTYPE html> <br><html xmlns="http://www.w3.org/1999/xhtml"> <br><head> <br><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <br><script src="SPARQLWrapper.js" type="text/javascript"></script>


<script> <br>var sparql = new SPARQLWrapper("http://dbpedia.org/sparql"); <br>sparql.setQuery('select distinct ?Concept where {[] a ?Concept} LIMIT 100'); <br>sparql.query(function(json){ <br>console.log(eval('(' json ')'); <br>}); <br></script>

小例子：下载