携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第21天,点击查看活动详情
系列介绍
该系列主要是介绍一些nodejs相关的基础知识,没有什么特别难的知识点,都是一些比较基础知识点。大家学习起来,也会比较容易理解和接收。
这些知识点,也是以前自己学习nodejs的时候,学习过的知识点。有些知识点,可能是由于学习的时间比较久了,也有可能是平时工作中用到的机会比较少,也差不多快把它们都忘记掉了。现在把它们都写下来,写成文章,一方面是记录下自己以前学习的nodejs知识点,一方面也是复习巩固自己以前学习的nodejs知识点。不要学着学着,就把以前的知识点都忘光了。
环境安装
实现之前,你首先需要安装nodejs环境。因为我们写的代码需要在node环境上运行,如果你没有,那么文件会运行不了。
以下是nodejs的安装地址,如果你没有安装的话,可以先把它安装上。安装了可以忽略这一步,跳到下面一步。
前言
在前面几篇文章里nodejs系列:43-45
,主要是介绍了koa-json这个中间件。
koa-json中间件,可以用来格式化服务器响应给到客户端的json格式数据
koa-json中间件介绍完了,接下来,我们介绍一下另外一个中间件:koa-logger。
koa-logger
koa-logger是一个koa的日志打印的中间件,使用该中间件,就可以在命令行工具里,打印请求日志了。有了这些请求日志,对于我们的调试,就比较方便了。
这里这么说,可能体现不了。我们通过一个示例来讲解一下,就比较容易理解了。
实现
本小节,先把客户端的逻辑代码完成。
创建文件
创建一个index.html文件,客户端的逻辑代码将在这个文件里完成。
html结构
<body>
<input type="text" />
<button>请求</button>
</body>
html结构里,我们只写了一个input输入框,还有一个button按钮。
先简单描述一下,这个示例的操作过程。在input输入框里,输入请求的地址。点击button按钮,拿到input框里的请求地址,发送ajax请求,给到后端服务器。
ajax方法
function ajax(url, method = "get") {
let xhr = new XMLHttpRequest();
xhr.open(method, url);
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
console.log(xhr.responseText);
}
}
};
xhr.send();
}
封装一个发送ajax请求的方法,主要是创建一个xmlhttprequest实例对象,用这个实例对象来发送ajax请求。
获取dom元素
let ipt = document.querySelector("input");
let btn = document.querySelector("button");
监听点击事件
btn.addEventListener("click", () => {
let url = "http://localhost:3000" + ipt.value;
ajax(url);
});
监听button的点击事件,发送ajax请求
小结
本小节,先是介绍了koa-logger中间件:
koa-logger是一个koa的日志打印的中间件
使用该中间件,可以在命令行工具里打印我们的请求日志,方便我们调试。
同时,也把客户端的逻辑代码完成了,方便后面联调使用。
最后,放上自己比较喜欢的一句诗句:
千淘万漉虽辛苦,吹尽狂沙始到金 - 唐 刘禹锡《浪淘沙》