从维基百科获取随机摘录（Javascript，仅限客户端）
我有一个网页，要求用户输入一段文本，然后对其执行一些操作。为了向懒惰的用户演示它，我想添加一个“我觉得很幸运”按钮，从维基百科抓取一些随机文本并填充输入 如何使用Javascript从随机的Wikipedia文章中获取文本序列 我发现了一些使用的示例和文章，但它们往往是服务器端的。我正在寻找一个完全从客户机运行的解决方案，而不是被客户机破坏从维基百科获取随机摘录（Javascript，仅限客户端）,javascript,ajax,jsonp,wikipedia,Javascript,Ajax,Jsonp,Wikipedia,我有一个网页，要求用户输入一段文本，然后对其执行一些操作。为了向懒惰的用户演示它，我想添加一个“我觉得很幸运”按钮，从维基百科抓取一些随机文本并填充输入 如何使用Javascript从随机的Wikipedia文章中获取文本序列 我发现了一些使用的示例和文章，但它们往往是服务器端的。我正在寻找一个完全从客户机运行的解决方案，而不是被客户机破坏 注：随机胡言乱语是不够的；我需要人类可读的有意义的句子。我的答案建立在技术的基础上 棘手的部分是制定正确的查询字符串： generator=random
注：随机胡言乱语是不够的；我需要人类可读的有意义的句子。我的答案建立在技术的基础上 棘手的部分是制定正确的查询字符串：
选择一个随机页面generator=random
和prop=extracts
检索500个字符的摘录exchars=500
返回json格式的数据format=json
将该数据包装在函数调用中，这样它就可以像任何其他callback=
一样被处理并注入页面（请参阅），从而绕过跨域障碍
可以选择添加，每次添加一个新值，以避免来自浏览器缓存的过时结果（IE9中需要）requestid
onWikipedia(
{“查询”：
{“页数”：
{"12362520":
{“pageid”：12362520，
“ns”：0，
“标题”：“电力建筑”，
“摘录”：“这座电力大楼是中国历史悠久的商业建筑
美国俄亥俄州辛辛那提市中心，建于1903年
是由哈里·哈克设计的。它被列入国家登记册
一周后，一群
市中心东北部的建筑被命名为a
辛辛那提东部制造和仓库历史街区
地区；电力大楼是该地区的贡献之一
属性。\n注释“
} } } }
)
<HTML><BODY>
<p><textarea id="textbox" style="width:350px; height:150px"></textarea></p>
<p><button type="button" id="button" onclick="startFetch(100, 500)">
Fetch random Wikipedia extract</button></p>
<script type="text/javascript">
var textbox = document.getElementById("textbox");
var button = document.getElementById("button");
var tempscript = null, minchars, maxchars, attempts;
function startFetch(minimumCharacters, maximumCharacters, isRetry) {
if (tempscript) return; // a fetch is already in progress
if (!isRetry) {
attempts = 0;
minchars = minimumCharacters; // save params in case retry needed
maxchars = maximumCharacters;
button.disabled = true;
button.style.cursor = "wait";
}
tempscript = document.createElement("script");
tempscript.type = "text/javascript";
tempscript.id = "tempscript";
tempscript.src = "http://en.wikipedia.org/w/api.php"
+ "?action=query&generator=random&prop=extracts"
+ "&exchars="+maxchars+"&format=json&callback=onFetchComplete&requestid="
+ Math.floor(Math.random()*999999).toString();
document.body.appendChild(tempscript);
// onFetchComplete invoked when finished
}
function onFetchComplete(data) {
document.body.removeChild(tempscript);
tempscript = null
var s = getFirstProp(data.query.pages).extract;
s = htmlDecode(stripTags(s));
if (s.length > minchars || attempts++ > 5) {
textbox.value = s;
button.disabled = false;
button.style.cursor = "auto";
} else {
startFetch(0, 0, true); // retry
}
}
function getFirstProp(obj) {
for (var i in obj) return obj[i];
}
// This next bit borrowed from Prototype / hacked together
// You may want to replace with something more robust
function stripTags(s) {
return s.replace(/<\w+(\s+("[^"]*"|'[^']*'|[^>])+)?>|<\/\w+>/gi, "");
}
function htmlDecode(input){
var e = document.createElement("div");
e.innerHTML = input;
return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}
</script>
</BODY></HTML>
获取随机维基百科摘录
var textbox=document.getElementById（“textbox”）；
var button=document.getElementById（“按钮”）；
var tempscript=null，minchars，maxchars，尝试次数；
功能启动蚀刻（最小字符数、最大字符数、isRetry）{
if（tempscript）return；//已在进行提取
如果（！isRetry）{
尝试次数=0；
minchars=minimumCharacters；//如果需要重试，请保存参数
maxchars=最大字符数；
button.disabled=true；
button.style.cursor=“等待”；
}
tempscript=document.createElement（“脚本”）；
tempscript.type=“text/javascript”；
tempscript.id=“tempscript”；
tempscript.src=”http://en.wikipedia.org/w/api.php"
+“？操作=查询和生成器=随机和属性=提取”
+“&exchars=“+maxchars+”&format=json&callback=onFetchComplete&requestid=”
+Math.floor（Math.random（）*999999.toString（）；
document.body.appendChild（tempscript）；
//onFetchComplete在完成时调用
}
函数onFetchComplete（数据）{
document.body.removeChild（tempscript）；
tempscript=null
var s=getFirstProp（data.query.pages）.extract；
s=htmlDecode（条带标签）；
如果（s.length>minchars | |尝试次数+++>5）{
textbox.value=s；
button.disabled=false；
button.style.cursor=“自动”；
}否则{
startFetch（0，0，true）；//重试
}
}
函数getFirstProp（obj）{
对于（obj中的var i）返回obj[i]；
}
//这下一个比特借用了原型/拼凑在一起
//你可能想用更坚固的东西来代替
功能条带标签{
退换货（/另请查看Wikipedia API中的origin
参数。它支持使用传统AJAX，而无需进行JSONP注入。可以使用API的explaintext
参数来摆脱htmlHi@RKAGER。我感谢您上面的COR评论。您愿意分享一个考试吗ple实现AJAX方法吗？origin
参数的周围是指$wgcrossiteAjaxDomains
，但我还没有找到一个示例来说明如何在客户端使用jquery或不使用jquery。
<HTML><BODY>
<p><textarea id="textbox" style="width:350px; height:150px"></textarea></p>
<p><button type="button" id="button" onclick="startFetch(100, 500)">
Fetch random Wikipedia extract</button></p>
<script type="text/javascript">
var textbox = document.getElementById("textbox");
var button = document.getElementById("button");
var tempscript = null, minchars, maxchars, attempts;
function startFetch(minimumCharacters, maximumCharacters, isRetry) {
if (tempscript) return; // a fetch is already in progress
if (!isRetry) {
attempts = 0;
minchars = minimumCharacters; // save params in case retry needed
maxchars = maximumCharacters;
button.disabled = true;
button.style.cursor = "wait";
}
tempscript = document.createElement("script");
tempscript.type = "text/javascript";
tempscript.id = "tempscript";
tempscript.src = "http://en.wikipedia.org/w/api.php"
+ "?action=query&generator=random&prop=extracts"
+ "&exchars="+maxchars+"&format=json&callback=onFetchComplete&requestid="
+ Math.floor(Math.random()*999999).toString();
document.body.appendChild(tempscript);
// onFetchComplete invoked when finished
}
function onFetchComplete(data) {
document.body.removeChild(tempscript);
tempscript = null
var s = getFirstProp(data.query.pages).extract;
s = htmlDecode(stripTags(s));
if (s.length > minchars || attempts++ > 5) {
textbox.value = s;
button.disabled = false;
button.style.cursor = "auto";
} else {
startFetch(0, 0, true); // retry
}
}
function getFirstProp(obj) {
for (var i in obj) return obj[i];
}
// This next bit borrowed from Prototype / hacked together
// You may want to replace with something more robust
function stripTags(s) {
return s.replace(/<\w+(\s+("[^"]*"|'[^']*'|[^>])+)?>|<\/\w+>/gi, "");
}
function htmlDecode(input){
var e = document.createElement("div");
e.innerHTML = input;
return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}
</script>
</BODY></HTML>