nodejsログインページジャンプページジャンプページジャンプ-フロントエンドQ&A-php.cn

nodejsログインページジャンプページジャンプページジャンプ

WBOY

リリース： 2023-05-27 21:00:53

オリジナル

1722 人が閲覧しました

インターネット技術の急速な発展に伴い、Web サイトやアプリケーションのユーザー数も増加しています。アプリケーションをより適切に管理および保守するために、多くの開発者はバックエンドテクノロジとして Node.js を使用することを選択します。 Node.js では、ログインページはアプリケーションの重要な部分の 1 つです。この記事では、Node.js を使用してログインページとページジャンプを実装する方法を説明します。

1. ログインページの作成
Node.js では、HTTP モジュールと Express フレームワークを通じてログインページを簡単に作成できます。まず、Express モジュールをプロジェクトのルートディレクトリにインストールする必要があります。

npm install express --save

ログイン後にコピー

index.js という名前のファイルを作成し、その中に Express モジュールを導入します。これを元にExpressインスタンスを作成し、ポート番号を指定します。

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

app.listen(3000, () => {
  console.log('应用已启动，端口号为3000');
});

ログイン後にコピー

次に、ログインリクエストを処理し、ログインページを表示するルートを作成する必要があります。

app.get('/', (req, res) => {
  res.send(`
    <h1>登录页面</h1>
    <form method="POST" action="/login">
      <input type="text" placeholder="用户名" /><br />
      <input type="password" placeholder="密码" /><br />
      <button type="submit">登录</button>
    </form>
  `);
});

app.post('/login', (req, res) => {
  // 处理登录请求
});

ログイン後にコピー

上記のコードでは、app.get メソッドを使用して、ログインページを表示するためのルートルートを作成します。同時に、ログイン要求を処理するために app.post メソッドを使用して /login ルートが作成されます。

2. ログインリクエストの処理
前のセクションでは、ログインリクエストを処理するために /login ルートを作成しました。このルートでは、ユーザーがログインフォームに入力したユーザー名とパスワードを req オブジェクトを通じて取得し、検証できます。

たとえば、検証のために Node.js プログラムにユーザー名とパスワードをハードコーディングできます。コードは次のとおりです:

app.post('/login', (req, res) => {
  const {username, password} = req.body;

  if (username === 'admin' && password === '123456') {
    res.send('登录成功！');
  } else {
    res.send('用户名或密码不正确');
  }
});

ログイン後にコピー

上記のコードでは、req.body を使用します。ログインフォームのユーザー名とパスワードを取得します。次に、ユーザー名とパスワードに基づいて検証が行われ、検証に合格した場合はログイン成功のプロンプトメッセージが返され、そうでない場合はログイン失敗のプロンプトメッセージが返されます。

3. ページジャンプ
ログインに成功した後、通常、ユーザーは他のページにジャンプします。 Node.js では、res.redirect メソッドを使用してページジャンプを実装し、応答結果を他のルーティングアドレスにポイントすることができます。

app.post('/login', (req, res) => {
  const {username, password} = req.body;

  if (username === 'admin' && password === '123456') {
    res.redirect('/home');
  } else {
    res.send('用户名或密码不正确');
  }
});

app.get('/home', (req, res) => {
  res.send(`
    <h1>首页</h1>
    <p>欢迎访问首页</p>
  `);
});

ログイン後にコピー

上記のコードでは、ログインに成功した後、res.redirect を使用して応答結果を /home ルート (ホームページ) にポイントします。 /home ルートでは、ホームページのコンテンツをユーザーに表示できます。

4. Session を使用してユーザー認証を実装する
Node.js アプリケーションでは、通常、Session を使用してユーザー認証を実装します。ログインに成功すると、ユーザー情報はセッションに保存され、他のページにアクセスするときにセッションの内容を確認する必要があります。

具体的な実装手順は次のとおりです:

1. Express-session モジュールをプロジェクトのルートディレクトリにインストールします。

npm install express-session --save

ログイン後にコピー

2. Express-session モジュールを使用して、セッション関連のパラメーターを設定します。

const session = require('express-session');

app.use(session({
  secret: 'keyboard cat',
  resave: false,
  saveUninitialized: true,
  cookie: { secure: false }
}));

ログイン後にコピー

上記のコードでは、app.use メソッドを使用して、express-session ミドルウェアを使用して、セッションシークレットパラメーター、再保存パラメーター、saveUninitialized パラメーター、および Cookie パラメーターを設定します。

3. ログインに成功したら、ユーザー情報をセッションに保存します。

app.post('/login', (req, res) => {
  const {username, password} = req.body;

  if (username === 'admin' && password === '123456') {
    req.session.user = {username};
    res.redirect('/home');
  } else {
    res.send('用户名或密码不正确');
  }
});

ログイン後にコピー

上記のコードでは、req.session.user を使用して、現在ログインしているユーザーの情報をセッションに保存します。

4. 他のページにアクセスするときにセッション認証を実行します。

app.get('/home', (req, res) => {
  if (req.session.user) {
    res.send(`
      <h1>首页</h1>
      <p>欢迎访问首页，${req.session.user.username}</p>
    `);
  } else {
    res.redirect('/');
  }
});

ログイン後にコピー

上記のコードでは、まず if ステートメントを使用して、セッションにユーザー情報が存在するかどうかを判断します。存在する場合は、ホームページのコンテンツを表示し、現在ログインしているユーザーのユーザー名をユーザーに表示します。存在しない場合は、ログインページにリダイレクトします。

概要
Node.js では、ログインページとページジャンプの作成がアプリケーション開発の重要な側面です。この記事の導入を通じて、Node.js と Express フレームワークを使用してログインページを作成し、ログインリクエストとページジャンプを処理する方法を学びました。さらに、Session を使用してユーザー認証を実装する方法も学びました。実際のアプリケーションでは、開発者はユーザーのニーズを満たすために、特定のアプリケーションシナリオに従って対応する調整と最適化を行う必要があります。

以上がnodejsログインページジャンプページジャンプページジャンプの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。