そもそもWebAPIとは？

こんにちは山田です。
外部サーバとデータの受け渡しをする方法として、
APIという方法があるとわかったのでその調査をしてみました。

よくあるAPIとしてはGeogleMAPや郵便番号の検索が思いつくと思います。

日本の全エンジニアに捧ぐ！現在公開されているAPI一覧【2013年版】

■そもそもWebAPIとは

Application Program Interfaceの略
直訳すると、あるプログラムを、他のアプリケーションから利用するためのインターフェースという意味になります。

目的としては、自社で保有するデータや、システム、アプリケーション、Webサービスの機能を公開して他社で使ってもらうためです。

動きとしては
WebAPIで機能を公開しているサーバに対して、HTTPリクエストの形で送信して、
処理結果がHTTPレスポンスの形で返ってきます。

■URLの設計
方法としてサブドメインに配置する方法　http://api.example.com/
ドメイン下に置く方法　http://example.com/api/
それぞれあります。
自分でつくるサイトは小規模なので、後者でよさそうです。

■外部APIと内部APIの違い
社外の人に使ってもらうものを外部APIと呼び分けています。
社内で完結する場合は内部APIというものになります。

■データ通信形式
XMLとJSON（JavaScript Object Notation）がある
最近では可読性の観点から、JSONを使うことが一般的のようです。

■HTTPリクエストを送る際のポイント
●リクエスト形式
HTTPリクエストを送信する方法としては、大きく分けてJSONとフォームの二つがあります。

フォーム形式が一般的で、フォームでのPOST送信の場合、文字データだけではなく画像や動画などのバイナリデータも送れます。

JSON形式も最近多い形です。こちらは構造化したJSONデータなので、送る際に可読性が上がるというメリットがあります。

5分で絶対に分かるAPI設計の考え方とポイント　より
http://www.atmarkit.co.jp/ait/articles/1511/19/news022.html

Read More

XMLHttpRequestとは？

こんばんわ、開発者のⅠです。

さて、今回は前々回の投稿についての補足として、APIのひとつであるXMLHttpRequestについて説明したいと思います。

以下のソースは、前々回の投稿での使用例です。
マーカーの情報が記録されたCSVファイルを読み込むための関数 getCSVFile に組み込んでいます。

 
　function getCSVFile() {
　　　var xhr = new XMLHttpRequest();
　　　xhr.onload = function () {
　　　createArray(xhr.responseText);
　　　};

　　　xhr.open("get", "markerlist.csv", true);
　　　xhr.send();
　}
　getCSVFile();

このAPIは、ブラウザ上でサーバーとHTTP通信を行うために利用します。


また、各メソッドの意味については以下の通りです。

【onload】 ： レスポンスを受信完了した段階で行う処理を記述します

　【open】： 実際に送信するリクエストを生成します。リクエストの型、ファイルの存在するURL、

　　　　　　　非同期通信を行うか否かを指定します。

　【send】： 生成したリクエストをサーバーへ送信します。

つまり、上に記述した関数 getCSVFileを言い換えてみると、

　「markerlist.csvを対象に非同期通信を行うようGET型のリクエストを生成・送信し、

　  この通信が完了した時点で、取得したファイル内のデータを引数として、

　　関数createArray(xhr.responseText)を実行する」

という感じでしょうか。

思ったよりも、シンプルに外部ファイルを取得できるのですね……。

それでは、今日はこの辺で失礼します。

Read More