ホームページ >ウェブフロントエンド >jsチュートリアル >Express で静的ファイルをホストする方法
今回は、Express を使用して静的ファイルをホストする方法と、Express を使用して静的ファイルをホストする際の 注意事項 を説明します。実際のケースを見てみましょう。
ミドルウェアexpress.static
expressを使用してディレクトリを初期化すると、app.jsで多くのapp.useが表示されます。 主要なミドルウェアの 1 つは、express.static (このミドルウェアはバージョン 4.0 にも残されています)var express = require('express'); var app = express(); app.use('/static',express.static('public'));Express.static は、静的ファイル、js、css、img などをホストするのに役立ちます。
express.staticは
を使用しますプロジェクトディレクトリのpublicの下にcss、js、imgなどのフォルダーがあります。 サーバーの起動時にデータにアクセスできるように、Express 経由でホストする必要があります。 app.js にvar express = require('express'); var app = express(); app.use(express.static('public'));を追加すると、 http://localhost:3000/css/style.css
http://localhost:3000/js/style.js
http://localhost を渡すことができます。 3000/img/style.png
注:すべてのファイルのパスは保存ディレクトリからの相対パスであるため、静的ファイルが保存されているディレクトリ名は URL に表示されません。
仮想ディレクトリ
は、静的リソースディレクトリのマウントパスを指定することで実装されます。 静的ファイルに仮想ディレクトリを追加できます。これにより、URL を統一した方法で管理しやすくなり、リソースのvar express = require('express'); var app = express(); app.use('static',express.static('public'));この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。 推奨読書:
vueを使用して空白をクリックしてdiv実装を非表示にする方法
以上がExpress で静的ファイルをホストする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。