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 相关文章推荐
给moz-firefox下添加IE方法和属性
Apr 10 Javascript
JavaScript 获取事件对象的注意点
Jul 29 Javascript
三种检测iPhone/iPad设备方向的方法
Apr 23 Javascript
jQuery中clone()方法用法实例
Jan 16 Javascript
jQuery实现图片左右滚动特效
Apr 20 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
Jul 18 Javascript
bootstrap+jQuery实现的动态进度条功能示例
May 25 jQuery
JS实现移动端按首字母检索城市列表附源码下载
Jul 05 Javascript
vue组件与复用详解
Apr 08 Javascript
React Native基础入门之初步使用Flexbox布局
Jul 02 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
Vue自定义全局弹窗组件操作
Aug 11 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获取金书网的书名的实现代码
2010/06/11 PHP
解决PHP mysql_query执行超时(Fatal error: Maximum execution time …)
2013/07/03 PHP
YII实现分页的方法
2014/07/09 PHP
PHP魔术引号所带来的安全问题分析
2014/07/15 PHP
PHP使用Redis替代文件存储Session的方法
2017/02/15 PHP
Laravel学习教程之request validation的编写
2017/10/25 PHP
php通过pecl方式安装扩展的实例讲解
2018/02/02 PHP
Laravel登录失败次数限制的实现方法
2020/08/26 PHP
关于图片按比例自适应缩放的js代码
2011/10/30 Javascript
ASP.NET jQuery 实例1(在TextBox里面创建一个默认提示)
2012/01/13 Javascript
JS去掉第一个字符和最后一个字符的实现代码
2014/02/20 Javascript
jquery检测input checked 控件是否被选中的方法
2014/03/26 Javascript
jquery使用ul模拟select实现表单美化的方法
2015/08/18 Javascript
JS实现的车标图片提示效果代码
2015/10/10 Javascript
JavaScript是如何实现继承的(六种方式)
2016/03/31 Javascript
详解如何较好的使用js
2016/12/16 Javascript
使用vue的v-for生成table并给table加上序号的实例代码
2017/10/27 Javascript
Vue实战之vue登录验证的实现代码
2017/10/31 Javascript
基于vue实现网站前台的权限管理(前后端分离实践)
2018/01/13 Javascript
vue插件实现v-model功能
2018/09/10 Javascript
vue路由插件之vue-route
2019/06/13 Javascript
Python、Javascript中的闭包比较
2015/02/04 Python
Python查询阿里巴巴关键字排名的方法
2015/07/08 Python
python虚拟环境virualenv的安装与使用
2016/12/18 Python
Python 错误和异常代码详解
2018/01/29 Python
pyqt5对用qt designer设计的窗体实现弹出子窗口的示例
2019/06/19 Python
Jupyter notebook如何实现指定浏览器打开
2020/05/13 Python
Python爬虫之Selenium设置元素等待的方法
2020/12/04 Python
PHP面试题集
2016/12/18 面试题
中学生差生评语
2014/01/30 职场文书
2015公务员年度考核评语
2015/03/25 职场文书
校园广播站开场白
2015/06/01 职场文书
太空授课观后感
2015/06/17 职场文书
2015暑期社会实践通讯稿
2015/07/18 职场文书
车间班组长竞聘书
2015/09/15 职场文书
python for循环赋值问题
2021/06/03 Python