現代の Web 開発の世界では、アプリケーションへの安全なアクセスを確保するために 認証 が不可欠です。ユーザー認証を処理するには複数の方法があり、最も一般的な方法には、JWT (JSON Web Token) や OAuth などがあります。この投稿では、これらの方法を検討し、システムを安全に保ちながら、Google や Facebook などの人気サービスと認証を統合する方法を示します。

認証とは何ですか?

認証は、システムにアクセスしようとしているユーザーの身元を確認するプロセスです。アプリにログインすると、認証によって本人であることが保証されます。

認証には次のようなさまざまな方法があります:

• パスワードベースの認証: ユーザーがユーザー名とパスワードを入力する最も一般的な方法。
• トークンベースの認証: ユーザーはログイン後にトークンを受け取り、その後のリクエストの認証に使用されます。
• OAuth: サードパーティ サービスによるユーザーの検証を許可し、パスワードを共有せずにアクセスを提供します。

JWT（JSONウェブトークン）とは何ですか?

JSON Web Token (JWT) は、API およびシングルページ アプリケーション (SPA) を保護するための一般的な方法です。 JWT は、当事者間で情報を安全に送信するために使用される、コンパクトで URL セーフなトークンです。

JWT の構成要素は次のとおりです:

• ヘッダー: トークンのタイプと署名アルゴリズム (HMAC、RSA など) に関する情報が含まれます。
• ペイロード: 転送されるクレームまたはデータ (ユーザー ID、有効期限など) が含まれます。
• 署名: データが変更されていないことを検証することで、トークンの整合性を保証します。

JWTの例

{
  "header": {
    "alg": "HS256",
    "typ": "JWT"
  },
  "payload": {
    "sub": "1234567890",
    "name": "John Doe",
    "iat": 1516239022
  },
  "signature": "SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c"
}

JWT は、秘密キーを使用してヘッダー、ペイロード、署名をエンコードすることによって作成されます。その後、このトークンはクライアントに送信され (通常はローカル ストレージまたは Cookie に保存されます)、ユーザーを認証するための各リクエストとともに渡されます。

仕組みは次のとおりです:

sequenceDiagram
    participant User
    participant Server
    User ->> Server: Sends Login Credentials
    Server ->> User: Sends JWT
    User ->> Server: Requests Data with JWT
    Server ->> User: Verifies Token, Responds with Data

JWT を使用する理由

1. ステートレス: サーバーはセッション データを保存する必要がありません。 JWT には必要な情報がすべて含まれています。
2. スケーラブル: サーバー上にセッション ストレージがないため、アプリケーションを拡張するのが簡単です。
3. セキュリティ: 署名により、トークンが改ざんされていないことが保証されます。

OAuthとは何ですか?

OAuth は、承認のオープン標準です。これにより、ユーザーは、認証情報をサードパーティ アプリと共有せずに、既存のアカウント (Google、Facebook など) を使用してサードパーティ アプリケーションにログインできるようになります。

OAuth は、サードパーティ サービスがユーザーに代わって他のプラットフォームとやり取りできるようにする アクセス トークンを発行することで機能します。

OAuth の基本的なフローは次のとおりです:

sequenceDiagram
    participant User
    participant App
    participant Google/Facebook
    User ->> App: Login with Google/Facebook
    App ->> Google/Facebook: Requests Authorization
    Google/Facebook ->> User: User Authorizes Access
    Google/Facebook ->> App: Sends Access Token
    App ->> User: Authenticated!

1. ユーザーが Google でログイン または Facebook でログインをクリックします。
2. アプリは認証のためにユーザーを Google/Facebook にリダイレクトします。
3. ユーザーは、特定の情報 (プロフィール、電子メールなど) へのアクセスを許可することに同意します。
4. Google/Facebook はアプリに アクセス トークンを提供します。
5. アプリはトークンを使用して、ユーザーに代わって承認された API リクエストを作成します。

OAuth を使用する理由

1. 利便性: ユーザーは新しいパスワードやアカウントを作成する必要はありません。
2. セキュリティ: ユーザーが自分の認証情報をアプリと直接共有することはありません。
3. 標準化: OAuth は、Google、Facebook、Twitter などのプラットフォームで広くサポートされています。

OAuth と Google および Facebook の統合

OAuth を Google または Facebook と統合するには、次の手順に従ってください:

ステップ 1: Google または Facebook でアプリを作成する

• Googleの場合は、Google デベロッパー コンソールに移動してプロジェクトを作成します。
• Facebookの場合は、Facebook デベロッパー ポータルにアクセスして、新しいアプリをセットアップします。

ステップ 2: クライアント ID とクライアント シークレットを取得する

Google または Facebook から クライアント ID と クライアント シークレットを受け取ります。これらはアプリケーションを識別し、認可するために使用されます。

ステップ 3: アプリで OAuth を設定する

Node.js と Passport.js を使用して Google 認証を実装する例を次に示します:

const passport = require('passport');
const GoogleStrategy = require('passport-google-oauth20').Strategy;

passport.use(new GoogleStrategy({
    clientID: process.env.GOOGLE_CLIENT_ID,
    clientSecret: process.env.GOOGLE_CLIENT_SECRET,
    callbackURL: '/auth/google/callback'
  },
  function(token, tokenSecret, profile, done) {
    // Save the user info from the profile
    return done(null, profile);
  }
));

// Routes for authentication
app.get('/auth/google', passport.authenticate('google', { scope: ['profile', 'email'] }));

app.get('/auth/google/callback', 
  passport.authenticate('google', { failureRedirect: '/' }),
  function(req, res) {
    // Successful authentication
    res.redirect('/dashboard');
  });

この例では:

1. ユーザーが「Google でログイン」をクリックします。
2. ユーザーは認証のために Google にリダイレクトされます。
3. ログインに成功すると、Google は アクセス トークンを使用してユーザーをアプリにリダイレクトします。

認証の保護

認証を実装する場合、セキュリティは非常に重要です。認証システムを保護するためのベスト プラクティスをいくつか示します:

1. HTTPS を使用する

クライアントとサーバー間で送信されるデータを暗号化するには、常に HTTPS を使用します。これにより、攻撃者による機密情報の傍受が防止されます。

2. トークンの有効期限を実装

トークン (特に JWT) には、トークンの再利用のリスクを軽減するために有効期限を設ける必要があります。たとえば、JWT の有効期限が 15 分になるように設定し、リフレッシュ トークンを使用して新しいトークンを生成できます。

3. トークンを安全に保存

Web アプリの場合は、ローカル ストレージではなく httpOnly Cookie にトークンを保存します。これにより、JavaScript ベースの攻撃 (XSS など) によるトークンへのアクセスが防止されます。

4. トークンをローテーション

トークンの漏洩による被害を最小限に抑えるために、トークンを定期的にローテーションして無効にします。

5. 強力なクライアント シークレットを使用する

クライアント ID と クライアント シークレットが強力であり、決して一般公開されないようにしてください。環境変数を使用して安全に保存します。

結論

認証はあらゆる Web アプリケーションの基本的な側面であり、これを処理するにはさまざまな方法があります。 JWT はステートレスでスケーラブルなアプローチを提供し、OAuth は Google や Facebook などのサードパーティ サービスとのシームレスな統合を提供します。

セキュリティのベスト プラクティスに従うことで、認証システムが使いやすいだけでなく安全であることを保証できます。