Javascript实现关联数据(Linked Data)查询及注意细节
前言
自由百科全书不仅仅应当可以自由编写，而更应该可以自由获得。
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动态创建link标签到head里的方法
本文实例讲述了JavaScript动态创建link标签到head里的方法.分享给大家供大家参考.具体分析如下: 相信有很多做前端的朋友碰到过需要用 JavaScript 动态创建样式表标签--link标签.这里我们就来说说如何在浏览器中动态创建link标签. 使用 jQuery 创建 link 标签 如果你开发中喜欢用jQuery,那么用jQuery在创建link标签应该是这样的: 复制代码 代码如下: var cssURL = '/style.css', linkTag = $('<l
-
在JavaScript中处理字符串之link()方法的使用
此方法创建了请求另一个URL的HTML超文本链接. 语法 string.link( hrefname ) 下面是参数的详细信息: hrefname: 任何字符串指定HREF标记; 它应该是一个有效的URL 返回值: 返回字符串<a>标签 例子: <html> <head> <title>JavaScript String link() Method</title> </head> <body> <script typ
-
JavaScript link方法入门实例（给字符串加上超链接）
link 方法返回使用 HTML a 标签属性定义的(斜体)字符串.其语法如下: 复制代码 代码如下: str_object.link( url ) 参数说明: 参数 说明 str_object 要操作的字符串(对象) url 必需.字符串要链接的 URL 地址,完整格式. 提示:该方法不符合 ECMA 标准,不建议使用. link 方法实例 复制代码 代码如下: <script language="JavaScript"> var str = "www.jb51
-
Javascript实现关联数据(Linked Data)查询及注意细节
前言 自由百科全书不仅仅应当可以自由编写,而更应该可以自由获得. 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
-
关联数据入门——RDF应用
引言语义网(Semantic Web)是一种数据的网络,让数据得以共享,而不仅仅是被应用程序束缚. 但语义网也不仅仅是把数据放在互联网上,而是试图将数据联系起来,并产生数据与现实事物的联系,以方便人与机器阅读与理解这些数据. The Semantic Web isn't just about putting data on the web. It is about making links, so that a person or machine can explore the web of d
-
jsonp跨域请求数据实现手机号码查询实例分析
本文实例讲述了jsonp跨域请求数据实现手机号码查询的方法.分享给大家供大家参考,具体如下: 前言 网上有很多开放的api,我们在本地通过ajax获取数据时,总会碰到一个问题,那就是跨域!如果不借助php等,仅仅通过js怎么解决跨域的问题呢?或许jsonp是个不错的选择. 知识准备 之前一篇<说说JSON和JSONP 也许你会豁然开朗>对jsonp已经介绍的很详细了,这里就不多介绍了,直接上实例吧 代码: <!DOCTYPE HTML> <html> <head&
-
jQuery中数据缓存$.data的用法及源码完全解析
一.实现原理: 对于DOM元素,通过分配一个唯一的关联id把DOM元素和该DOM元素的数据缓存对象关联起来,关联id被附加到以jQuery.expando的值命名的属性上,数据存储在全局缓存对象jQuery.cache中.在读取.设置.移除数据时,将通过关联id从全局缓存对象jQuery.cache中找到关联的数据缓存对象,然后在数据缓存对象上执行读取.设置.移除操作. 对于Javascript对象,数据则直接存储在该Javascript对象的属性jQuery.expando上.在读取.设置.移
-
python 实现数据库中数据添加、查询与更新的示例代码
一.前言 最近做web网站的测试,遇到很多需要批量造数据的功能:比如某个页面展示数据条数需要达到10000条进行测试,此时手动构造数据肯定是不可能的,此时只能通过python脚本进行自动构造数据:本次构造数据主要涉及到在某个表里面批量添加数据.在关联的几个表中同步批量添加数据.批量查询某个表中符合条件的数据.批量更新某个表中符合条件的数据等. 二.数据添加 即批量添加数据到某个表中. insert_data.py import pymysql import random import time
-
JavaScript中关联原型链属性特性
数据属性: 数据属性包含一个数据值的位置,在这个位置可以读取和写入值. 4个描述的行为特性: writable 表示能否修改属性的值.默认为true Enumerable 表示能否过过for in循环返回属性是否可以枚举. configuralbe 表示是否能过来delete删除属性从来重新定义属性,能否修改其配置. value 包含这个属性的数据值.读取属性值的时候,从这个位置读取. 写入属性值的时候,把新值保存在这个位置.这个特性的默认值为true. <script> function F
-
jQuery基于xml格式数据实现模糊查询及分页功能的方法
本文实例讲述了jQuery基于xml格式数据实现模糊查询及分页功能的方法.分享给大家供大家参考,具体如下: 1.此代码只支持xml 格式数据,根据不同需求修改ajax的success方法就ok了 2.此代码只是针对ajax只需一次请求的情况下 String.prototype.trim=function(){return this.replace(/(^\s*)|(\s*$)/g,"");};//解决ie trim问题 (function($) { /** * ============
-
微信小程序 获取javascript 里的数据
微信小程序 获取javascript 里的数据 wxml如何获取js里的数据 例: wxml里: <text id="twl">{{txt}}</text> 通过上面的{{txt}}可以对应获取js里data下定义的txt的值 js里: data: { txt:{} } 首先在data里定义一个"容器"txt:{},{}内为空代表是从别的地方传值进去,当然{}里也可以直接写数据,如txt:{'123'},上面的wxml获取了就相当于 <
-
Laravel使用Caching缓存数据减轻数据库查询压力的方法
本文实例讲述了Laravel使用Caching缓存数据减轻数据库查询压力的方法.分享给大家供大家参考,具体如下: 昨天想把自己博客的首页做一下缓存,达到类似于生成静态页缓存的效果,在群里问了大家怎么做缓存,都挺忙的没多少回复,我就自己去看了看文档,发现了Caching这个部分,其实之前也有印象,但是没具体接触过,顾名思义,就是缓存了,那肯定和我的需求有点联系,我就认真看了看,发现的确是太强大了,经过很简单的几个步骤,我就改装好了首页,用firebug测试了一下,提高了几十毫秒解析时间,当然了有人
-
微信小程序云开发实现数据添加、查询和分页
本文实例为大家分享了微信小程序云开发实现数据添加.查询和分页,供大家参考,具体内容如下 实现的效果 实现要点 WXML 不同类别数据的显示 通过 if-elif-else 实现,在wxml文件中通过 <block></block>渲染,因为它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性.也就是说可以通过属性来控制页面是否要渲染这部分的内容,可以减少页面渲染时间. 云开发数据的获取 先开通云开发功能 ,参考官方文档,然后在创建项目的时候勾选上 使用云开发模板(看个人吧,