ホームページ > 記事 > ウェブフロントエンド > Nodejs の get/post リクエストとミドルウェアについて話しましょう

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

青灯夜游転載: 2021-12-08 19:01:042122ブラウズ

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

#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:js;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:js;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>登陆</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 サイトの他の関連記事を参照してください。

node.js 中间件 html npm express Static Cookie Session 字符串循环栈堆 JS 对象数据库 http

声明：

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

前の記事：JavaScript で for を使用して n の階乗を求める方法次の記事：JavaScript で for を使用して n の階乗を求める方法

続きを見る

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

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

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

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

次は取得方法の例パラメータの概要: HTML:
req.query.goods1 req.query.goods2

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

HTML:req.body.username
APP.JS

2.路由中间件

3.错误处理中间件

4.内置中间件

5.第三方中间件

関連記事

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

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

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

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

次は取得方法の例 パラメータの概要: HTML:req.query.goods1 req.query.goods2

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

HTML:req.body.usernameAPP.JS

2.路由中间件

3.错误处理中间件

4.内置中间件

5.第三方中间件

関連記事

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

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

次は取得方法の例パラメータの概要: HTML:
req.query.goods1 req.query.goods2

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

HTML:req.body.username
APP.JS