OAuth 2.0を理解しよう


最近、業務でOAuth 2.0を使うことになりました。私自身も完全に理解しているわけではなかったので、改めてOAuth 2.0の仕様を把握するために、AI（ChatGPT）に教えてもらいました。それを共有したいと思います。

# 目次
1. [OAuth 2.0とは](#what-is-oauth)
2. [OAuth 2.0の流れ](#oauth-flow)
3. [小学生にでもわかるように要約してもらいました。](#oauth-child)
4. [OAuth 2.0を使っている有名なサービス](#famous-services)
5. [OAuth 2.0の例](#example)
6. [まとめ](#summary)

## OAuth 2.0とは <a name="what-is-oauth"></a>

OAuth 2.0（Open Authorization version 2.0）は、ユーザーが自分のアカウント情報を直接提供せずに、第三者アプリケーションがユーザーの代わりにサービスを使用できるようにする開放的な認証プロトコルです。これは、一部の情報を共有することで他のアプリケーションと連携するための一般的な方法となっています。

## OAuth 2.0の流れ <a name="oauth-flow"></a>

OAuth 2.0のフローは次のようになります：

1. **認証リクエスト**：ユーザーはアプリケーションから認証サーバーにリダイレクトされます。
2. **認証**：ユーザーは認証サーバーにログインし、クライアントが要求しているリソースへのアクセスを許可します。
3. **認証応答**：認証サーバーはユーザーをクライアントのリダイレクトURIにリダイレクトします。このリダイレクトURIには認証コードが含まれています。
4. **アクセストークンリクエスト**：クライアントは認証コードを使用して認証サーバーにアクセストークンをリクエストします。
5. **アクセストークン応答**：認証サーバーはクライアントにアクセストークンを提供します。クライアントはこのトークンを使用してリソースサーバーからユーザーデータにアクセスします。
6. **リソースリクエストと応答**：クライアントはアクセストークンを使用してリソースサーバーにリソースをリクエストします。リソースサーバーはアクセストークンを確認し、リクエストされたリソースを提供します。

## 小学生にでもわかるように要約してもらいました。 <a name="oauth-child"></a>
1.**アイスクリームを注文する**：あなたが友達（アプリケーション）に、お母さん（GoogleやFacebook）を通じてアイスクリーム（情報）を買ってくるように頼みます。

2.**お母さんに頼む**：友達（アプリケーション）はお母さん（GoogleやFacebook）にアイスクリーム（情報）を買ってくる許可をもらいます。
3.**アイスクリーム券**をもらう：お母さんは友達（アプリケーション）にアイスクリーム券（認証コード）を渡します。
4.**アイスクリーム券をアイスクリームに交換する**：友達（アプリケーション）はアイスクリーム券（認証コード）を使って、アイスクリーム屋さん（リソースサーバー）からアイスクリーム（ユーザーデータ）をもらいます。
5.**アイスクリームをもらう**：アイスクリーム屋さん（リソースサーバー）はアイスクリーム券（アクセストークン）を確認し、友達（アプリケーション）にアイスクリーム（情報）を渡します。

## OAuth 2.0を使っている有名なサービス <a name="famous-services"></a>

OAuth 2.0は非常に広く使われていて、Google、Facebook、Twitter、GitHubなど多くの有名なウェブサイトやアプリケーションで採用されています。

## OAuth 2.0の例 <a name="example"></a>

以下は、Node.jsとExpressを使用したシンプルなOAuth 2.0の例です：

```javascript
const express = require('express');
const request = require('request');
const querystring = require('querystring');

const app = express();

app.get('/login', function(req, res) {
  res.redirect('https://authorize.url?' +
    querystring.stringify({
      response_type: 'code',
      client_id: 'client_id',
      redirect_uri: 'http://localhost:8888/callback',
      scope: 'user-read-private user-read-email'
    }));
});

app.get('/callback', function(req, res) {
  const code = req.query.code || null;
  const authOptions = {
    url: 'https://api.token.url',
    form: {
      code: code,
      redirect_uri: 'http://localhost:8888/callback',
      grant_type: 'authorization_code',
      client_id: 'client_id',
      client_secret: 'client_secret'
    },
    json: true
  };

  request.post(authOptions, function(error, response, body) {
    if (!error && response.statusCode === 200) {
      const access_token = body.access_token;
      res.redirect('/#' +
        querystring.stringify({
          access_token: access_token
        }));
    } else {
      res.redirect('/#' +
        querystring.stringify({
          error: 'invalid_token'
        }));
    }
  });
});

console.log('Listening on 8888');
app.listen(8888);
```

このコードは、まず`/login`エンドポイントにアクセスすることでユーザーを認証サーバーにリダイレクトします。認証サーバーからのリダイレクト応答は、`/callback`エンドポイントに送られ、ここでアクセストークンがリクエストされます。

## まとめ <a name="summary"></a>

OAuth 2.0は、ユーザーが自分のアカウント情報を直接提供することなく、第三者アプリケーションがユーザーの代わりにサービスを使用するための一般的な方法です。本記事では、その基本的な流れとサンプルコードを紹介しました。これであなたもOAuth 2.0の仕組みを理解できたことでしょう。