NodeJS之Express基础

Express基础

Express它是一个NodeJS平台下面的框架，主要用于构于Web服务器项目，它是一个第三方的模块，我们可以直接通过包管理工具下载就可以了

安装过程

npm安装过程

$ npm install express --save

cnpm安装过程

$ cnpm install express --save

在上面的安装过程里面，我们的npm使用的是国外的服务器进行安装，而我们的cnpm则使用了内淘宝服务器进行安装

npm/cnpm每 次安装都是从服务器上面下载，这样极大的浪费发我们的资源，后来我们改用yarn来进行安装

yarn安装过程

$ yarn add express

重点注意：yarn不需要加--save，它默认就会把本次的安装记录写在当前目录下在的package.json里面

创建Express的服务器

初始化项目

$ npm init --yes

如果说电脑上面有yarn的，也可以使用下面的命令

$ yarn init --yes

加了--yes以后，它会直接帮你生成，不再询问你的配置信息，你后期可以自己打开 package.json去修改

创建项目程序

const http = require("http");
const express= require("express");      //Express框架
let app=express();                      //app全称application，它是一个网站程序
let server = http.createServer(app);    //通过http模块创建了一个服务器server

监听端口

//服务器是要运行在某一个端口上面
server.listen(8888,()=>{
    console.log("服务器启动成功");
});

启动程序

正常情况下，我们应该是通过 node app.js来启动这个程序，但是，我们在项目当中，要严格的按照项目的方法来启动程序，需要通过package.json来设置程序的启动命令

{
  "name": "expressdemo01",
  "version": "1.0.0",
  "main": "app.js",
  "license": "MIT",
  "author": "张三",
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "^4.16.4"
  }
}

在上面的代码当中，这是package.json的设置,它的启动命令写在了script这个属性里面，我在时面配置了一个"start":"node app.js",把这个命令配置好了以后，我们就可以直接在控制台执行

$ npm run start

执行这个命令以后，相当于调用了package.json里面的scripts里面的start的命令

上面的命令可以简化成下面的命令，省略掉run

$ npm start

处理请求

服务器创建好，并且启动以后，最关键的点就是要让别人去访问这一台服务器，当别人（浏览器客户端）去访问的时候在这里，我们就需要在服务器去处理这些请求

众所周知，请求方式大致常用的有两种，第一是get,第二种是post,我们就先从get请求开妈

处理get请求

什么是get请求？

通过浏览器地址栏请求的，都是get请求！

要处理get请求，我们可以调用express生成的对象的get方法

app.get("/",(req,resp)=>{
    //这样就相当于接收到前面发送的一个get请求
    resp.send("我是服务器返回的信息，我是小哥哥")
});

上面的请求地址：http://192.168.5.101:8888/

上面的回调方法中的两个参数非常得要

request:浏览器到服务器

response:服务器到浏览器

上面请求代码写好了以后，我们就可以在浏览器里面，去访问相关的信息,效果如下图

---

app.get("/def",(req,resp)=>{
    resp.send("我是def的后台，我是第二个方法");
})

MVC概念

MVC是一种开发思路，它把我们Web开发分成了三个部分，分别是控制器(Controller)，视图(View)以及模型(Model)这三个东西

Controller可以理解为我们处理请求的程序，它控制了我们的请求地址与请求方式

View可以理解为视图，也就是我们请求以后返回的网页文件

Model：模型文件

为了能够设置MVC的开发方式，我们首先要弄清楚这三者到底是什么

控制器

app.get("/biaogege",(req,resp)=>{
    // resp.send("账号：<input type='text' placeholder='请输入用户名'>");
    resp.render("aaa");
});

上面的代码就相当于一个控制器，它控制了一个请求地址的地址，并且是一个get请求

设置完控制器以后，当浏览器通过这个地址访问到这个控制器以后，这个时候，如果控制器要返回一个视图，这个时候，我们就需要设置视图文件以及引擎设置

视图

首先我们要安装视图引擎的模块

$ yarn add art-template express-art-template

接下来，我们要设置视图引擎

const path=require("path");
const template=require("express-art-template");    //导入视图引擎模块
app.engine("html",template);             //设置视图文件的后缀扩展名  
app.set("views",path.join(__dirname,"./views")); //设置视图文件所在的位置
app.set("view engine","html");         //加上这行代码，再返回视图的时候，就不用再写视图文件的后缀名了   

经过上面的设置以后，我们就已设置好了视图引擎了，可以直接返回一个视图文件了

注意上面的三个方法 app.engine,app.set()