【HTML】イベント支援サイトconnpassの検索ページ作ってみた。


最近色々な勉強会に参加していますが、会社の先輩からconnpassというイベント支援サイトを紹介していただきました。

connpass

でも、イベントの検索機能が見当たらない。。。

無いなら作ってしまおう! ということで簡易検索ページを作ってみました。

↓が作ったページのリンクになります。

connpass Event Search

まず、connpassで提供されているWeb APIを調べました。
以下のページで提供している機能が公開されています。

connpass api リファレンス

GETリクエスト送信時に必要なパラメータを与えてやることで値が返ってくる仕組みです。
JSON (JavaScript Object Notation)というデータ交換フォーマットで値が返ってきます。

リファレンスにはありませんが、

callback=コールバック関数名

としてやることでJSONPにも対応します。

 

私は最初、XMLHttpRequestを使えば簡単にできるだろうと思っていました。

しかし、異なるドメイン間の通信(クロスドメイン通信)に非対応であったため、GETのリクエスト応答が常に0になり、responseTextも取り出せない状況で頭を抱えてしまいました。。。

色々調べてみるとJavascriptでクロスドメイン通信を行うにはJSONPという方法で行うのが正しいと分かりました。
※ここにたどり着くまで半日もかかってしまいました。。。

 

通信の方法さえ分かれば、あとは受信した内容を解析・整形してやれば良いだけなのであとは楽です。

とりあえず、札幌(または北海道)の勉強会、カテゴリー別の勉強会一覧が取得できれば良いので、これらの検索機能を実装しました。
実装には試験的にHTML5とCSS3を使っています。
今まで実現しにくかったものが実現しやすい環境になったなと思いましたね。

そのうち、Google Maps APIとかと連動させて地図情報も提供できるようにしていきたいなぁ。

時間を見つけて機能拡張はしていこうと思いますので、ご要望などがありましたらご連絡ください。
※連絡先はプロフィールページに記載しています。この記事に対してのコメントでもOKです。


この記事をシェアする

    Mask_Siva

    北の試される大地に生息しているSEです。
    楽しみながらプログラムを作ったり、ゲームで遊んだりしています。

    コメントをお待ちしております

    HTMLタグは利用できません

    Advertising



    新品/中古ゲーム販売 通販ショップの駿河屋

    Twitter

    仮面被り過ぎ@コンプレックス大佐
    @Mask_Siva

    • 緊急事態発生。 薬のストック切れ、、、 どうやら釧路に残りを置いてきてしまったようだorz これはかなりまずい状況。 明日は病院開いてないはずだから、最低でも月曜日まで乗り切るしかない。。。
      about 6時間 ago
    • 関係各所から送られてくる想定だった書類が一通り届いたので、起きたら署名ラッシュ。
      about 6時間 ago
    • 昨日、8号さんと話していたタイピング速度について計測してみました。 #タイピング速度測定 「タイピングに自信を持っていいレベル」(ローマ字) ランク: S+ 打鍵数: 195 打鍵 平均入力打鍵: 6.5 打鍵/秒 瞬間最高打鍵… https://t.co/GhNVGWJrgF
      about 7時間 ago

    BGM

    機動戦士ガンダムUC オリジナルサウンドトラック
    10 RX-0 -澤野弘之

    ↓の再生ボタンで再生できます
    色々な楽曲を試聴したいなら
    >>>こちら<<<

    Nico Nico Community

    Calendar

    2021年1月
     12
    3456789
    10111213141516
    17181920212223
    24252627282930
    31 

    Archive

    My WIsh List

    Amazonで気になっている物をまとめています。

    「これは良かった!」「こっちの方がいいよ!」というものがあれば、教えてください<(_ _)>

    https://amzn.to/3oof0rZ