express相信是很多人用nodejs搭建服务器的首选框架,相关教程有很多,也教会了大家来如何使用。如果你想更深的了解他的细节,不妨和我一起来研究一下。

先来看一个每个人都用到的方法app.use(express.static(__dirname+'/public'));

你肯定在你的app文件中这么用过它:

  app.use(express.static(__dirname + '/public'));//设置静态文件目录

正如注释中写的那样,这句话的意思是,将静态文件目录设置为项目根目录+/public,当然你也可能是这么写的:

app.use(express.static(path.join(__dirname, 'public')));//和上面是一样的

运用path模块的join方法效果和前面是等价的,注意这里要引入path模块。

你有没有产生过疑问,为什么这句话能够帮我们设置静态文件目录呢?他到底做了些什么呢?

为了照顾初学者,我们不妨先从最基本的静态资源文件说起,什么是静态资源文件呢?

静态资源文件通俗的可以理解成对于不同的用户来说,内容都不会变化的文件。比如不管是张三李四还是王五访问百度,他们所接收到的看到的图片、css文件和前端javascript文件都是一样的,我们称这类文件为静态资源文件。

那么响应的,对于不同用户做出不同反应的就是动态文件了,张三李四王五登录百度,百度会分别对他们显示"你好张三"、"你好李四"、"你好王五",那么负责这么动态逻辑的文件就是动态文件了,根据你是用的技术不同,动态文件可能是.jsp文件、php文件或者我们node.js的服务器端js文件。

那么app.use()方法又干了什么事情呢,我们先来看看官方API怎么说的:

大意是说,app.use是用来给path注册中间函数的,这个path默认是'/',也就是处理任何请求,同时要注意的是他会处理path下的子路径,比如如果设置path为'/hello',那么当请求路径为'/hello/','/hello/nihao','/hello/bye'这样的请求都会交给中间函数处理的。

于是我们现在知道了app.use(express.static(__dirname + '/public'))是将所有请求,先交给express.static(__dirname + '/public')来处理一下,虽然我们暂时不知道express.static()的处理细节,但是这不影响我们做出一些推测,最起码我们可以知道,express.static()的返回值肯定是一个函数。

官方文档十分详尽,像我们解释了express.static()的一些细节,我简单的翻译给大家:

Serving static files in Express

为了提供对静态资源文件(图片、csss文件、javascript文件)的服务,请使用Express内置的中间函数 express.static 。

传递一个包含静态资源的目录给 express.static 中间件用于立刻开始提供文件。比如用以下代码来提供public目录下的图片、css文件和javascript文件:

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

现在,你可以加载 public目录下的文件了:

http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html

Express 会在静态资源目录下查找文件,所以不需要把静态目录作为URL的一部分。

通过多次使用 express.static 中间件来添加多个静态资源目录:

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

Express 将会按照你设置静态资源目录的顺序来查找静态资源文件。

为了给静态资源文件创建一个虚拟的文件前缀(实际上文件系统中并不存在) ,可以使用 express.static 函数指定一个虚拟的静态目录,就像下面这样:

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

现在你可以使用 /static 作为前缀来加载 public 文件夹下的文件了。

http://localhost:3000/static/images/kitten.jpg
http://localhost:3000/static/css/style.css
http://localhost:3000/static/js/app.js
http://localhost:3000/static/images/bg.png
http://localhost:3000/static/hello.html

然而,你提供给 express.static 函数的路径是一个相对node进程启动位置的相对路径。如果你在其他的文件夹中启动express app,更稳妥的方式是使用静态资源文件夹的绝对路径:

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

Express细节探究(1)——app.use(express.static)的更多相关文章

  1. NodeJS之 Express框架 app.use(express.static)

    一 .设置静态文件目录 语法如下: app.use(express.static(_dirname + '/public')); //设置静态文件目录 注: 将静态文件目录设置为项目根目录 + ‘/p ...

  2. express 4.x 模板引擎与express.static

    前提:要在express中使用模块引擎需要将要使用的模板引擎安装在本项目,当然,express也是要安装的.在下面实例中,我使用的模板引擎是pug(一起叫做jade) 我的目录结构如下: 根目录为st ...

  3. nodeJS(2)深了解: nodeJS 项目架构详解(app.js + Express + Http)

    简略了解:nodeJS 深了解(1): Node.js + Express 构建网站预备知识 环境: 环境: win7 + nodeJS 版本(node): 新建 nodeJS 项目: 名称为: te ...

  4. express 应用创建及app.js详解

    #1 express 应用创建 1.安装node.js (自行百度) 2.npm install express -g 3.全局安装express生成器 express-generator npm i ...

  5. 新建一个express工程,node app无反应

    1.问题描述 新建一个express工程,node app以后无反应,浏览器输入localhost:3000,显示如下 2.解决方法 在app.js文件中加入如下代码 app.listen(3000, ...

  6. 89.[NodeJS] Express 模板传值对象app.locals、res.locals

    转自:https://blog.csdn.net/Elliott_Yoho/article/details/53537437 locals是Express应用中 Application(app)对象和 ...

  7. nodejs express template (模版)的使用 (ejs + express)

    var app=require("express").createServer(); app.set("view engine","ejs" ...

  8. app.use(express.static)设置静态文件目录小解

    app.use(path, function, [, function]) 功能: 为path注册中间函数,即根据path使用不同函数进行处理,默认path是"/",也就是处理任何 ...

  9. 66.app.use(express.static)

    转自:https://blog.csdn.net/u010977147/article/details/60956502

随机推荐

  1. The 6th Zhejiang Provincial Collegiate Programming Contest->Problem I:A Stack or A Queue?

    http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3210 题意:给出stack和queue的定义,一个是先进后出(FILO), ...

  2. Android GridView、ListView、ScrollView上下拉刷新

    实现方法是将显示的内容最外层的ViewGroup做成一个LinearLayout,并扩展它,使其可以上下拖动. 重点是实现View的onTouch方法. 下载:http://files.cnblogs ...

  3. Jquery-DataTable 使用介绍

    http://dt.thxopen.com/example/server_side/simple.html

  4. codeforces #309 div1 C

    首先我们会发现所有的人构成了一个图 定义相爱为 在一个集合里 定义相恨为 不在一个集合里 很容易发现满足条件的图一定是一个二分图 那么分类讨论如下: 1.如果出现不合法 答案为0 2.如果不是一个二分 ...

  5. cocos2d-x3.9 默认是 gnustl_static 配置,但是 这个库缺少c++的基础功能... c++_static 功能全面些

    最近的升级Cocos2d-x 3.2正式版.iOS不管是什么程序编译问题,使用结果cocos compile -p android编译APK计划.结果悲剧,出现以下错误. Android NDK: I ...

  6. 【转】win7如何设置共享目录,并且访问不需要输入用户名和密码。

    1.打开guest帐号,guest帐号默认情况下是不启用的 进入控制面板->用户帐户->管理其他帐户->激活Gust用户 2,右击共享目录,属性->共享->共享-> ...

  7. swap chain- IDirect3DSwapChain9

    交换链,对应的接口是IDirect3DSwapChain9,是整个Directx 3D中最核心的接口.D3d程序至少包含一个swap chain,在调用CreateDevice时自动创建, 其中的D3 ...

  8. LinkedList源代码深入剖析

    第1部分 LinkedList介绍LinkedList简介 public class LinkedList<E> extends AbstractSequentialList<E&g ...

  9. bash 正则表达式匹配,一行文本中 “包含 ABC” 并且 “不包含 XYZ”

    bash 正则表达式匹配,一行文本中  “包含 ABC”  并且  “不包含 XYZ” A文件: XXXX ABC XXX4444444444444444XXXX ABC XXX XYZ6666666 ...

  10. 【 D3.js 高级系列 — 1.0 】 文本的换行

    在 SVG 中添加文本是使用 text 元素.但是,这个元素不能够自动换行,超出的部分就显示不出来了,怎么办呢? 高级系列开篇前言 从今天开始写高级系列教程.还是那句话,由于本人实力有限,不一定保证入 ...