OAuth 2.0とOpenID Connectの紹介

OAuth 2.0は、ユーザーの資格情報を公開せずに、サードパーティアプリケーションがユーザーを代表して限定的なリソースにアクセスできるようにする認可フレームワークです。OpenID Connectは、OAuth 2.0の上に構築されたアイデンティティレイヤーで、認証機能を提供します。両方を組み合わせることで、ユーザーを安全に認証し、保護されたリソースへのアクセスを許可することができます。

この記事では、Node.js ExpressアプリケーションでOAuth 2.0とOpenID Connectを実装する方法を説明します。認証用の人気のあるミドルウェアであるPassport.jsを使用して、プロセスを簡素化します。

前提条件

始める前に、以下がマシンにインストールされていることを確認してください。

• Node.js（v14以上）
• npm（v6以上）
• コードエディタ（Visual Studio Codeなど）

Node.js Expressアプリケーションのセットアップ

まず、プロジェクト用の新しいディレクトリを作成し、ターミナルで移動します。次に、npmを使用してプロジェクトを初期化します。

mkdir oauth-openid-nodejs
cd oauth-openid-nodejs
npm init -y

依存関係のインストール

次に、必要なパッケージをインストールします。

npm install express passport passport-openidconnect dotenv

Expressサーバーの作成

プロジェクトのルートにindex.jsファイルを作成し、基本的なExpressサーバーを設定するためのコードを追加します。

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('OAuth 2.0とOpenID Connectデモへようこそ！');
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

Passport.jsでOpenID Connectを使う方法

Passport.jsの設定

まず、プロジェクトのルートに.envファイルを作成し、クライアントID、クライアントシークレット、コールバックURLを保存します。これらは、選択した認証プロバイダ（Google、Facebookなど）から提供されます。

CLIENT_ID=your_client_id
CLIENT_SECRET=your_client_secret
CALLBACK_URL=http://localhost:3000/auth/callback

次に、プロジェクトのルートにpassport-setup.jsファイルを作成し、Passport.jsをOpenID Connectストラテジーで設定するためのコードを追加します。

const passport = require('passport');
const OidcStrategy = require('passport-openidconnect').Strategy;
const dotenv = require('dotenv');

dotenv.config();

passport.use(
  new OidcStrategy(
    {
      issuer: 'https://your-auth-provider.com',
      clientID: process.env.CLIENT_ID,
      clientSecret: process.env.CLIENT_SECRET,
      callbackURL: process.env.CALLBACK_URL,
      scope: 'openid profile email'
    },
    (accessToken, refreshToken, profile, done) => {
      return done(null, profile);
    }
  )
);

passport.serializeUser((user, done) => {
  done(null, user);
});

passport.deserializeUser((user, done) => {
  done(null, user);
});

module.exports = passport;

選択した認証プロバイダーの適切な発行者URLでhttps://your-auth-provider.comを置き換えます。

Expressサーバーの更新

次に、index.jsファイルを更新して、Passport.jsとOpenID Connectの設定を含めます。

const express = require('express');
const passport = require('./passport-setup');
const session = require('express-session');
const app = express();

// Expressでセッションミドルウェアを使用するように設定
app.use(session({
  secret: 'your-session-secret',
  resave: false,
  saveUninitialized: true
}));

// Passport.jsとセッションサポートを初期化
app.use(passport.initialize());
app.use(passport.session());

app.get('/', (req, res) => {
  res.send('OAuth 2.0とOpenID Connectデモへようこそ！');
});

// OAuth 2.0認証のためのルートを追加
app.get('/auth', passport.authenticate('openidconnect'));

// OAuth 2.0コールバックのためのルートを追加
app.get('/auth/callback',
  passport.authenticate('openidconnect', { failureRedirect: '/login' }),
  (req, res) => {
    res.redirect('/profile');
  }
);

// ユーザープロファイルのためのルートを追加
app.get('/profile', (req, res) => {
  if (!req.user) {
    return res.redirect('/login');
  }
  res.send(`こんにちは、${req.user.displayName}さん！`);
});

// ログインページのためのルートを追加
app.get('/login', (req, res) => {
  res.send('<a href="/auth">アイデンティティプロバイダーでログイン</a>');
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server running on http://localhost:${PORT}`);
});

アプリケーションのテスト

これで、Node.js ExpressアプリケーションでOAuth 2.0とOpenID Connectを使用してテストする準備が整いました。サーバーを起動するには、次のコマンドを実行します。

node index.js

ブラウザでhttp://localhost:3000/loginにアクセスし、「アイデンティティプロバイダーでログイン」のリンクをクリックします。認証プロバイダーのログインページにリダイレクトされます。ログインした後、/profileルートにリダイレクトされ、表示名が含まれた個人的な挨拶が表示されます。

まとめ

この記事では、Passport.jsを使用してNode.js ExpressアプリケーションでOAuth 2.0とOpenID Connectを実装する方法を説明しました。この安全な認証方法により、ユーザーは資格情報をアプリケーションに公開せずに認証できるため、より安全で信頼性の高い認証プロセスが実現されます。

アプリケーションを本番環境にデプロイする際は、サンプルの設定情報（発行者URL、クライアントID、クライアントシークレットなど）を、実際の認証プロバイダーの情報に置き換えることを忘れないでください。

Mình hy vọng bạn thích bài viết này và học thêm được điều gì đó mới.

Donate mình một ly cafe hoặc 1 cây bút bi để mình có thêm động lực cho ra nhiều bài viết hay và chất lượng hơn trong tương lai nhé. À mà nếu bạn có bất kỳ câu hỏi nào thì đừng ngại comment hoặc liên hệ mình qua: Zalo - 0374226770 hoặc Facebook. Mình xin cảm ơn.

Momo: NGUYỄN ANH TUẤN - 0374226770

TPBank: NGUYỄN ANH TUẤN - 0374226770 (hoặc 01681423001)