※今回のソースはjavascriptでになっておりますが、jqueryで回答して頂いても構いません。
作りたいwebページとしては、お店の名前や、地域などの入力事項に対して、
ぐるなびのAPIが保持している店舗情報のリストを取得することです。
以下の公式サイトを元に調査していたのですが、よくわかりませんでした。
http://api.gnavi.co.jp/api/manual/restsearch/
まずは、デベロッパー申請をして、アクセスキーを取得し、以下のスクリプトを実行し、成功することはできました。
<!DOCTYPE html> <html lang="ja" dir="ltr"> <head> <meta charset="utf-8" /> <title>JSONPでレストラン検索APIの結果を取得するサンプルコード</title> </head> <body> <input type="text" placeholder="enter your access key here" class="js--key"><input type="button" value="apply" class="js--apply" /> <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script> <script> (function(){ var url = 'http://api.gnavi.co.jp/RestSearchAPI/20150630/?callback=?'; var params = { keyid: '', format: 'json', latitude: 35.670083, longitude: 139.763267, range: 1 }; var showResult = function(result){ if ( result.total_hit_count > 0 ) { var res = ''; alert( result.total_hit_count + '件の結果が見つかりました。\n' ); for ( var i in result.rest ){ res += result.rest[i].id + ' ' + result.rest[i].name + ' ' + result.rest[i].access.line + ' ' + result.rest[i].access.station + ' ' + result.rest[i].access.walk + '分\n'; } alert(res); } else { alert( '検索結果が見つかりませんでした。' ); } } $(document).on('click', '.js--apply', function(){ params.keyid = $('.js--key').val(); $.getJSON(url, params, function(result){ showResult(result); }); }); })(jQuery); </script> </body> </html>
ただ、地域情報等を取得したかったため、以下の情報をparamsに追加して再実行したところ、
結果が帰ってきませんでした・・・。
var params = { keyid: '', format: 'json', area: 'tokyo', //追加した行 range: 1 };
他にもテストがてら、色々なパラメータを入れてやっていたのですが、あまり上手く出来ませんでした。
何がいけなかったのでしょうか?
最低限
・お店の名前
・地域
で絞り込みをしたいので、どういうふうに設定してあげればapiが返ってくるのか教えて頂けないでしょうか?
(他のパラメータでも試せるようにはなりたいです。)
お手数では御座いますが、宜しくお願いします。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/07/12 14:08
2015/07/12 14:13