Próbuję stworzyć prosty klon Wikipedii, który umożliwia użytkownikowi wyszukiwanie tematu, a następnie wyświetla 10 wyników zawierających obraz artykułu i krótki fragment tekstu. Byłem w stanie przekazać pole wyszukiwania dostarczone przez użytkownika do mojego połączenia .ajax()
bez problemu. Ale teraz nie mogę odzyskać obrazów, przeczytałem wszystkie inne posty dotyczące StackOverflow dotyczące tego problemu, ale nie udało się.Jak uzyskać krótki fragment tekstu i główny obraz artykułów Wikipedii według interfejsu API?
$(document).ready(function() {
var input = $('input');
var button = $('button');
//Create varialbe to store search field
var toSearch = '';
//Api data:
var searchUrl = 'https://en.wikipedia.org/w/api.php';
//.ajax() to get articles
var ajaxArticle = function() {
$.ajax({
url: searchUrl,
dataType: 'jsonp',
data: {
action: 'query',
format: 'json',
prop: 'extracts',
exchars: '200',
exlimit: 'max',
explaintext: '',
exintro: '',
rawcontinue: '',
generator: 'search',
gsrsearch: toSearch,
gsrnamespace: '0',
gsrlimit: '10'
}, //End data:
success: function(json1) {
console.log(json1);
}
}); //End .ajax()
}
//.ajax() to get images
var ajaxImage = function() {
$.ajax({
url: searchUrl,
dataType: 'jsonp',
data: {
'action': 'query',
'titles': toSearch,
'prop': 'pageimages',
'format': 'json'
}, //End data:
success: function(json2) {
console.log(json2)
}
}); //End .ajax()
}
//Auto complete search bar
input.autocomplete({
source: function(request, response) {
$.ajax({
url: searchUrl,
dataType: 'jsonp',
data: {
'action': "opensearch",
'format': "json",
'search': request.term
},
success: function(data) {
response(data[1]);
}
});
}
}); //End auto compelete
//Listen for click on button to store search field
button.click(function() {
toSearch = input.val();
ajaxArticle();
ajaxImage();
}); //End click handler
})
<html>
<body>
<head>
<title>My Wikipedia Viewer</title>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" />
</head>
<section>
<input type='text' value='' placeholder='Search for...'>
<button>Make it so</button>
</section>
<section class='articles'></section>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script>
<script type='application/javascript' src='js/script.js'></script>
</html>
Doceniam jakiejkolwiek pomocy, które mogą być świadczone.
Fantastyczny, nie mogę ci dziękować za to! Muszę zrobić moje badania na temat generatorów. –
Nie wiem, czy Wikipedia zmieniła wynik json, ale nie ma obrazu. – Gino
@ Termininja Znajduję odpowiedź, której szukałem tutaj: http://stackoverflow.com/a/43039946/211324 "& prop = pageimages | pageterms & piprop = thumbnail & pithumbsize = 600" – Gino