Expressは静的リソースを処理します（コードデモンストレーション）

1.問題の説明

ブラウザは、サーバーから返されたHTMLコンテンツを受信すると、上から下への解析を開始します。解析プロセス中に、次のことが検出された場合。

リンク
脚本
img
iframe
ビデオ
オーディオ

srcまたはlinkが付いたhref属性タグが添付されると、ブラウザーはこれらの静的リソースに対する新しい要求を自動的に開始します。これらの新しいリクエストを処理する必要があります。

ネイティブノードコードを使用してこれらの静的リソースを処理するには、次のブログを参照してください。

しかし、それはもっと厄介です。Node inを学習する過程で、Expressフレームワーク（Node.jsプラットフォーム、高速、オープン、ミニマリストのWeb開発フレームワークに基づく）の学習に進むと思います。では、Expressでこれらの静的リソースをどのように処理するのでしょうか。

二、解決策

組み込みのミドルウェア機能で
ファイル構造
Expressを使用するプロジェクト構造express.static。この機能の特徴は次のとおりです。express.static(root, [options])

方法1：

//第一个参数是请求路径url，当请求路径以 /public/ 开头的时候，就会去 ./public/ 请求对应的资源，
//如 http://localhost:3000/public/img/1.jpg
app.use('/public',express.static('./public/'))

結果を図に示します。ここに写真の説明を挿入

方法2：

この効果を実現できます。サーバーから提供されたファイルの仮想パスプレフィックスを作成します（パスは実際にはファイルシステムに存在しません）。

//第一个参数是什么，请求路径中就要加上，如 http://localhost:3000/a/img/1.jpg，可以把 a 当做 public 的别名
app.use('/a',express.static('./public/'))

//这样也是可以的 http://localhost:3000/a/b/c/img/1.jpg
app.use('/a/b/c',express.static('./public/'))

方法3：

app.use()最初のパラメータで省略した場合、リクエストはパス/パブリック/プレフィックスまたは他のパスを追加する必要はありません。リソースパブリックフォルダを書き込むためのダイレクトパス。

// http://localhost:3000/img/1.jpg
app.use(express.static('./public/'));

もちろん、絶対パスも使用できます

// 提前导入 path 模块
app.use(express.static(path.join(__dirname, 'public')))

完全なコード：

let express = require('express');

let app = express();

app.get('/',function (req,res) {
    
    
  res.send('我是首页');
})

app.use(express.static('./public/'));

app.listen(3000,function () {
    
    
  console.log('服务器启动成功： http://localhost:3000');
})

3、まとめ

app.use()最初の引数でない場合、パブリックディレクトリパス内のリソースの直接使用
app.use()最初のパラメーターがある場合、要求されたリソースをプレフィックスとして最初に配置するときは、url内のパラメーターに追加されます

4、拡張読書

エクスプレスチャイニーズネットワーク

https://blog.csdn.net/weixin_43974265/category_10692693.html

この記事がお役に立てば、出発する前に気に入ってください（￣▽￣）〜*