Node.js学习--创建一个Express服务

本文介绍了Node.js的安装配置过程,演示了如何创建简单的HTTP服务器,并深入探讨了使用Express框架构建Web应用的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Nodejs是一种js服务器端运行环境。Express是基于Nodejs的应用开发框架,完全是由路由和中间件组成,一个express应用就是在调用各种中间件

1、安装配置node.js

node.js中文网选择需要对版本后下载,之后按照提示同意协议、选择位置、点击下一步安装。安装完成后会自动配置好环境变量,并且自带npm。NPM(Node Package Manager)是node的包管理工具,通过它可以所需第三方包的下载。安装完成后打开Windows命令行工具输入node -v可以看到node版本。

接下来需要配置node缓存路径、prefix路径与镜像站。

所谓缓存路径就是npm下载暂存安装包的位置,默认在C盘用户目录下的AppData/Roaming/npm,这里将缓存路径设到node的安装目录下D:\Program\IDE\NodeJs\node_cache。

设置prefix之后,npm会把global全局库安装到该位置,例如我的node安装在D:\Program\NodeJs目录下,我将prefix路径就设置为这个目录。因为之前安装node时这个目录已经被自动添加到环境变量了,将vue-cli、express等库安装到这个目录就可以直接在命令行使用,如果设置为别的目录还需要再配环境变量。

将镜像设置为淘宝镜像。

npm config set prefix "D:\Program\NodeJs\node_cache"    # 设置缓存
npm config set cache "D:\Program\NodeJs"    # 设置prefix
npm config set registry=http://registry.npm.taobao.org        # 设置镜像

设置完成后在命令行输入npm config list可以看到配置结果如下,其中; userconfig C:\Users\Super\.npmrc表明npm将配置文件信息保存在一个.npmrc文件中,即使卸载重装node这个文件也不会被删除,因此上面的设置在重装后仍生效。

PS C:\Users\Super> npm config list
; cli configs
metrics-registry = "http://registry.npm.taobao.org/"
scope = ""
user-agent = "npm/6.14.5 node/v12.18.2 win32 x64"

; userconfig C:\Users\Super\.npmrc
cache = "D:\\Program\\NodeJs\\node_cache"
prefix = "D:\\Program\\NodeJs"
registry = "http://registry.npm.taobao.org/"

; builtin config undefined

; node bin location = D:\Program\NodeJs\node.exe
; cwd = C:\Users\Super
; HOME = C:\Users\Super
; "npm config ls -l" to show all defaults.

这时在命令行输入npm install -g express-generator全局安装express构建工具,npm会安装express工具到NodeJs目录下,在命令行输入express --version显示express版本

2、创建一个HttpServer服务端

在项目文件夹新建一个server.js文件,就可以直接开始第一个node文件。首先在文件开头需要使用require包含所需要的模块,然后利用http.createServer创建一个server,并执行回调函数。在回调函数内对请求req进行处理,并返回res结果。

利用url的parse方法将req请求中的url转换为json后,得到其中的请求文件名pathname。然后利用fs的readFile方法读取文件,在回掉函数中进行错误判断并设定文件头的状态码以及"Content-Type",之后将文件写入res返回。最后记得在createServer的回掉方法内结束res.end();

在文件最后调用server.listen();一直监听localhost的3000端口。 

启动node服务,在文件夹内通过控制台输入:node server.js。打开浏览器的localhost:3000/index.html,通过server.js访问index.html页面内容。   

  const http=require('http');
  const url=require('url');
  const fs=require('fs');

//1、创建server
let server=http.createServer((req,res)=>{
//2、获取网页请求的文件路径
  let pathname=url.parse(req.url).pathname;
//3、利用fs读取文件
  fs.readFile(pathname.substring(1),function (err,data) {
    if (err){                          //有错误err,文件未找到,返回状态404
      res.writeHead(404,{
        "Content-Type":"text/html"
      });
    }else{                            //否则正常,设定返回状态为200
      res.writeHead(200,{
        "Content-Type":"text/html"
      });      
      res.write(data.toString());    //将找到的文件写入返回
    }
    res.end();                      //在函数readFile()内关闭链接
  });
});

//4、让server一直监听localhost的3000端口的请求
server.listen(3000,'localhost');

3、Node请求数据

Node作为服务器有时候还需要请求其他服务器的数据,此时node就成了“客户端”了,通过HTTP的get方法可以对指定的网址接口进行api调用、数据请求,例如:

const http=require('http');

//利用HTTP请求第三方接口服务
http.get('http://www.imooc.com/u/card',(res)=>{
  let data='';
  res.on('data',(temp)=>{               //检测到数据,追加到data中
    data+=temp;
  });
  res.on('end',()=>{                    //检测到数据传输结束,控制台输出数据
    console.log(data);
  });
});

在get的回调函数中对res进行处理,如果有数据传输on('data'),则将temp追加到data,如果传输完成on('end'),则进行相关处理。

4、使用Express框架

   1、初始化项目

      通过express命令来初始化一个服务框架:express server,之后就可以看到生成了一个server文件夹。

            

        其中bin/www.js用于创建一个HTTP的服务器并且启动、监听某个端口,一般不用修改。public文件夹用于存放img、js、css等静态文件,routes文件夹存放路由js文件。view中存放视图文件,默认提供的是用jade类型文件。app.js文件中设置视图及通过app.use()调用相关模块。例如:

//app.js文件内指定根目录
var index = require('./routes/index');
app.use('/', index);

//index.js文件内渲染index页面
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
}); 

        首先在app.js内将网站的根目录指定为routes下的index.js文件,在index.js中调用router.get方法请求view下的视图文件,在回调函数render中渲染index.jade界面,从而当你在浏览器输入localhost:3000时会默认显示view/index.jade页面。

        express官方提供.jade文件作为网页默认视图,因此如果需要使用html则需要进行配置:

        首先通过cnpm install ejs --save安装ejs插件,然后在app.js文件中view engine setup下进行配置引擎:

        

    之后在views文件夹下删除原有.jade文件,新建你想要展示的index.html文件即可。例如:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>express index</title>
</head>
<body>
    <h1>Express</h1>
    <p>Welcome use express in HTML</p>
</body>
</html>

        2、启动Express,在server所在文件夹下执行命令:node bin/www,在浏览器localhost:3000显示为:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值