用express搭建一个简单的ndoe服务

Posted on 2020-07-13 08:35  妖娆的油条  阅读(144)  评论(0编辑  收藏  举报

初始步骤

1.安装express

npm i express
  1. 初始化git,并忽略node_modules包

  2. 创建项目入口文件 meadowlark.js

    • 修改主文件名:npm默认用的主文件名师index.js,如果你想要使用其它的主文件名,需要修改package.json中的main属性

  • meadowlark.js

    // 项目入口文件
    const express = require('express')
    
    // 创建服务
    const app = express()
    
    // 设置服务器端口
    app.set('port', process.env.PORT || 3000)
    
    // 开启并监听服务
    app.listen(app.get('port'), () => {
      console.log(`express server is running at http://localhost:${app.get('port')}`)
    })
    
    app.get('/hello', (req, res) => {
      res.send('hello')
    } )
    
    
    // 定制404页面
    app.use((req, res) => {
      console.log(123)
      res.type('text/plain')  // 设置请求响应的数据类型
      res.status(404)  // 请求状态
      res.send('404 Not-Found')  // 响应的数据
    })
    
    // 定制500页面(有四个参数的情况下,第一个参数是表示'错误'的参数)
    app.use((err, req, res, next) => {
      console.log(345)
      res.type('text/plain')
      res.status(500)
      res.send('500 Server-Error')
    })
    

    如上图: 注意我们定制的404和500页面使用的是app.use()接收请求。再就是注意这两个定制页面的顺序,必须放在其他页面请求的后面,不然访问的所有url都是404;在就是express根据中间件的传参个数看执行404还是500

  • 路由路径:默认忽略了大小写和反斜杠,并且在匹配时也不用考虑查询字符串。所以像 /Helle/Helle?name=1/helle//Helle/?name=1都能匹配/hello的路由

使用handlebars视图模型

express中支持多种视图引擎。一个是Jade,express比较偏好,但这种模板引擎对html抽象化比较严重,以至于不像html文档;还有一种不错的模板引擎框架:HandleBars(本项目的学习就是用这个框架) --基于与语言无关的Mustache

  1. handlebars的配置
    安装中间件
      npm i express-handlebars
    
    在入口文件中配置
// 项目入口文件
const express = require('express')

// 创建服务
const app = express()
var exphbs  = require('express-handlebars')

// 设置服务器端口
app.set('port', process.env.PORT || 3000)

// 将handlebars设置为视图引擎
var handlebars = require('express-handlebars').create({
defaultLayout:'main',
// extname: '.hbs',
// default: 配置默认布局; 默认为views/layout/main.handlebars
// extname: 配置文件扩展名;使handlebars文件可以使用这个扩展名
helpers: {
   section: function(name, options){
       if(!this._sections) this._sections = {};
       this._sections[name] = options.fn(this);
       return null;
   }
}
})
app.engine('handlebars', handlebars.engine)
app.set('view engine', 'handlebars')

// 开启并监听服务
app.listen(app.get('port'), () => {
  console.log(`express server is running at http://localhost:${app.get('port')}`)
})

app.get('/', (req, res) => { // 默认状态会返回200
  res.render('home')
} )

app.get('/about', (req, res) => {
  res.render('about')
} )


// 定制404页面
app.use((req, res) => {
  res.status(404)  // 请求状态
  res.render('404')  // 响应的数据
})

// 定制500页面
app.use((err, req, res, next) => {
  res.status(500)
  res.render('500')
})

引擎默认会指定返回内容为text/html,状态为200。所以在404和500d定制页面,我们要指定状态码

handlebars默认会以views/layouts目录下的main.handlebars文件作为布局。路由页面文件放在views文件夹下,会根据res.render()方法传入的字符串到views文件夹下面找同名文件。当然,以上两个默认配置都是可以改的,具体请看官网。

静态文件的配置

通过static中间件可以将一个或者多个目录设置为静态资源目录,其中的资源不经过任何特殊处理直接发送给客户端。

// meadowlark.js
...
// 设置静态资源目录
app.use(express.static(path.join(__dirname, '/public')))
...

上面一段代码的意思就是说:把项目目录下的public文件夹设置为静态文件夹,现在访问这个文件夹下的一张图片

//home.hbs

<img src="/imgs/thPAUB4RV7.jpg" alt="">
// 以/开头的路径表示先对于项目根目录

express.static('public'[, options]),可以传两个参数,第一个参数指定要从其提供静态资产的根目录。该功能通过req.url与提供的root目录结合来确定要服务的文件。当找不到文件时,它不会发送404响应,而是调用next() 继续前进到下一个中间件,从而允许堆栈和回退。第二个参数是一个对象,看不懂。

Copyright © 2024 妖娆的油条
Powered by .NET 9.0 on Kubernetes