UFJ銀行APIをTypescriptで使ってみた

こんにちは、APIは作れないくせに呼ぶのは大好きなペーペーエンジニアです。
今回はUFJ銀行の口座情報(テストデータ)が取れるAPIを使ってみたので備忘録として書きます。

##使用した技術
・Windows10(PC)
・TypeScript
・Vue3

##記事を書いた経緯
今回練習家計簿アプリを作成していた私は口座情報が取りたいと考え、お世話になっているUFJのAPIを検索してみました。しかしここで壁が…

TypeScriptはおろか、JavaScriptもないじゃん！書き方分からないじゃん！
という事で色々試して、何とか正解を見つけたので忘れないうちに記事を書く事にしました。

■APIサービスページはこちらから：
APIサービス | 三菱UFJ銀行

##使う前の準備
まずはメニューの中の「利用手順」を読みながら
ユーザ登録まで済ませます。(利用手順2)
完了したらログイン→キーを発行
利用コースの選択から「配信登録」を押して準備完了です。

今回は「個人API体験コース」を選択しました。

##書いてみた。
これが完了したら後はコードを書くだけです。

script

async getUFJInfo() {
 await axios.get(
  "https://developer.api.bk.mufg.jp/btmu/retail/trial/v2/me/accounts/",
  {
    headers: {
     "X-IBM-Client-Id": "XXXXXXX", //先ほど発行した自身のキー
     "X-BTMU-Seq-No": "20211216-abcdefghij123456", //日付-英数字16桁
     Accept: "application/json", //下と同じ
     accept: "application/json", //サイトに書いてある例そのまま
              },
   }
 );
},

これを実行してconsoleに表示させると無事に口座のテストデータが返ってきました！練習用の家計簿アプリにはこのレベルのデータで問題なさそうです。

##まとめ
とりあえず相手(API側)にheadersを読んでもらえれば問題無いようです。これを応用すれば他の言語でも書けそうな予感です。

非常に便利なのですが、自身のキーをコードに含むので、怖くてGitに挙げられなくなりました！
という訳で今回はこの部分を消してGitに挙げることにします…(´;ω;｀)

ここまで読んでいただきありがとうございました。