Nodejs の get/post リクエストとミドルウェアについて話しましょう-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

Nodejs の get/post リクエストとミドルウェアについて話しましょう

青灯夜游

Dec 08, 2021 pm 07:01 PM

nodejsミドルウェア

この記事では、node.js のホットリスタート、リクエストの取得、リクエストのポスト、ミドルウェアについて説明します。皆様のお役に立てれば幸いです。

Nodejs の get/post リクエストとミドルウェアについて話しましょう

#1. ノードのホットリスタート

1. インストール

npm i nodemon

nodemon .bin/www

# 2 を実行して開始します。 . get リクエストについて

通常、Web サイト開発では、get はデータベースのクエリ操作と同様に、データの取得とクエリに使用されます。サーバーがフォアグラウンドリソースを解析すると、対応するコンテンツが送信されます。これは URL に対して次の形式で実行されます:

##http://localhost:8080/login?goods1=0001&goods2=0002

#フロントエンドの get リクエストを取得するユーザーが送信した get リクエストは req.query を通じて取得でき、対応するデータは、ノード

操作。

応答が次の場合:

http://localhost:8080/login?goods1=0001&goods2=0002

を渡します:
req.query

彼はすべてのデータを取得するか、各データを分離または削除します。つまり、さまざまなビジネスにはさまざまなニーズが対応しており、誰もが自分のニーズに応じてそれを入手できます;

例

次は取得方法の例パラメータの概要: HTML:

req.query.goods1
req.query.goods2

node:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <form action="http://localhost:8080/login" method="get">
            用户：
            <input type="text" name="user" id="user" placeholder="用户名"/>
            <br>
            密码：
            <input type="password" name="password" id="password" placeholder="密码"/>
            <br>
            <input type="submit" value="提交"/>
        </form>
    </body>
</html>

3. POST リクエストについて

post メソッド (http) リクエストは重要な部分であり、ほとんどすべての Web サイトで使用されます。get リクエストとは異なり、post リクエストはサーバー上の変更操作に似ています。通常、データリソースの更新に使用されます。 get リクエストと比較して、post でリクエストされたデータはより安全です。前の章では、get リクエストでは入力されたユーザー名とパスワードがアドレスバーに表示され (中国語がある場合は BASE64 暗号化に変換されます)、post リクエストではデータが http パッケージの本体に入れられることがわかりました。これにより、他の人がユーザー名とパスワードを直接確認することができなくなります。

Express はどのように POST リクエストを設定しますか?

1. まず、フォームで POST リクエストを作成する方法を知る必要があります。 enctype 属性通常は「

application/x-www-form-urlencoded

」に設定されます。multipart/form-data に設定された場合、主にファイルに使用されます。次のようにアップロードします: <pre class='brush:php;toolbar:false;'>const express = require("express"); var app = express(); app.get("/",function(req,res){ res.send("主页"); }); app.get("/login",function(req,res){ console.log(req.query); res.send("登录路由，user为："+req.query.user+"==> password为："+req.query.password); }); app.listen(8080);</pre>2. 解析本文ミドルウェアを設定します <pre class='brush:php;toolbar:false;'><form action="#" method="post" enctype="application/x-www-form-urlencoded"> </form></pre>3. 本文データを取得します

app.use(express.urlencoded())

ログインケース:

HTML:req.body.username
APP.JS

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <h1 id="登陆">登陆</h1>
    <form action="/login" method="POST">
        <div>
            用户名：<input type="text" name="username">
        </div>
        <div>
            密码：<input type="password" name="password">
        </div>
        <button>登陆</button>
    </form>
      
</body>
</html>

4. Middleware

文字通りの意味から、おそらくこれは中間プロキシ操作、これも当てはまります。ほとんどの場合、ミドルウェアはリクエストの受信と応答の送信の間に一連の操作を実行します。実際、Express はルーティングおよびミドルウェア用の Web フレームワークであり、Express アプリケーションは基本的に一連のミドルウェア関数呼び出しです。 1.ブラウザがリクエストを送信

2.expressがリクエストを受け入れる

中間処理プロセス

3.ルーティング関数がレンダリングを処理(req, res)

4.res.render レンダリング

ミドルウェア関数は次のタスクを実行できます:

任意のコードを実行します。

リクエストオブジェクトとレスポンスオブジェクトを変更します。

リクエスト/レスポンスサイクルを終了します。
スタック内の次のミドルウェア関数を呼び出します。
ミドルウェアは、アプリケーション層ミドルウェア、ルーティングミドルウェア、組み込みミドルウェア、エラー処理ミドルウェア、サードパーティミドルウェアにも分類されます。

1. アプリケーション層ミドルウェア

アプリケーションレベルの中間キーは、app を使用してアプリオブジェクトにバインドされます。 use および app.METHOD() - GET、PUT、POST などの http リクエストを処理する必要があるメソッドは、前の get または post を use に置き換えるだけです。たとえば、次の例: var express = require('express'); var path = require('path') var app = express(); var sqlQuery = require('./lcMysql') // view engine setup app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'ejs'); app.use(express.static(path.join(__dirname, 'public'))); //解析post提交的数据 app.use(express.urlencoded()) //搜索首页 app.get('/',(req,res)=>{ res.render('index.ejs') }) //登陆页 app.get('/login',(req,res)=>{ res.render('login') }) //处理登陆请求 app.post('/login',async (req,res)=>{ //获取用户名和密码 let username = req.body.username let password = req.body.password //查询数据库是否由此用户名和密码 let sqlStr = 'select * from user where username = ? and password = ?'; let arr = [username,password]; let result = await sqlQuery(sqlStr,arr) if(result.length == 0 ){ res.send("登陆失败") }else{ res.send("登陆成功") } }) module.exports = app;
この時点で、

http://localhost:8080/

アドレスが読み込まれていることがわかりますが、コマンドラインには「アクセス前」と表示されます。 , プログラムが同期的に実行されないことを示します。next を使用してルートを下方向に突き合わせ続けると、ホームページデータを再度取得できます:

const express=require("express");

var app=express();

//匹配路由之前的操作
app.use(function(req,res,next()){
    console.log("访问之前");
});

app.get("/",function(req,res){
    res.send("主页");
});

app.listen(8080);

もちろん、記述を簡略化することもできます:

const express=require("express");

var app=express();

//匹配路由之前的操作
app.use(function(req,res,next){
    console.log("访问之前");
    next();
});

app.get("/",function(req,res){
    res.send("主页");
});

app.listen(8080);

したがって、ルートマッチングを行う場合、記録の前後で操作を実行し、実行を継続したい場合は、間違いなくアプリケーション層ミドルウェアが良い選択です。

2.路由中间件

路由级中间件和应用级中间件类似，只不过他需要绑定express.Router();

var router = express.Router()

在匹配路由时，我们使用 router.use() 或 router.VERB() ,路由中间件结合多次callback可用于用户登录及用户状态检测。

const express = require("express");
var app = express();
var router=express.Router();

router.use("/",function(req,res,next){
    console.log("匹配前");
    next();
});

router.use("/user",function(req,res,next){
    console.log("匹配地址：",req.originalUrl);
    next();
},function(req,res){
    res.send("用户登录");
});

app.use("/",router);

app.listen(8080);

总之在检测用户登录和引导用户应该访问哪个页面是，路由中间件绝对好用。

3.错误处理中间件

顾名思义，它是指当我们匹配不到路由时所执行的操作。错误处理中间件和其他中间件基本一样，只不过其需要开发者提供4个自变量参数。

app.use((err, req, res, next) => {
        res.sendStatus(err.httpStatusCode).json(err);
});

一般情况下，我们把错误处理放在最下面，这样我们即可对错误进行集中处理。

const express=require("express");

var app=express();

app.get("/",function(req,res,next){
    const err=new Error(&#39;Not Found&#39;);
    res.send("主页");
    next(err);
});

app.use("/user",function(err,req,res,next){
    console.log("用户登录");
    next(err);
},function(req,res,next){
    res.send("用户登录");
    next();
});

app.use(function(req,res){
    res.status(404).send("未找到指定页面");
});

app.listen(8080);

4.内置中间件

从版本4.x开始，Express不再依赖Content，也就是说Express以前的内置中间件作为单独模块，express.static是Express的唯一内置中间件。

express.static(root, [options]);

通过express.static我们可以指定要加载的静态资源。

5.第三方中间件

形如之前我们的body-parser，采用引入外部模块的方式来获得更多的应用操作。如后期的cookie和session。

var express = require(&#39;express&#39;);
var app = express();
var cookieParser = require(&#39;cookie-parser&#39;);

以上就是关于express中间件类型，在实际项目中，中间件都是必不可少的，因此熟悉使用各种中间件会加快项目的开发效率。

更多node相关知识，请访问：nodejs 教程！！

以上がNodejs の get/post リクエストとミドルウェアについて話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明

この記事は掘金社区で複製されています。侵害がある場合は、admin@php.cn までご連絡ください。

JavaScriptエンジン：実装の比較Apr 13, 2025 am 12:05 AM

さまざまなJavaScriptエンジンは、各エンジンの実装原則と最適化戦略が異なるため、JavaScriptコードを解析および実行するときに異なる効果をもたらします。 1。語彙分析：ソースコードを語彙ユニットに変換します。 2。文法分析：抽象的な構文ツリーを生成します。 3。最適化とコンパイル：JITコンパイラを介してマシンコードを生成します。 4。実行：マシンコードを実行します。 V8エンジンはインスタントコンピレーションと非表示クラスを通じて最適化され、Spidermonkeyはタイプ推論システムを使用して、同じコードで異なるパフォーマンスパフォーマンスをもたらします。

ブラウザを超えて：現実世界のJavaScriptApr 12, 2025 am 12:06 AM

現実世界におけるJavaScriptのアプリケーションには、サーバー側のプログラミング、モバイルアプリケーション開発、モノのインターネット制御が含まれます。 2。モバイルアプリケーションの開発は、ReactNativeを通じて実行され、クロスプラットフォームの展開をサポートします。 3.ハードウェアの相互作用に適したJohnny-Fiveライブラリを介したIoTデバイス制御に使用されます。

next.jsを使用してマルチテナントSaaSアプリケーションを構築する（バックエンド統合）Apr 11, 2025 am 08:23 AM

私はあなたの日常的な技術ツールを使用して機能的なマルチテナントSaaSアプリケーション（EDTECHアプリ）を作成しましたが、あなたは同じことをすることができます。まず、マルチテナントSaaSアプリケーションとは何ですか？マルチテナントSaaSアプリケーションを使用すると、Singの複数の顧客にサービスを提供できます

next.jsを使用してマルチテナントSaaSアプリケーションを構築する方法（フロントエンド統合）Apr 11, 2025 am 08:22 AM

この記事では、許可によって保護されたバックエンドとのフロントエンド統合を示し、next.jsを使用して機能的なedtech SaaSアプリケーションを構築します。 FrontEndはユーザーのアクセス許可を取得してUIの可視性を制御し、APIリクエストがロールベースに付着することを保証します

JavaScript：Web言語の汎用性の調査Apr 11, 2025 am 12:01 AM

JavaScriptは、現代のWeb開発のコア言語であり、その多様性と柔軟性に広く使用されています。 1）フロントエンド開発：DOM操作と最新のフレームワーク（React、Vue.JS、Angularなど）を通じて、動的なWebページとシングルページアプリケーションを構築します。 2）サーバー側の開発：node.jsは、非ブロッキングI/Oモデルを使用して、高い並行性とリアルタイムアプリケーションを処理します。 3）モバイルおよびデスクトップアプリケーション開発：クロスプラットフォーム開発は、反応および電子を通じて実現され、開発効率を向上させます。

JavaScriptの進化：現在の傾向と将来の見通しApr 10, 2025 am 09:33 AM

JavaScriptの最新トレンドには、TypeScriptの台頭、最新のフレームワークとライブラリの人気、WebAssemblyの適用が含まれます。将来の見通しは、より強力なタイプシステム、サーバー側のJavaScriptの開発、人工知能と機械学習の拡大、およびIoTおよびEDGEコンピューティングの可能性をカバーしています。

javascriptの分解：それが何をするのか、なぜそれが重要なのかApr 09, 2025 am 12:07 AM

JavaScriptは現代のWeb開発の基礎であり、その主な機能には、イベント駆動型のプログラミング、動的コンテンツ生成、非同期プログラミングが含まれます。 1）イベント駆動型プログラミングにより、Webページはユーザー操作に応じて動的に変更できます。 2）動的コンテンツ生成により、条件に応じてページコンテンツを調整できます。 3）非同期プログラミングにより、ユーザーインターフェイスがブロックされないようにします。 JavaScriptは、Webインタラクション、シングルページアプリケーション、サーバー側の開発で広く使用されており、ユーザーエクスペリエンスとクロスプラットフォーム開発の柔軟性を大幅に改善しています。

pythonまたはjavascriptの方がいいですか？Apr 06, 2025 am 12:14 AM

Pythonはデータサイエンスや機械学習により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、簡潔な構文とリッチライブラリエコシステムで知られており、データ分析とWeb開発に適しています。 2。JavaScriptは、フロントエンド開発の中核です。 node.jsはサーバー側のプログラミングをサポートしており、フルスタック開発に適しています。

See all articles

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

MantisBT

Mantis は、製品の欠陥追跡を支援するために設計された、導入が簡単な Web ベースの欠陥追跡ツールです。 PHP、MySQL、Web サーバーが必要です。デモおよびホスティングサービスをチェックしてください。

メモ帳++7.3.1

使いやすく無料のコードエディター

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポートライブラリとヘッダーファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。