博客管理与文章发布系统-第三方模块及其用法Part1

Posted 2021-02-18 dokom666

写个帖子记录一下自己写的第一个express完整项目。

所需第三方模块及其用法。

一.先把所需文件和准备工作写一下

写项目前的准备

1.创建所需文件夹 public 静态资源
model 数据库操作
route 路由
views 模板

2.初始化项目描述文件
npm init -y

3.下载第三方模块
npm install express mongoose  express的数据库处理模块

art-template 模板模块

express-art-template. express的模板渲染模块 

二.第三方模块

1.express创建服务器初始化

　// 引用框架
　const express = require(‘express‘);

　　// 创建网站服务器

　　const app = express();

　　// 数据库连接

　　require(‘./model/connet.js‘);

　　// 监听端口

　　app.listen(80);

 

 

express引擎下面有3个接收请求的方法：

1.app.get

app.get(‘/‘, (req, res) => {
    // send()
    // 1.send内部会检测响应内容的类型
    // 2.会自动帮我们设置HTTP的状态码
    // 3.自动设置响应内容的编码
    res.send(‘Hello Express‘);
})

app.get(‘/request‘, (req, res, next) => {
    req.name = ‘张三‘;
    next();
})

这里如果回调函数中再加入一个next的话，可以把请求传给下一个中间件处理,为了更好理解，后面将再举一个例子。

2.app.use接收所有类型的请求

例：

app.use(‘/admin‘, (req, res, next) => {
    // let isLogin = false;
    let isLogin = true;
    if (isLogin) {
        // 如果登录了让请求继续向下执行
        next();
    } else {
        // 如果没有响应一个结果
        res.send(‘您还没有登录 不等访问admin这个页面‘)
    }
})

当我们拦截了请求之后，我们还想让后面的中间件继续处理这个请求，我们可以用next，但是用之前一定要先传入next

3.app.post

const bodyParser = require(‘body-parser‘);
//拦截所有请求
app.use(bodyParser.urlencoded({extended: false}));
//再内部用系body-parser方式来处理post请求参数
//如果true方法内部用第三方模块qs来处理请求参数
app.post(‘/add‘, (req, res) => {
    res.send(req.body);
    // req.body为bodyparser在req中添加的属性
})

express为我们提供了req.query方法处理get请求参数。（网上说是nodejs自带的方法，可是我在没有express的文件中使用发现值为undefined=。=）

 

2.模板引擎art-template与express-art-template

先在项目的目录下创建一个名为views的文件夹

// 告诉express框架模板所在的位置
app.set(‘views‘, path.join(__dirname, ‘views‘));
//告诉express模板的默认后缀
app.set(‘view engine‘, ‘art‘);
//告诉express渲染后缀为art时,使用的渲染引擎是什么
app.engine(‘art‘, require(‘express-art-template‘));

a.日期转换模块dataFormat

在模块下有template.defaults.imports.xxx=xxx(其中xxx为想要加入到模板中的方法，在模板中可以直接使用了）；

//导入dateformat第三方模块
//要对模板引擎进行配置向外部开放变量，在模板内部才能调用该方法
const dateFormat = require(‘dataformat‘);
//导入art-template
const template = require(‘art-template‘);
//向模板内部导入dataformat变量
template.defaults.imports.dateFormat = dateFormat;

//开放静态资源文件
app.use(express.static(path.join(__dirname, ‘public‘)));

开放静态资源文件,当接到需要静态资源的请求时，自动返回相应的静态资源，括号内为文件所在的上级目录，由于app.js处于顶级目录，而静态资源都存放在public里面所以这么写。

此时需要注意的是，当我们返回模板的时候，里面外链的css和img的路径还是相对路径例如：

<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">
  <link rel="stylesheet" href="css/base.css">

此时的路径是相对路径，但不一定会报错（请求地址与静态文件所在的目录相同的情况下）

假设我们当前的请求路径是/admin/login,而css的路径/blog/public/admin/css/bass.css的话，绝对路径和相对路径的结果是相同的，但如果我们的请求路径改变的话，就无法完成静态资源的渲染了，

所以在这里我们把css的地址改一改

<link rel="stylesheet" href="/admin/css/base.css">