上一节:
下一节:

  ExpressJS 提供静态文件

  • 提供静态文件

    静态文件是客户端从服务器直接下载的文件。创建一个新目录public
    Express，默认情况下不允许您提供静态文件。您需要使用以下内置中间件启用它。 
    
app.use(express.static('public'));
    注 – Express查找相对于静态目录的文件，因此静态目录的名称不是URL的一部分。
    请注意，现在根路由已设置为您的public目录，因此您加载的所有静态文件都将公共视为根。要测试它是否工作正常，请在新的public目录中添加任何图像文件，并将其名称更改为“testimage.jpg ”。在您的视图中，创建一个新视图并包括以下文件： 
    
html
   head
   body
      h3 Testing static file serving:
      div(style="background:#00cc00;")
        img(src = "/logo.png", alt = "Testing Image" style = "-webkit-filter: grayscale(50%);filter: grayscale(50%);")
    您应该获得以下输出-

  • 多个静态目录

    我们还可以使用以下程序设置多个静态资源目录- 
    
var express = require('express');
var app = express();

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

app.listen(3000);

  • 虚拟路径前缀

    我们还可以提供用于提供静态文件的路径前缀。例如，如果要提供像'/static'这样的路径前缀，则需要在index.js文件中包括以下代码- 
    
var express = require('express');
var app = express();

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

app.listen(3000);
    现在，每当您需要在public目录中包含文件（例如，名为main.js的脚本文件）时，请使用以下脚本标记- 
    
<script src = "/static/main.js" />
    当提供多个目录作为静态文件时，此技术会派上用场。这些前缀可以帮助区分多个目录。
上一节:
下一节: