ホームページ >ウェブフロントエンド >フロントエンドQ&A >Node.jsアプリケーションでログインページジャンプを実装する方法

Node.jsアプリケーションでログインページジャンプを実装する方法

PHPz
PHPzオリジナル
2023-04-05 13:47:51861ブラウズ

Node.js (略して Node) は、V8 エンジンに基づく JavaScript ランタイム環境であり、サーバー側で JavaScript を実行できるようになります。 Web 開発に Node.js を使用すると、軽量、効率的、スケーラブルであるという利点があります。

この記事では、Node.js アプリケーションにログインページジャンプを実装する方法を紹介します。

  1. ログイン ページ HTML ファイルの作成

まず、ログイン ページ HTML ファイルを作成する必要があります。これには、ユーザーがユーザー名とパスワードを入力するためのフォームが含まれている必要があります。フォームを送信するための送信ボタン。 HTML コードは次のとおりです。

nbsp;html>


    <meta>
    <title>Login</title>


    <h1>Login</h1>
    
        
                                  
        
                                  
             

フォームでは、methodpost として定義します。これは、## で POST メソッドを使用してフォーム データを送信することを意味します。 #action ログインアドレス /login を指定します。

    Node.js アプリケーションのログイン処理ロジックを完了する
ユーザーがフォームを送信すると、Node.js アプリケーションは POST リクエストを受信し、ユーザー名を処理します。およびユーザーが入力したパスワード。この例では、ユーザー名とパスワードをサーバー側の変数に直接保存する簡単な方法を使用し、ログインが成功したことを確認した後にホームページにジャンプします (この例では、

/home を次のように使用します)ホームページのアドレス)。

コードは次のように実装されます (Express フレームワークを使用):

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

// 定义用户名和密码
const username = 'admin';
const password = '123456';

// 处理登录请求
app.post('/login', function (req, res) {
    const { username: inputUsername, password: inputPassword } = req.body;
    if (inputUsername === username && inputPassword === password) {
        res.redirect('/home');
    } else {
        res.send('Invalid username or password');
    }
});

// Node.jsアプリケーションでログインページジャンプを実装する方法
app.get('/home', function (req, res) {
    res.send('Welcome to the home page');
});

// 启动服务
app.listen(3000, function () {
    console.log('Server started on port 3000');
});
上記のコードでは、

body-parser ミドルウェアを使用して、送信された JSON を解析します。クライアントの POST リクエスト データを取得し、ユーザー名とパスワードを inputUsernameinputPassword に保存します。次に、それをプリセットの username および password と比較し、一致した場合は、res.redirect を使用してホームページ /home にジャンプします。 、そうでない場合は、エラー メッセージが送信されます。

/home ルートでウェルカム メッセージを送信しただけであることに注意してください。実際の開発では、ページをレンダリングして表示するための適切なビュー テンプレートを指定する必要があります。

    アプリケーションの実行
次に、Node.js アプリケーションを起動し、ブラウザーでログイン ページにアクセスします

http://localhost:3000 、以下に示すように、ログイン フォームが表示されます (プロジェクトに例外がない場合):

Node.jsアプリケーションでログインページジャンプを実装する方法

正しいユーザー名とパスワードを入力し、[ログイン] をクリックします。 " ボタンをクリックすると、ページがジャンプします。次に示すように、ホームページ

/home に移動します。

Node.jsアプリケーションでログインページジャンプを実装する方法

これまで、ログイン ページを実装しました。 Node.js アプリケーションのジャンプ関数 コードをさらに改良して、より多くのログイン方法とユーザー検証方法をサポートすることもできます。

以上がNode.jsアプリケーションでログインページジャンプを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。