検索
ホームページウェブフロントエンドjsチュートリアルノードのクッキーとは何ですか?使い方?

ノードのクッキーとは何ですか?使い方?

Sep 13, 2018 pm 04:25 PM
cookieexpressjavascriptnode.js

この記事の内容は、nodeのCookieとは何ですか?使い方?困っている友人は参考にしていただければ幸いです。

http はステートレス プロトコルであることはわかっています。ステートレスとはどういう意味ですか? http是无状态的协议,无状态是什么意思呢?
我来举一个小例子来说明:比如小明在网上购物,他浏览了多个页面,购买了一些物品,这些请求在多次连接中完成,如果不借助额外的手段,那么服务器是不知道他到底购买了什么的,因为服务器压根就不知道每次请求的到底是不是小明,除非小明有一个标识来证明他是小明。

所以,网站为了辨别用户身份,进行 session 跟踪,cookie出现了。

cookie是什么

简单来说,cookie就是标识。
严格来说,cookie是一些存储在客户端的信息,每次连接的时候由浏览器向服务器递交,服务器也向浏览器发起存储 Cookie 的请求,依靠这样的手段,服务器可以识别客户端。
具体来说,浏览器首次向服务器发起请求时,服务器会生成一个唯一标识符并发送给客户端浏览器,浏览器将这个唯一标识符存储在  Cookie  中,之后每次发起的请求中,客户端浏览器都会向服务器传送这个唯一标识符,服务器通过这个唯一标识符来识别用户。

说了这么多,打开浏览器,我们先来看看这货吧。

ノードのクッキーとは何ですか?使い方?

上图中,就是浏览器中存的一个cookie,他的名字叫name,值为abc。

常规cookie

光看不过瘾,接下来,用node动手来做一个常规cookie吧。
首先,安装express框架和cookieParser中间件

npm i express --save
npm install cookie-parser --save

cookieParser中间件的主要用途如下:

  1. 解析来自浏览器的cookie,放到req.cookies中;

  2. 针对签名cookie,对cookie签名和解签

代码如下:

var express = require('express');
var cookieParser = require('cookie-parser');

var app = express();
app.use(cookieParser());

app.use(function (req, res) {
  if (req.url === '/favicon.ico') {
    return
  }

  // 设置常规cookie, 有效期为20s, 客户端脚本不能访问它的值
  res.cookie('name', 'abc', { signed: false, maxAge: 20 * 1000, httpOnly: true });
  console.log(req.cookies, req.url, req.signedCookies);

  res.end('hello cookie');
})

app.listen(4000)

运行后,在浏览器中打开 http://localhost:4000/
以chrome为例,f12打开浏览器调试工具,在application中的cookies中便能发现你定义的cookie。
req.cookies和req.signedCookies属性是随http请求发送过来的请求头中的Cookie的解析结果。
其中,req.cookies对应的是普通cookie,req.signedCookies对应的是签名cookie。
如果请求中没有cookie,这两个对象都是空的。

签名cookie

签名cookie更适合敏感数据,因为用它可以验证cookie数据的完整性,有助于防止中间人攻击。
有效的签名cookie放在req.signedCookies对象中。

代码如下:

var express = require('express');
var cookieParser = require('cookie-parser');

var app = express();

// 设置密钥,用来对cookie签名和解签, Express可以由此确定cookie的内容是否被篡改过
app.use(cookieParser('a cool secret'));

app.use(function (req, res) {
  if (req.url === '/favicon.ico') {
    return
  }

  // 设置签名cookie, 并且有效期为1min
  res.cookie('name', 'efg', { signed: true, maxAge: 60 * 1000, httpOnly: true });
  console.log(req.cookies, req.url, req.signedCookies);

  res.end('signed cookie');
})
app.listen(4000)

运行后,在浏览器中打开 http://localhost:4000/
以chrome为例,f12打开浏览器调试工具,在application中的cookies中便能发现你定义的签名cookie,格式如下:s%3Aefg.7FJDuO2E9LMyby6%2Bo1fGQ3wkIHGB9v1CDVWod8NQVAo
.号左边是cookie的值,右边是服务器上用SHA-1 HMAC生成的加密哈希值。
如果这个签名cookie的值被篡改,那么服务器上对cookie的解签会失败,在node中输出的req.signedCookies将为false。如下:

ノードのクッキーとは何ですか?使い方?

而如果cookie完好无损地传上来,那么将会被正确解析:

ノードのクッキーとは何ですか?使い方?

总结

你可以在cookie中存放任意类型的文本数据,但通常是在客户端存放一个会话cookie 小さな例を挙げて説明します。たとえば、Xiao Ming はオンラインでショッピングをしています。これらのリクエストは複数の接続で完了します。追加の手段が使用されない場合、サーバーは彼を認識しません。正確には何を購入しましたか。シャオ ミンがシャオ ミンであることを証明する ID を持っていない限り、サーバーは毎回リクエストしている人がシャオ ミンであるかどうかを知りません。

そこで、ユーザーの身元を特定し、セッション追跡を実行するために、Cookieが登場しました。

Cookie とは何ですか? 簡単に言うと、Cookie は識別子です。 厳密に言えば、Cookie は client に保存される情報であり、接続が確立されるたびに、ブラウザはその情報をサーバーに送信し、サーバーもブラウザに対して Cookie を保存するリクエストを開始します。このようにして、サーバーはクライアントを識別できます。 具体的には、ブラウザが初めてサーバーへのリクエストを開始すると、サーバーは 一意の識別子 を生成し、それをクライアント ブラウザに送信します。ブラウザはこの一意の識別子を Cookie In に保存します。リクエストが開始されるたびに、クライアントのブラウザはこの一意の識別子をサーバーに送信し、サーバーはこの一意の識別子を使用してユーザーを識別します。

そうは言っても、ブラウザを開いて、まずこの製品を見てみましょう。

ノードのクッキーとは何ですか?使い方?

上の図では、名前は name で、値は abc です。 🎜🎜通常のクッキー🎜🎜 次は、nodeを使って通常のクッキーを作ってみましょう。 🎜まず、Express Framework と cookieParser ミドルウェアをインストールします 🎜rrreee🎜 cookieParser ミドルウェアの主な用途は次のとおりです: 🎜
  1. 🎜 ブラウザからの Cookie を解析し、req に配置します。 .cookies Medium; 🎜
  2. 🎜署名付き Cookie の場合、Cookie の署名と署名解除を行います🎜
🎜 コードは次のとおりです: 🎜rrreee🎜 実行後、http://localhost を開きます。ブラウザ: 4000/🎜 Chrome を例に挙げると、f12 でブラウザ デバッグ ツールを開くと、アプリケーション内の Cookie の中に定義した Cookie を見つけることができます。 🎜 req.cookies 属性と req.signedCookies 属性は、http リクエストで送信されたリクエスト ヘッダー内の Cookie の解析結果です。 🎜このうち、req.cookiesは通常のCookieに相当し、req.signedCookiesは署名付きCookieに相当します。 🎜リクエストに Cookie がない場合、両方のオブジェクトは空になります。 🎜🎜署名付き Cookie🎜🎜署名付き Cookie は、Cookie データの整合性を検証し、中間者攻撃の防止に役立つため、機密データに適しています。 🎜有効な署名付き Cookie は req.signedCookies オブジェクトに配置されます。 🎜🎜コードは次のとおりです: 🎜rrreee🎜実行後、ブラウザで http://localhost:4000/ を開きます🎜Chrome を例として、f12 でブラウザ デバッグ ツールを開くと、定義した署名が見つかります。アプリケーション Cookie 内の Cookie の形式は次のとおりです: s%3Aefg.7FJDuO2E9LMyby6%2Bo1fGQ3wkIHGB9v1CDVWod8NQVAo🎜 数字の左側は Cookie の値、右側は SHA-1 HMAC によって生成された暗号化されたハッシュ値です。サーバー上で。 🎜この署名付き Cookie の値が改ざんされると、サーバー上の Cookie の復号化に失敗し、ノードの req.signedCookies 出力が false になります。以下のように: 🎜🎜ノードのクッキーとは何ですか?使い方?🎜🎜そして、Cookie がそのまま渡された場合、正しく解析されます:🎜🎜ノードのクッキーとは何ですか?使い方?🎜🎜 まとめ🎜🎜Cookie にはあらゆる種類のテキスト データを保存できますが、通常は セッション Cookie がクライアント側に保存され、サーバー側で完全なユーザー状態を保持できます。 🎜🎜関連する推奨事項: 🎜🎜🎜jQuery、Angular、およびnodeのPromiseの詳細な説明🎜🎜🎜🎜🎜nodeでクラスターを使用する方法🎜🎜

以上がノードのクッキーとは何ですか?使い方?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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

JavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1)エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2)実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3)ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。

Python vs. JavaScript:学習曲線と使いやすさPython vs. JavaScript:学習曲線と使いやすさApr 16, 2025 am 12:12 AM

Pythonは、スムーズな学習曲線と簡潔な構文を備えた初心者により適しています。 JavaScriptは、急な学習曲線と柔軟な構文を備えたフロントエンド開発に適しています。 1。Python構文は直感的で、データサイエンスやバックエンド開発に適しています。 2。JavaScriptは柔軟で、フロントエンドおよびサーバー側のプログラミングで広く使用されています。

Python vs. JavaScript:コミュニティ、ライブラリ、リソースPython vs. JavaScript:コミュニティ、ライブラリ、リソースApr 15, 2025 am 12:16 AM

PythonとJavaScriptには、コミュニティ、ライブラリ、リソースの観点から、独自の利点と短所があります。 1)Pythonコミュニティはフレンドリーで初心者に適していますが、フロントエンドの開発リソースはJavaScriptほど豊富ではありません。 2)Pythonはデータサイエンスおよび機械学習ライブラリで強力ですが、JavaScriptはフロントエンド開発ライブラリとフレームワークで優れています。 3)どちらも豊富な学習リソースを持っていますが、Pythonは公式文書から始めるのに適していますが、JavaScriptはMDNWebDocsにより優れています。選択は、プロジェクトのニーズと個人的な関心に基づいている必要があります。

C/CからJavaScriptへ:すべてがどのように機能するかC/CからJavaScriptへ:すべてがどのように機能するかApr 14, 2025 am 12:05 AM

C/CからJavaScriptへのシフトには、動的なタイピング、ゴミ収集、非同期プログラミングへの適応が必要です。 1)C/Cは、手動メモリ管理を必要とする静的に型付けられた言語であり、JavaScriptは動的に型付けされ、ごみ収集が自動的に処理されます。 2)C/Cはマシンコードにコンパイルする必要がありますが、JavaScriptは解釈言語です。 3)JavaScriptは、閉鎖、プロトタイプチェーン、約束などの概念を導入します。これにより、柔軟性と非同期プログラミング機能が向上します。

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

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

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

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

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

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

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

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

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

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

ホットツール

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

VSCode Windows 64 ビットのダウンロード

VSCode Windows 64 ビットのダウンロード

Microsoft によって発売された無料で強力な IDE エディター