高木のブログ

【JavaScript】Fetch API で Basic 認証

2022/09/02

Basic 認証が掛かった API からデータを取得するコードを書くことがよくある
その度に調べているのでメモ

#!/usr/bin/env zx

const username = "takagi"
const password = "thisispassword"

const res = await fetch("http://localhost:4567/auth", {
  headers: {
    Authorization: "Basic " + btoa(`${username}:${password}`)
  }
})
console.log(await res.text())
$ zx script.mjs --quiet
Authorized.

最近よく使っている zx で動作確認した

いつも脳死でコピペしてたけど、よく見たらそんなに難しい書き方じゃないから普通に覚えられるな

補足

動作確認で使った API は「【Sinatra】ページ単位で Basic 認証を入れる」で作ったやつを使った

$ curl http://localhost:4567/auth
Unauthorized.

$ curl http://localhost:4567/auth -H "Authorization: Basic $(echo -n 'takagi:thisispassword' | base64)"
Authorized.

ytkg

Written by ytkg, Twitter, GitHub