Yahoo APIをJavaScriptで作成する方法と改良方法

前へ 次へ
このQ&Aのポイント
  • Yahoo APIのURLはPHPで作成されていますが、JavaScriptでも作成することは可能です。
  • mooraku.jsを改良して、画像、価格、商品名、商品説明の4要素をJavaScriptで表示させることができます。
  • 具体的な改良方法を教示いたします。
回答を見る
  • ベストアンサー

Yahoo apiをJavascriptで作成

Yahoo apiの以下のＵＲＬはPHPで作成されています。（サンプルコード集より） http://cgi.geocities.jp/ydevnet/sample/shopping/sample8/ContentMatc... このapiをJavascriptで作成することは可能でしょうか？ 可能であれば、以下のＵＲＬのmooraku.js を改良して作成してみたいと思っています。 http://common1.biz/material/javascript/21/ もし可能であれば、 １、画像 ２、価格 ３、商品名 ４、商品説明 の４要素をJavascriptで表示させるには、どうすればよいのでしょうか？ 具体的に改良方法をご教示いただければと思います。 大変申し訳ございませんが、お詳しい方、よろしくお願い致します。 ｍ（＿ ＿）ｍ

  • mcse
  • お礼率55% (148/266)

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

http://developer.yahoo.co.jp/webapi/shopping/shopping/v1/itemsearch.html Yahoo!ショッピングの検索結果はJSONPで提供されていますので、４要素の表示は可能です。 http://developer.yahoo.co.jp/sitemap/ 他のAPIはRESTなので、クロスドメインをサポートするXHR（XHR2）でなければ、 同一ドメイン内に設置したCGIアプリを経由しないと無理ですね。 >具体的に改良方法をご教示いただければと思います。 一言で言えばJSONPで作ればいいです。 具体的に、、、どこからどこまでの具体的にかわかりませんが、 JavaScript基礎からDOMの方は本一冊で切る規模ですので割愛させていただきます。 var data={name:'名前', price:'100',description:'説明',image:'url'} という変数からHTMLデータ（DOMツリー）を生成して、表示すればOKというものです。 JSONPでは、その元データがコールバック関数の引数に入っています。 プロパティはAPIのリスポンスを確認してください。

mcse
質問者

お礼

ご返信ありがとうございました。 JSONPで作れば、JavaScriptでできることが分かって良かったです。 あと詳しい説明もありがとうございました。 とても参考になりました。 今回のヒントを参考に自分で研究してチャレンジしてみます！

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • Yahoo API 　WEB検索の事で！

    Yahoo API を利用してWEB検索の機能を使おうと考えています。 そこで、 Yahoo!デベロッパーネットワーク - サンプルコード集 ;検索サンプルコード http://developer.yahoo.co.jp/sample/search/sample1.html このページよりphpファイルをダウンロードして試し一応成功しました。 http://cgi.geocities.jp/ydevnet/sample/search/sample1/YJSearchExample.php （このページはサンプルです） 検索結果を見てみるとごちゃごちゃしていて見にくいです。 そこで以下のようなページにしたいのですが http://phpspot.org/lab/yapi/web.php?q=yahoo 簡単に修正できないでしょうか？ ファイルは ・common.php ・YJSearchExample.php なのですが、どの辺りを修正すればいいでしょうか？ ご指導よろしくお願いします。

    • 締切済み
    • PHP
  • 外部ドメインjavascriptとの通信

    WebAPIみたいなのを作りたくって、GoogleAｄSenseとかを参考に色々やっていました。 そこで、別サーバにあるjavascriptファイルとPHPファイルを通信させて呼び出し元サイトにdocument.writeでデータを埋め込もうとしています。 構成としては、 (1)API呼び出し元サイト：from.html (2)呼び出されAPIファイル：api.js (3)api.jsと通信してデータを渡すphpファイル：sample.php 手順としては、 (1)では、 　<script type="text/javascript" src="api.js"> 　として、APIファイルの呼び出し。 (2)と(3)では、 　http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1411752859 　を参考に、api.jsからsample.phpを呼び出す。 　sample.phpではサーバ内のデータベース検索結果をapi.jsに返す。 　受け取った値をdocument.writeでfrom.htmlに埋め込む。 上記の構成・手順で、全て同一サーバ内にあるときにはうまくいっていました。 しかし、from.htmlを別のサーバに移動させて動作させた時、 httpObj.status=0となってしまい、phpからデータが返ってこなくなってしまいました。 自分で調べた所、 ・両方のサーバでApache2は動いている ・<script type="text/javascript" src="api.js">のapi.jsの所は、ちゃんと置かれているサーバのアドレスも含めて書いている(もちろん、api.jsが呼び出すPHPファイル名も) ・from.htmlはhtmlファイルをダブルクリックなどしてるわけではなく、ちゃんとブラウザからHTTPでアクセスしている 「javascript ｈｔｔｐObj.status 0」とかでググって出てきた原因を自分なりにチェックしてみたのですが、 中々うまくいかず苦労しています。 できれば具体的にどうすればいいのか教えて頂けると助かります。 宜しくお願いします。

  • 楽天商品検索APIをjavascriptで利用

    こんにちは。 楽天の商品検索結果一覧をHTMLファイルにロードして表示したいと思います。 楽天商品検索APIを利用します。 http://webservice.rakuten.co.jp/api/itemsearch/ ThinkIT http://thinkit.co.jp/article/1103/1 こちらのサイトで紹介されている、 http://www.h-fj.com/thinkit/rest/jquery.html このサンプルを利用すればできそうなのですが、楽天APIは一度に表示できる商品が30個までという制限があるため（hitsパラメータの上限が30）、pageパラメータを、page=1、page=2と切り替えていかなければすべての検索結果を表示できません。 そのpageパラメータの指定を簡単に切り替えて表示していく方法がよくわからず、皆様にアドバイスいただきたいです。 理想は、HTMLページをロードした時点で１ページ目の30商品を表示し、「次へ」ボタンまたは数個配置したページボタンを押すことで次のページの商品に切り替えていくというシンプルなものです。使っているサーバーではPHPは使えずJavascriptとCSSのみです。 当方Javascriptは勉強中で、まだ初歩的な文字列操作やサンプルの改変ぐらいしかできません。恐れ入りますが、もし可能でしたらサンプルコードなど教えていただけると助かります。 何卒よろしくお願いいたします。

  • JavaScript+Flash フローティングについて

    JavaScript+Flashで質問です。 こちらのjavascriptをカスタマイズし、フローティングのFLASHを制作しています。 overLayFlash JS: Fullsize FLash Overlays むらけんさん作成 - ​http://www.muraken.biz ​http://www.muraken.biz/overlay/overLayFlash.js 全画面ではなくサイズを指定し、右上に位置を固定するまではカスタマイズ出来たのですが、 スクロールに追従する方法がわからず困っています。 お分かりの方、ぜひご伝授願います。

  • JavaScript内にJavaScriptを読み込む方法

    HTML内に <script type=\"text/javascript\" src=\"main.js\"></script> という一行を追加すると、バナーが表示されるというスクリプトを作成しています。 main.jsは、 html = \'<script language=\"JavaScript\">\'; html += \'var url0101 = \"url01.xxx.jp\";\'; html += \'var url02 = \"url02.oooo.jp\";\'; html += \'</script>\'; html += \'<script language=\"JavaScript\" src=\"http://xxx.xxxx.xxx/test.js\"></script>\'); html += \'<script language=\"JavaScript\">\'; html += \'Function01(\"check\")\'; html += \'</script>\'; document.write(html); というような風になっており、 (1) 変数の宣言 ↓ (2) http://xxx.xxxx.xxx/test.jsの読み込み ↓ (3) (2)で読み込んだjs内の関数Function01を実行 という流れです。 FireFoxでは表示されましたが、IE6では (2)のjsを読み込む前に(3)のFunction01が実行され、 「オブジェクトを指定してください」のエラーが表示されてしまいます。 よい方法がありましたら教えていただけますでしょうか？ よろしくお願いします。

  • JavaScript内にJavaScriptを読み込む方法

    HTML内に <script type="text/javascript" src="main.js"></script> という一行を追加すると、バナーが表示されるというスクリプトを作成しています。 main.jsは、 html = '<script language="JavaScript">'; html += 'var url0101 = "url01.xxx.jp";'; html += 'var url02 = "url02.oooo.jp";'; html += '</script>'; html += '<script language="JavaScript" src="http://xxx.xxxx.xxx/test.js"></script>'); html += '<script language="JavaScript">'; html += 'Function01("check")'; html += '</script>'; document.write(html); というような風になっており、 (1) 変数の宣言 ↓ (2) http://xxx.xxxx.xxx/test.jsの読み込み ↓ (3) (2)で読み込んだjs内の関数Function01を実行 という流れです。 FireFoxでは表示されましたが、IE6では (2)のjsを読み込む前に(3)のFunction01が実行され、 「オブジェクトを指定してください」のエラーが表示されてしまいます。 よい方法がありましたら教えていただけますでしょうか？ よろしくお願いします。

  • JAVASCRIPTで背景を切り替える方法

    以下の２つのjsファイルをボタンで切り替えれるようにするにはどういうソースで可能でしょうか？ <SCRIPT type="text/javascript" src="http://www9.ocn.ne.jp/~aki2nd/dhtml/sample/heartdrop.js"></SCRIPT> <SCRIPT type="text/javascript" src="http://www9.ocn.ne.jp/~aki2nd/dhtml/sample/stardrop.js"></SCRIPT> ２つとも動く背景のjsファイルです。 bodyに置けば作動しますので、ボタンを押して２つを切り替えれるようにしたいのですがどうしても方法がわかりません。 どなたかご教授いただけないでしょうか？ よろしくお願いします。

  • javascript 動作がうまくいかない

    javascriptは、ほぼわかりません。 参考url http://histerian.net/pallax/ パララックス サイトを構築しておりました。 メニューを押してスクロール移動すると、上部のmenuがアクティブ状態になります。 しかし、下にスクロールしてからメニューを押して、上に移動すると、menuが2つ、アクティブ状態になってしまいます。 ただ、1px上にずらすだけで低いコンテンツのメニューのアクティブが消え、本来のコンテンツのmenuがアクティブになります。 下へスクロールしてから、メニューを押して上に戻ったときに、該当のmenuのみ、アクティブ状態になるようにしたいです。 使用している元は cool-kitten というサンプルです。 url https://www.jqueryscript.net/demo/jQuery-Responsive-Parallax-Scroll... 使用しているjQueryは以下になります。 jquery.easing.1.3.js jquery.stellar.min.js waypoints.min.js 動作を制御しているjavascriptファイルは以下になります。 scripts.js どなたかご教示していただけないでしょうか よろしくお願い致します

  • PerlでJavaScriptを作成しているのですが・・・

    PerlでJavaScriptを作成しているのですが、以下の部分で困っています。 たとえば、Perlの変数「$codes」に「AAA\nBBB\nCCC\n」が入っているとします。 ---------------------------------------------------------------------- 　print <<"END_OF_HTML"; 　function sample() 　{ 　　document.FORM.ele.value="$codes"; 　} 　END_OF_HTML ---------------------------------------------------------------------- とPerlで記述すると、作成されたソースは、 ---------------------------------------------------------------------- 　function sample() 　{ 　　document.FORM.ele.value="AAA 　BBB 　CCC 　"; 　} ---------------------------------------------------------------------- となり、JavaScriptエラーになってしまいます。 Perlでエンコードしてから、JavaScriptでデコードしてみよう！と試してみたのですが、Perl⇔JavaScriptのエンコード／デコードがうまくいきませんでした。 （Perlでエンコードした値が、JavaScriptで元の形に戻せませんでした。わたしの能力不足です。。。） どなたか、よい方法をご存知ないでしょうか？よろしくお願いします。

    • ベストアンサー
    • Perl
  • AmazonのAPIが廃止になる？

    以下のURLにProduct Advertising API (PA-API)が8/31で廃止になると書いていました。 http://www.amazonsellercommunity.com/forums/ann.jspa?annID=238 細かいことはわからずに使っていたのですが、PA-APIは全廃止になると今までASINから類似のアフィリエイト商品のURLを作っていたようなサイトとかも動かなくなるということなのでしょうか？ 詳しいかた、教えて頂けると助かります＞＜

    • ベストアンサー
    • PHP

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する