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 相关文章推荐
jquery 将disabled的元素置为enabled的三种方法
Jul 25 Javascript
Jquery下判断Id是否存在的代码
Jan 06 Javascript
基于jQuery的动态表格插件
Mar 28 Javascript
点击按钮或链接不跳转只刷新页面的脚本整理
Oct 22 Javascript
实例详解AngularJS实现无限级联动菜单
Jan 15 Javascript
使用jquery给新生的th绑定hover事件的实例
Feb 10 Javascript
JS实现的五级联动菜单效果完整实例
Feb 23 Javascript
webpack学习笔记之优化缓存、合并、懒加载
Aug 24 Javascript
Vue组件之Tooltip的示例代码
Oct 18 Javascript
详解auto-vue-file:一个自动创建vue组件的包
Apr 26 Javascript
详解微信UnionID作用
May 15 Javascript
微信小程序websocket实现即时聊天功能
May 21 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
实现dedecms全站URL静态化改造的代码
2007/03/29 PHP
php获取文件夹路径内的图片以及分页显示示例
2014/03/11 PHP
php使用unset()删除数组中某个单元(键)的方法
2015/02/17 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
2020/01/26 PHP
JavaScript高级程序设计
2006/12/29 Javascript
如何在Web页面上直接打开、编辑、创建Office文档
2007/03/12 Javascript
DHTML Slide Show script图片轮换
2008/03/03 Javascript
Javascript 函数对象的多重身份
2009/06/28 Javascript
Prototype框架详解
2015/11/25 Javascript
Bootstrap布局方式详解
2016/05/27 Javascript
JS如何设置iOS中微信浏览器的title
2016/11/22 Javascript
vue-自定义组件传值的实例讲解
2018/09/18 Javascript
IE9 elementUI文件上传的问题解决
2018/10/17 Javascript
vue实现路由监听和参数监听
2019/10/29 Javascript
JavaScript(js)处理的HTML事件、键盘事件、鼠标事件简单示例
2019/11/19 Javascript
Vue CLI3移动端适配(px2rem或postcss-plugin-px2rem)
2020/04/27 Javascript
JavaScript实现简单验证码
2020/08/24 Javascript
python中sys.argv参数用法实例分析
2015/05/20 Python
centos 安装python3.6环境并配置虚拟环境的详细教程
2018/02/22 Python
python 实现返回一个列表中出现次数最多的元素方法
2019/06/11 Python
解决django中ModelForm多表单组合的问题
2019/07/18 Python
python爬虫开发之PyQuery模块详细使用方法与实例全解
2020/03/09 Python
Python confluent kafka客户端配置kerberos认证流程详解
2020/10/12 Python
pycharm 实现调试窗口恢复
2021/02/05 Python
IMPORT的选项IGNORE有什么作用?缺省是什么设置?
2015/09/17 面试题
艺术专业大学生自我评价
2013/09/22 职场文书
2014年道德讲堂实施方案
2014/03/05 职场文书
创建青年文明号材料
2014/05/09 职场文书
竞争与合作演讲稿
2014/05/12 职场文书
创意婚礼策划方案
2014/05/18 职场文书
教师专业技术工作总结2015
2015/05/13 职场文书
圣诞晚会主持词
2015/07/01 职场文书
校园歌手大赛主持词
2015/07/03 职场文书
导游词之太原天龙山
2020/01/02 职场文书
如何使用pdb进行Python调试
2021/06/30 Python
MySQL sql模式设置引起的问题
2022/05/15 MySQL