Axiosを使用して認証ヘッダーを送信する方法

Axiosを使用して認証ヘッダーを送信する方法を学ぶ

Axios POSTリクエストでヘッダーを設定するには、3番目のオブジェクトをaxios.post()コール。

すでに2番目のパラメーターを使用してデータを送信している可能性があり、URL文字列の後に2つのオブジェクトを渡すと、最初のパラメーターがデータで、2番目のパラメーターが構成オブジェクトになります。headers別のオブジェクトを含むプロパティ:

axios.post(url, {
  data: {
    ...
  }
})
axios.post(url, {
  //...data
}, {
  headers: {
    ...
  }
})

認証ヘッダーを設定するには、次のように呼び出します。

const token = '..your token..'

axios.post(url, { //…data }, { headers: { ‘Authorization’: Basic </span><span style="color:#e6db74">${</span><span style="color:#a6e22e">token</span><span style="color:#e6db74">}</span><span style="color:#e6db74"> } })

(認証トークンは異なる場合があります。使用しているアプリに確認してください)

Axios GETリクエストにヘッダーを設定するには、2番目のオブジェクトをaxios.get()呼び出し、たとえばこれはGitHubGETリクエストです/user

axios.get('https://api.github.com/user', {
  headers: {
    'Authorization': `token ${access_token}`
  }
})
.then((res) => {
  console.log(res.data)
})
.catch((error) => {
  console.error(error)
})

私はWordPressAPIでいくつかの作業を行っていましたが、WebサイトへのPOSTリクエストを実行するために認証する必要がありました。

私にとって最も簡単な方法は、基本認証を使用することでした。

私はAxiosを使用していたので、Authorizationこの方法でPOSTリクエストのヘッダー:

const username = ''
const password = ''

const token = Buffer.from(</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">username</span><span style="color:#e6db74">}</span><span style="color:#e6db74">:</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">password</span><span style="color:#e6db74">}</span><span style="color:#e6db74">, ‘utf8’).toString(‘base64’)

const url = ‘https://…’ const data = { … }

axios.post(url, data, { headers: { ‘Authorization’: Basic </span><span style="color:#e6db74">${</span><span style="color:#a6e22e">token</span><span style="color:#e6db74">}</span><span style="color:#e6db74"> }, })

私の無料ダウンロードJavaScriptビギナーズハンドブック


その他のjsチュートリアル: