• 16.Express框架安装使用

    1.简介

    2.安装使用

    1.安装
    cnpm install express --save

    • 1
    2.使用
    const express = require("express");

const app = express();


app.get('/', function(request, response){
    response.send("hello nodejs");
})

app.get('/news', function(request, response){
    response.send("获取新闻列表成功");
})

app.get('/news/:id', function(request, response){
    let id = request.params["id"]
    let query = request.query  // {page: 10, offset: 0}
    console.log(query);
    response.send(`获取新闻${id}详情成功`);
})

app.listen(3000, 'localhost')

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21

    3.在Express框架中使用ejs模板引擎

    1.安装ejs
    cnpm install ejs --save

    • 1
    2.使用
    // app.js

const express = require("express");

const app = express();

app.set("view engine", "ejs");


app.get('/', function(request, response){
    let renderData = {
        "index": "首页",
        "content": "
    欢迎来到首页
    "
    }
    // 此处不需要写称：./views/index.ejs
    response.render("index", {"data": renderData});
})


app.listen(3000, 'localhost')

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    
DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><%=data.index%>title>
head>
<body>
    
    <p><%-data.content%>p>
body>
html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14

    在这里插入图片描述

    3.公共模板引入方法
    <%- include('xxx.ejs')%>

    • 1
    4.指定模板位置，默认模板位置在views
    // __dirname：当前目录
app.set('views', __dirname + '/views')

    • 1
    • 2
    5.修改ejs模板文件后缀名为html
    • 1.在app.js的头上定义ejs，代码如下
      const ejs = require('ejs');

      • 1
    • 2.注册html模板引擎代码如下
      app.engine('html', ejs.__express);

      • 1
    • 3.将模板引擎换成html代码如下
      app.set('view engine', 'html');

      • 1
    • 4.修改模板文件的后缀为.html

    4.利用Express.static托管静态文件

    1.如果你的静态资源存放在多个目录下，你可以多次调用express.static中间件：
    // public/css/base.css
app.use(express.static('public'))

    • 1
    • 2
    2.在ejs模板引擎中进行引用
    <head>
	<link rel="stylesheet" href="css/base.css">
head>

    • 1
    • 2
    • 3
    3.虚拟静态目录
    app.use('static', express.static('public'))

    • 1
    http://localhost:3000/static/images/logo.png

    • 1
  • 相关阅读:
    Spring IOC之@ComponentScan
    学内核之十二：从slab内存管理想到的
    基于STM32的电子时钟（论文+源码）
    五、JAVA基本数据类型
    STC单片机24——超声波测距 窗口显示距离
    Mac电脑怎么在Dock窗口预览，Dock窗口预览工具DockView功能介绍
    java---kruskal算法---最小生成树(2)（每日一道算法2022.9.3）
    网络编程简单学习
    PCIe协议翻译【第三章】【Data Link Layer Specification】
    C++封装详细解析+代码演示
  • 原文地址：https://blog.csdn.net/qq_42517220/article/details/126730350