SoFunction
Updated on 2025-04-06

Javascript implements Linked Data query and pay attention to details

Preface
Free Encyclopedia should not only be freely written, but also freely available.
DBpedia's data on Wikipedia becomes the form of Linked Data, allowing the machine to read and obtain this data freely.
The main purpose of this article is to use Javascript to get the data we want from DBpedia.
For those who don't know much about Linked Data, please refer to:Getting started with associated 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 a SQL for Semantic Web (Semantic Web), a language used for data query.

SPARQL Endpoint
SPARQL query terminal is an HTTP binding protocol used to perform SPARQL query through HTTP and return corresponding data.
DBpedia's SPARQL Endpoint address is: /sparql
You can open this page through your browser and perform SPARQL query (it is best to surf the wall. Querying without surfing the wall often fails, and you don’t understand why = =).
However, the final result of this query is an HTML page, which is not what we want. We can specify the return data type by setting the Accept property of the Request Header.
For example, if specified as: text/xml, then the returned RDF format data.
So how do we enter the SPARQL query code?
Just use the get or post method to pass the code over. For example:
If you want to query: select distinct ?Concept where {[] a ?Concept} LIMIT 100
Then you can use this link to get the data:
/sparql?query=select%20distinct%20?Concept%20where%20{[]%20a%20?Concept}%20LIMIT%20100
The space is converted to %20.

Implementation details
• Cross-domain
We can implement this function through AJAX, but AJAX cannot cross-domain in some browsers, but it is obvious that the Linked Data we want is almost all cross-domain.
In fact, in some older versions of browsers, we do not have a way to perform dynamic cross-domain asynchronous reading on the front end without changing its data form.
However, we can solve cross-domain problems through the server proxy method.
•GET or POST
How about using GET or POST?
This may be considered for many reasons, but considering that GET may be cached, we use POST to avoid data being cached.
•In what form does the data return
We mentioned earlier that using text/xml can return RDF data, but RDF is not easy to deal with in Javascript, so we use json to return, that is, we need to set Accept to application/sparql-results+json.

accomplish
Interface reference Python's SPARQL Wrapper
Copy the codeThe code is as follows:

(function(root, factory) {
if(typeof define === "function"){
define("SPARQLWrapper", factory); // AMD || CMD
}else{
= factory(); // <script>
}
}(this, function(){
'use strict'
function SPARQLWrapper(endpoint){
= endpoint;
= "";
= "json";
}
= {
constructor: SPARQLWrapper,
setQuery: function(query){
= "query=" + encodeURI(query);
},
setType: function(type){
= ();
},
query: function(type, callback){
callback = callback === undefined ? type : (type) || callback;
var xhr = new XMLHttpRequest();
('POST', , true);
('Content-type', 'application/x-www-form-urlencoded');
switch(){
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;
}
("Accept", type);
= function(){
if( == 4){
var sta = ;
if(sta == 200 || sta == 304){
callback();
}else{
console && ("Sparql query error: " + + " " + );
}
(function(){
= new Function();
xhr = null;
},0);
}
}
();
}
}
return SPARQLWrapper;
}));

How to use, for example, you need to query:
select distinct ?Concept where {[] a ?Concept} LIMIT 100
Then the page is:
Copy the codeThe code is as follows:

<!DOCTYPE html>
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="" type="text/javascript"></script>
</head>
<body>
<script>
var sparql = new SPARQLWrapper("/sparql");
('select distinct ?Concept where {[] a ?Concept} LIMIT 100');
(function(json){
(eval('(' + json + ')');
});
</script>
</body>
</html>

Small examples:download