Javascript实现关联数据(Linked Data)查询及注意细节


Posted in Javascript onFebruary 22, 2013

前言
自由百科全书不仅仅应当可以自由编写,而更应该可以自由获得。
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>

小例子:下载
Javascript 相关文章推荐
JS如何将UTC格式时间转本地格式
Sep 04 Javascript
js中settimeout方法加参数的使用实例
Feb 27 Javascript
点击表单提交时出现jQuery没有权限的解决方法
Jul 23 Javascript
微信小程序 Audio API详解及实例代码
Sep 30 Javascript
js模糊查询实例分享
Dec 26 Javascript
React Native中的RefreshContorl下拉刷新使用
Oct 09 Javascript
ES6入门教程之变量的解构赋值详解
Apr 13 Javascript
Vue-input框checkbox强制刷新问题
Apr 18 Javascript
Vue-CLI项目中路由传参的方式详解
Sep 01 Javascript
JavaScript工具库MyTools详解
Jan 01 Javascript
详解如何使用Node.js实现热重载页面
May 06 Javascript
ant design charts 获取后端接口数据展示
May 25 Javascript
JS中不为人知的五种声明Number的方式简要概述
Feb 22 #Javascript
JS中令人发指的valueOf方法介绍
Feb 22 #Javascript
网页右键ie不支持event.preventDefault和event.returnValue (需要加window)
Feb 22 #Javascript
javascript 日期时间 转换的方法
Feb 21 #Javascript
JS关键字变色实现思路及代码
Feb 21 #Javascript
js数组Array sort方法使用深入分析
Feb 21 #Javascript
js自定义方法通过隐藏iframe实现文件下载
Feb 21 #Javascript
You might like
php设计模式 Adapter(适配器模式)
2011/06/26 PHP
PHP序列号生成函数和字符串替换函数代码
2012/06/07 PHP
PHP随机生成随机个数的字母组合示例
2014/01/14 PHP
php文件操作之小型留言本实例
2015/06/20 PHP
jquery+php实现导出datatables插件数据到excel的方法
2015/07/06 PHP
程序员的表白神器“520”大声喊出来
2016/05/20 PHP
php array_slice 取出数组中的一段序列实例
2016/11/04 PHP
解决laravel5中auth用户登录其他页面获取不到登录信息的问题
2019/10/08 PHP
用javascript做拖动布局的思路
2008/05/31 Javascript
JavaScript的继承的封装介绍
2013/10/15 Javascript
详解AngularJS中的依赖注入机制
2015/06/17 Javascript
第一篇初识bootstrap
2016/06/21 Javascript
jQuery EasyUI提交表单验证
2016/07/19 Javascript
详解获取jq ul第一个li定位的四种解决方案
2016/11/23 Javascript
vue数据双向绑定原理解析(get &amp; set)
2017/03/08 Javascript
利用yarn代替npm管理前端项目模块依赖的方法详解
2017/09/04 Javascript
基于es6三点运算符的使用方法(实例讲解)
2017/10/12 Javascript
Vux+Axios拦截器增加loading的问题及实现方法
2018/11/08 Javascript
tracking.js页面人脸识别插件使用方法
2020/04/16 Javascript
Vue项目引发的「过滤器」使用教程
2019/03/12 Javascript
javascript实现留言板功能
2020/02/08 Javascript
Python的Flask框架应用程序实现使用QQ账号登录的方法
2016/06/07 Python
详谈python read readline readlines的区别
2017/09/22 Python
Pyinstaller将py打包成exe的实例
2018/03/31 Python
详解pytorch 0.4.0迁移指南
2019/06/16 Python
Django自定义用户表+自定义admin后台中的字段实例
2019/11/18 Python
keras分类之二分类实例(Cat and dog)
2020/07/09 Python
Python 删除List元素的三种方法remove、pop、del
2020/11/16 Python
Cinque网上商店:德国服装品牌
2019/03/17 全球购物
教师评语大全
2014/04/28 职场文书
清明节演讲稿
2014/05/27 职场文书
拒绝黄毒毒宣传标语
2014/06/26 职场文书
小学班主任培训心得体会
2016/01/07 职场文书
Go遍历struct,map,slice的实现
2021/06/13 Golang
WebRTC记录音视频流(web技术分享)
2022/02/24 Javascript
微软团队与 NASA 科学家和惠普企业(HPE)的工程师合作
2022/04/21 数码科技