Node.js后端开发 - 进阶篇 #11 express框架之res.sendFile和res.render，传递模块数据，模板引擎（持续更新中）

目录

一、前言

二、res.sendFile和res.render 函数的区别？

1、handler.js 业务模块返回 html 页面

（1）加载的 html 页面，没有css文件和image图片文件

（2）加载的 html 页面，有css文件和image图片文件

（3）最终效果

---

一、前言

上几篇文章我们对exprss的 router.js 路由模块、handler.js 业务模块进行了封装介绍，详细可参见博文：Node.js后端开发 - 进阶篇 #9 express框架之路由模块的封装2（相对安全）、Node.js后端开发 - 进阶篇 #10 express框架之封装handler.js模块 这篇文章我们将讲 res.sendFile和res.render 函数的区别？如何传递模块数据？服务器端如何响应css文件、image文件？以及模板引擎的一些知识

二、res.sendFile和res.render 函数的区别？

1、handler.js 业务模块返回 html 页面

（1）加载的 html 页面，没有css文件和image图片文件

上篇文章我们封装了 handler.js 文件

//业务模块

//暴露函数,并且需要传入req、res参数，
//才能处理相应的业务，向用户响应
module.exports.index = function (req, res) {
    res.send('这个是 handler.index 方法中的代码');
};

它返回响应的是一些简单的文字信息： res.send('这个是 handler.index 方法中的代码'); ，我们现在来尝试返回一些 html 页面，我们新建一个 index.html，然后把相关resources资源文件放到项目里面。那么要用户看到 index.html 页面很简单，只要读取 index.html 页面的内容，然后响应给用户就行了。

我们可以用到前几篇文章讲到的 res.sendFile() 方法，要先拼接一下 index.html 的路径，要拼接路径我们先要加载 path 模块 ，我们来看下修改后的 handler.js 文件

//业务模块

var path = require('path');

//暴露函数,并且需要传入req、res参数，
//才能处理相应的业务，向用户响应
module.exports.index = function (req, res) {
    //res.send('这个是 handler.index 方法中的代码');

    //它后面的参数，回调函数可不写，它也会把信息数据返回给用户
    res.sendFile(path.join(__dirname, 'views', 'index.html'));

};

我们运行服务器端程序，然后在浏览器中输入地址：http://localhost:3000/

             

 这样可以看到网页信息，但是有很大的问题，因为css文件和image图片文件都没有。

 当请求css文件、图片文件的时候，服务器返回的是404。那么为什么会这样？

因为我们对用户请求的这些静态资源文件，服务器并没有做处理。那么我们怎么做处理呢？

（2）加载的 html 页面，有css文件和image图片文件

我们可以用到前几篇文章讲到的 通过express模拟Apache实现静态资源托管服务 的一些知识，详见可参考博文：Node.js后端开发 - 进阶篇 #6 express框架之通过express模拟Apache实现静态资源托管服务 ，我们修改下路由模块 router.js 里面的代码，实现对 resources 文件下的内容进行静态资源托管，核心代码如下

// 实现对 resources 文件下的内容进行静态资源托管
// /resources/css/MyStyle.css
router.use('/resources', express.static(path.join(__dirname, 'resources')));

（3）最终效果

我们运行服务器端程序，在浏览器中输入地址：http://localhost:3000/ ，最终效果如下图，css样式 和 图片文件都加载出来了

更新中。。。。。