Express之托管静态文件的方法


Posted in Javascript onJune 01, 2018

中间件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中必须带上这个目录才能访问的到。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery Lightbox 图片展示插件使用说明
Apr 25 Javascript
jQuery EasyUI API 中文文档 - ProgressBar 进度条
Sep 29 Javascript
JQuery的$和其它JS发生冲突的快速解决方法
Jan 24 Javascript
利用JS实现数字增长
Jul 28 Javascript
AngularJS开发教程之控制器之间的通信方法分析
Dec 25 Javascript
jQuery zTree树插件简单使用教程
Jan 10 Javascript
使用get方式提交表单在地址栏里面不显示提交信息
Feb 21 Javascript
微信小程序 本地图片按照屏幕尺寸处理
Aug 04 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
Apr 13 Javascript
对Vue table 动态表格td可编辑的方法详解
Aug 28 Javascript
python实现迭代法求方程组的根过程解析
Nov 25 Javascript
Javascript中的this,bind和that使用实例
Dec 05 Javascript
纯JS实现出生日期[年月日]下拉菜单效果
Jun 01 #Javascript
详解Angular操作cookies方法
Jun 01 #Javascript
浅谈手写node可读流之流动模式
Jun 01 #Javascript
JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
Jun 01 #Javascript
基于JS实现带动画效果的流程进度条
Jun 01 #Javascript
说说node中的可读流和可写流的区别
Jun 01 #Javascript
Angularjs之如何在跨域请求中传输Cookie的方法
Jun 01 #Javascript
You might like
php长字符串定义方法
2012/07/12 PHP
谈谈你对Zend SAPIs(Zend SAPI Internals)的理解
2015/11/10 PHP
Laravel中日期时间处理包Carbon的简单使用
2017/09/21 PHP
ImageFlow可鼠标控制图片滚动
2008/01/30 Javascript
Jquery ajax执行顺序 返回自定义错误信息(实例讲解)
2013/11/06 Javascript
JQuery $.each遍历JavaScript数组对象实例
2014/09/01 Javascript
百度地图自定义控件分享
2015/03/04 Javascript
JQuery显示隐藏DIV的方法及代码实例
2015/04/16 Javascript
全面介绍javascript实用技巧及单竖杠
2016/07/18 Javascript
javascript简单实现等比例缩小图片的方法
2016/07/27 Javascript
js实现滑动到页面底部自动加载更多功能
2017/02/15 Javascript
JS解析url查询参数的简单代码
2017/08/06 Javascript
javascript如何用递归写一个简单的树形结构示例
2017/09/06 Javascript
详解vue-cli下ESlint 配置说明
2018/09/03 Javascript
4个顶级JavaScript高级文本编辑器
2018/10/10 Javascript
vue项目环境变量配置的实现方法
2018/10/12 Javascript
巧妙运用v-model实现父子组件传值的方法示例
2019/04/07 Javascript
详解Vue中的watch和computed
2020/11/09 Javascript
[03:14]辉夜杯主赛事 12月25日每日之星
2015/12/26 DOTA
Python实现按特定格式对文件进行读写的方法示例
2017/11/30 Python
浅谈Python用QQ邮箱发送邮件时授权码的问题
2018/01/29 Python
Django读取Mysql数据并显示在前端的实例
2018/05/27 Python
pycharm远程开发项目的实现步骤
2019/01/20 Python
Python3实现汉语转换为汉语拼音
2019/07/08 Python
利用Python库Scapy解析pcap文件的方法
2019/07/23 Python
python统计字符的个数代码实例
2020/02/07 Python
Python爬取YY评级分数并保存数据实现过程解析
2020/06/01 Python
Django实现任意文件上传(最简单的方法)
2020/06/03 Python
使用CSS3来绘制一个月食图案
2015/07/18 HTML / CSS
阿迪达斯荷兰官方网站:adidas荷兰
2018/03/16 全球购物
Champion澳大利亚官网:美国冠军运动服装
2018/05/07 全球购物
澳大利亚波西米亚风连衣裙在线商店:Fortunate One
2019/04/01 全球购物
阿联酋最好的手机、电子产品和家用电器网上商店:Eros Digital Home
2020/08/09 全球购物
挂牌仪式主持词
2014/03/20 职场文书
国际贸易求职信
2014/07/05 职场文书
Python中的 No Module named ***问题及解决
2022/07/23 Python