JSで楽天ブックスの総合検索APIを作ったが動かない。。
Q&A
Closed
解決したいこと
jQueryを勉強しています。
APIを使って検索機能を作っているのですが、アプリケーションIDを発行して実際に動かしてみるとエラーが出てしまいます。
https://qiita.com/takuyahori/items/8b80bf0c28da37bd1112
こちらを参考にして作りました。
発生している問題・エラー
↓コンソールで確認
GET https://app.rakuten.co.jp/services/api/Kobo/EbookSearch/20170426?applicationId=1065320682399172319&keyWord=f&format=json&bookGenreId=001&page=1&hits=20 400 (400)
↓デベロッパーツールのネットワークに出ていたエラー内容
error
:
"wrong_parameter"
error_description
:
"keyword or title or itemNumber or author or publisherName or koboGenreId is essential parameter and must be set"
↓翻訳語
keyword または title または itemNumber または author または publisherName または koboGenreId は必須パラメーターであり、設定する必要があります
これが良く分かりません。。。
該当するソースコード
<div class="wrap">
<div class="container">
<div class="header">
<p class="header__title">Search Books!</p>
</div>
<div class="search">
<div class="search__text">
<input type="text" id="js-search-word" class="search__text__input" value="" placeholder="検索する">
</div>
<button id="js-search-button" class="search__btn">検索する</button>
</div>
<ul class="lists"></ul>
</div>
</div>
<script defer>
window.addEventListener( 'load', function(){
let pageNum = 0;
let prevWord = "";
$("#js-search-button").on("click", function() {
pageNum = pageNum+1
let keyWord = $("#js-search-word").val();
if(prevWord !== keyWord){
pageNum = 1;
$(".lists").empty();
prevWord = keyWord;
};
$.ajax({
type: "GET",
url: "https://app.rakuten.co.jp/services/api/Kobo/EbookSearch/20170426",
data: {
applicationId: "1065320682399172319",
keyWord: keyWord,
format: "json",
bookGenreId: "001",
page: pageNum,
hits: 20,
}
}).done(function(data) {
if(data.count > 0) {
$(".comment").remove();
let list = "";
for (let i=0; i<data.Items.length; i++) {
list += '<li class=lists__item>' +
'<div class=lists__item__inner>' +
'<a href=${data.Items[i].Item.itemUrl} class=lists__item__link target=_blank>' +
'<img src=${data.Items[i].Item.largeImageUrl} class=lists__item__img alt>' +
'<p class=lists__item__detail>作品名: ${data.Items[i].Item.title}</p>' +
'<P class=lists__item__detail>作者 : ${data.Items[i].Item.author}</p>' +
'<p class=lists__item__detail>出版社: ${data.Items[i].Item.publisherName}</p>' + '</a>' + '</div>' + '/li>';
};
$(".lists").prepend(list);
} else {
$(".commit").remove();
$(",lists").before("<div class='commit'</div>");
$(".comment").html("<p class='message'>検索結果が見つかりませんでした。<br>別のキーワードで検索してください。 </p>");
};
});
});
}, false);
</script>
自分で試したこと
↓楽天のAPI詳細から持ってきました。
&keyword=%97%BF%97%9D
&koboGenreId=101
&sort=%2BitemPrice
こちらを↓に使うことはあるのかと思い使ってみてもエラーになります。
data: {
applicationId: "1065320682399172319",
keyWord: keyWord,
format: "json",
bookGenreId: "001",
page: pageNum,
hits: 20,
}
自分なりに色々いじってみたのですが、上手くいきませんでした。
分かる方ぜひ教えてください。
0