Express之托管静态文件的方法

中间件express.static

我们使用express初始化一个目录的时候，会在app.js中看到一大推的app.use。

其中一个主要的中间件是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'));

访问:

http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/style.js
http://localhost:3000/static/img/style.png

注意:这里我们添加了虚拟目录，所以我们的url中必须带上这个目录才能访问的到。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解利用 Express 托管静态文件的方法

    通过 Express 内置的 express.static 可以方便地托管静态文件,例如图片.CSS.JavaScript 文件等. 将静态资源文件所在的目录作为参数传递给 express.static 中间件就可以提供静态资源文件的访问了.例如,假设在 public 目录放置了图片.CSS 和 JavaScript 文件,你就可以: app.use(express.static('public')); 现在,public 目录下面的文件就可以访问了. http://localhost:3000

  • Express之托管静态文件的方法

    中间件express.static 我们使用express初始化一个目录的时候,会在app.js中看到一大推的app.use. 其中一个主要的中间件是express.static(4.0版本依旧保留的中间件) var express = require('express'); var app = express(); app.use('/static',express.static('public')); 通过express.static可以帮助我们托管静态文件,js,css,img等. exp

  • Djang中静态文件配置方法

    Djang中静态文件配置方法

    下面通过图文并茂的方法给大家详细介绍下Djang中静态文件配置方法 一.django静态文件配置原理 静态文件配置就是为了让用户请求时django服务器能找到静态文件返回. 首先要理解几个概念: 媒体文件:用户上传的文件 静态文件:css,js,image等 开发环境:使用django内置服务器处理静态文件 生产环境:使用apache2/nginx服务器处理静态文件映射 所以在配置时要分清楚开发环境还是生产环境,这个后面会详细介绍. 下面先介绍一下服务器查找静态文件的原理,这样我们才能更好的配置

  • vue完成项目后,打包成静态文件的方法

    vue完成项目后,如何打包成静态文件,并且用Node调试 打包 1.修改config里面的index.js里面的productionSourceMap为false,默认情况是true(true代表打包环境是开发环境,可以进行调试:false表示生产环境,正式上线的) 2.在cmd里面运行npm run build,(运行的是build里面的build.js文件) 生成的包放在dist下面 使用node进行调试 1.在根目录下创建prod.server.js文件,这个文件的作用是作为一个小的htt

  • Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件的方法

    Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件的方法

    接着这篇文章Node.js+jade抓取博客所有文章生成静态html文件的实例继续,在这篇文章中实现了采集与静态文件的生成,在实际的采集项目中, 应该是先入库再选择性的生成静态文件. 那么我选择的数据库是mongodb,为什么用这个数据库,因为这个数据库是基于集合,数据的操作基本是json,与dom模块cheerio具有非常大的亲和力,cheerio处理过滤出来的数据,可以直接插入mongodb,不需要经过任何的处理,非常的便捷,当然跟node.js的亲和力那就不用说了,更重要的是,性能很棒.这

  • PHP中实现生成静态文件的方法缓解服务器压力

    互联网快速普及的现在社会,越来越多的人会在一个web应用上进行交流,因而导致服务器与数据库访问压力与日俱增,这边就需要进行一些优化,譬如增加缓存.二级缓存.动态网页静态化以及其他的高端技术. 此处作者是使用生成静态文件的方法: 复制代码 代码如下: /** * @desc 生成静态文件时使用 * @todo htmlcache * @param $root string html文件存放路径 * @param $rule string html文件命名规则 * @param $url strin

  • 详解Django模版中加载静态文件配置方法

    1.settings.INSTALLED_APPS下添加:django.contrib.staticfiles 2.settings.py下添加:STATIC_URL = '/static/' 3. (1)在APP下新建文件夹static,然后在这个static文件夹下创建一个当前APP的名字的文件夹,再把静态文件放到这个文件夹下:(类似于Templates配置) 在模板中这样调用: {% load static %} <img src="{% static 'front/logo.jpg

  • 浅析Python打包时包含静态文件处理方法

    使用场景 已搭建了PyPI私有库,上传公共库包含静态文件,如需要使用sql静态文件初始化数据库. 打包python包,给其他人使用,但项目中包含静态文件,如html. 解决步骤 解决静态文件读取问题 解决静态文件打包问题 环境 Python3.8 PyCharm 2020 demo项目为例 创建项目 展示静态文件读取问题 解决方案 展示静态文件打包问题 解决方案 1. 创建项目 创建一个demo项目(text-setup),目录如下 test-setup demo \_\_init\_\_.py

  • 在Express中提供静态文件的实现方法

    为了提供诸如图像.CSS 文件和 JavaScript 文件之类的静态文件,请使用 Express 中的 express.static 内置中间件函数. 将包含静态资源的目录的名称传递给 express.static 中间件函数,以便开始直接提供这些文件.例如,使用以下代码在名为 public 的目录中提供图像.CSS 文件和 JavaScript 文件: app.use(express.static('public')); 现在,可以访问位于 public 目录中的文件: http://loc

  • 禁止IIS缓存静态文件的方法(png,js,html等)

    禁止IIS缓存静态文件的方法(png,js,html等)

    禁止IIS缓存静态文件(png,js,html等)背景:IIS为了提高性能,默认情况下会对静态文件js,html,gif,png等做内部缓存,这个缓存是在服务器iis进程的内存中的.IIS这么做在很大程度上可以提高静态文件的访问性能,在正常情况下只要静态文件更新了IIS也会更新缓存.但是如果更新的静态文件很多就有可能出现缓存不更新的情况. 弯路:我遇到这样一个场景,服务器循环更新上万张股票行情图片,IIS也会对图片进行缓存,由于更新的频率很高,文件很多,就出现了IIS缓存文件超过几十分钟都无法更

随机推荐