Reskilling ❘ Programming

Robloxでプログラミング | APIと非同期処理

#リスキリング #レジリエンス #ICT教育 #ITスキル #プログラミング

RobloxでAPIと非同期処理を学ぼう
プログラミング

Robloxは知っていますか?

誰でも気軽にゲームを作ることができる便利なサービスです。

実はRobloxは外部のWebサイトと接続することができます。

実際のシステム開発でもよく使われる、APIと非同期処理について、Robloxを使って学んでみましょう。

  • 2015年

    創業

  • 120名

    従業員数

  • 2.3M

    月間UU

  • 1,800戸

    管理戸数

0. APIとはなんだろう?

APIとはなんでしょうか。

一言でいうと、API(Application Programming Interface)とは、「ソフトウェア同士が情報をやり取りするための窓口(インターフェース)」のことです。

わかりやすいように、レストランを例にして説明してみます。

1. レストランに例えると?

あなたがレストランでお客さんだとします。あなたはキッチンの奥でどうやって料理が作られているか詳しく知らなくても、メニューを見て「ウェイター」に注文を伝えれば、料理が運ばれてきますよね。

この関係をコンピューターの世界に当てはめると、次のようになります:

  • あなた(アプリ): 情報を頼む側。

  • キッチン(サーバー): 膨大なデータや複雑な仕組みを持っている側。

  • ウェイター(API): 両方の間に入って、「リクエスト(お願い)」を受け取り、「レスポンス(お返し)」を届ける窓口です。

2. どうしてAPIが必要なの?

APIがあるおかげで、自分ですべてを作らなくても、他の人が作った便利な機能を自分のアプリで使えるようになります

例えば、お店を紹介するアプリを作るとき、自分で世界中の地図を描くのは大変です。しかし、地図サービスが提供しているAPI(Google Maps APIなど)を使えば、簡単に自分のアプリに地図を表示させることができます。

3. APIはどうやって動くの?

APIとのやり取りは、主にインターネットを通じて、リクエストレスポンスのキャッチボールで行われます。

  • リクエスト(お願い): 「データをください(GET)」「新しく登録して(POST)」といったメソッド(命令)をAPIに送ります。

  • レスポンス(お返し): APIが「はい、これです」とデータを返してくれます。このときによく使われるのが、人間にもコンピューターにも読みやすい「JSON(ジェイソン)」というシンプルなテキスト形式のデータです。

4. セキュリティも大切

APIは誰でも勝手に使えるわけではありません。大切な情報を守るために、「あなたは誰ですか?(認証)」と「あなたは何をしていいですか?(認可)」という確認の仕組みがあります。

多くの場合は、「APIキー」という専用のパスワードのようなものを使って、許可された人だけが使えるようになっています。

APIは、バラバラのソフトウェアやサービスをつなぐ「橋渡し」の役目をしています。私たちが普段スマホで天気予報を見たり、SNSでログインしたりできるのも、裏側でたくさんのAPIが働いてくれているおかげなのです。

1. APIを叩いてみよう

それでは、「天気情報API」のドキュメントを参考に、実際にAPIを「叩いて」みましょう。

プログラミングの世界では、APIを使って情報を取得することを「APIを叩く」と呼びます。やり方はとても簡単で、普段使っているブラウザ(Google ChromeやSafariなど)だけで試すことができます。

1. APIのリクエストURLを用意する

APIから情報を引き出すには、専用の住所のようなURLが必要です。今回の天気情報APIでは、以下のルールでURLが作られています。

  • ベースとなるURL: https://weather.tsukumijima.net/api/forecast

  • 場所を指定するID(city): 地域ごとに決められた番号(例:福岡県・久留米は 400040

これらを組み合わせると、情報を呼び出すためのURLが完成します。

久留米の天気を呼び出すURL: https://weather.tsukumijima.net/api/forecast/city/400040

2. ブラウザでアクセスしてみよう

作成したURLをコピーして、ブラウザのアドレスバーにそのまま貼り付け、エンターキー(Enter)を押してください

すると、画面に文字がずらっと並んだ結果が表示されるはずです。これがAPIからの「レスポンス(お返し)」です。

3. 返ってきたデータを確認する

表示された文字の集まりは、「JSON(ジェイソン)」というコンピューターが読み取りやすいデータ形式で書かれています。よく見ると、次のような項目が見つかるはずです。

  • title:「福岡県 久留米 の天気」など、データのタイトル

  • forecasts:これからの予報データが入っている場所

  • telop:「晴れ」や「曇り」といった天気の名前

  • temperature:最高気温や最低気温

このように、APIを叩くことで、アプリの裏側でやり取りされている「生(なま)のデータ」を自分の目で見ることができます。

APIのドキュメントを読み、正しいURLを作ってアクセスする。たったこれだけで、世界中の便利なサービスとつながることができます。

今回はブラウザで確認しましたが、このURLをプログラムから呼び出すようにすれば、「自動で今日の天気を教えてくれる自分専用のアプリ」も作れるようになるのです。

2. APIで簡単なアプリを作ってみよう

それでは、APIを使って実際に簡単なアプリを作ってみましょう。

いきなりアプリを作るのは難しいので、まずはHTMLでAPIを叩くところからはじめてみましょう。

ソースコードは以下をコピーして使ってみましょう。

ですが、以下のコードは一部あえて記載していません。




    
    Step 1: コンソール確認
    



    

Step 1: コンソールでデータを確認しよう

ボタンを押して、ブラウザの「デベロッパーツール(コンソール)」を見てください。

まだ埋められていない部分は

Step 2: 取得したデータを画面に表示しよう

(ここに地名が出ます)

(ここに天気が出ます)

まだ埋められていない部分は