高等学校情報科「情報Ⅰ」教員研修用教材(JavaScript版) P31で紹介されている「WebAPI」をJavaScriptで利用する場合のサンプルコードです。

利用しているWebAPIについて

JavaScriptはfetch命令にてWebAPIを呼び出せますが、ブラウザで実行する場合はブラウザのセキュリティ仕様によりHTTPS対応及びCORS対応されたものしか呼び出すことができません。そこで、アシアル情報教育研究所では教育用に使える登録不要のWebAPIを用意しました。

利用上の注意

同WebAPIは教育用のため呼び出し回数に制限があります、また、内容の正確さも含めて一切の保証がありません。
業務利用やリリース用のアプリでの利用はご遠慮下さい。

サンプルコード

<script>
    var url = 'https://api.anko.education/zipcode?zipcode=100-0013';
    fetch(url)
        .then(function(response) {
            return response.json();
        })
        .then(function(address) {
            console.log(address.pref + address.city + address.area);
            document.write(address.pref + address.city + address.area);
        });
</script>

Monaca用サンプルプロジェクト

郵便番号WebAPI

郵便番号WebAPIの仕様

郵便番号WebAPI(あんこAPI版)