基于node.js开发的文章生成器(六、网页版本的文章生成器--工整优化篇)

简介: # 引言前面我们已经学完了基于express框架下服务器的启动,get请求的接收与处理还有post请求的接收与处理。同时我们使用接口测试工具完成了接口的测试,响应值和接受值返回值都是正常的。那么为什么还有这一章节呢?# 问题的提出原来我们之前对于get请求和Post请求的接受与处理,虽然可以实现其功能,但是整体代码都是写在一个js文件中的,这就导致我们js文件很臃肿,很难看,维护和开发成本都会大大的提高。那么我们有没有一种方法,让我们的代码工整性和复用性都大大提高呢?# 解决的思路我的解决方案是:抽成模块,进行模块化开发。# 实例还是拿我们之前的cs.js作为讲解。

引言

前面我们已经学完了基于express框架下服务器的启动,get请求的接收与处理还有post请求的接收与处理。同时我们使用接口测试工具完成了接口的测试,响应值和接受值返回值都是正常的。那么为什么还有这一章节呢?

问题的提出

原来我们之前对于get请求和Post请求的接受与处理,虽然可以实现其功能,但是整体代码都是写在一个js文件中的,这就导致我们js文件很臃肿,很难看,维护和开发成本都会大大的提高。

那么我们有没有一种方法,让我们的代码工整性和复用性都大大提高呢?

解决的思路

我的解决方案是:抽成模块,进行模块化开发。

实例

还是拿我们之前的cs.js作为讲解。

原本的cs.js中的代码

import express from 'express';

const app = express();
app.use(express.urlencoded({extended:false}));
app.get('/getmethod',(req,resp)=>{
    console.log('get')
    resp.send("这是一个get请求");
})

app.post('/postmethod',(req,resp)=>{
    console.log('post')
    resp.send("这是一个post请求");
})

app.post('/postcs',(req,resp)=>{
    const result = req.body;
    console.log(result);
    resp.send('成功了');
})

app.listen(6666,()=>{
    console.log('serve is running at http://localhost:6666');
})

当然上面我们的代码还是不够多,当一个复杂的业务出现时,如果把所有的请求都挂在一个js文件中,就会导致文件变得非常臃肿。而且代码的复用性很差。

这里我们采取模块化的开发方法。

在目录下创建 router文件夹和router_handle这两个文件夹。

接下来我们利用到下面几个知识点完成模块的抽出

Router

express中的Router作用就是为了方便我们更好的根据路由去分模块。避免将所有路由都写在入口文件中。

使用之前我们通过const router = express.Router();完成创建router

router文件夹

我们在router文件夹下创建ceshi.js文件,然后首先导入'express'模块

import express from 'express';
const router = express.Router();

...//暂时省略的部分

export default router;

完成上述代码后,我们就已经成功将router下的ceshi.js抽成了一个module并导出了。

router_handle文件夹

该目录下同样创建一个ceshi.js,这里用来写代码层面上的真正的功能上的实现。

function postMethod(req,resp){
    const result = req.body;
    console.log(result.ceshi);
    resp.send('post method success');
}
export {postMethod};

最后的整合及测试

router和router_handle的整合

接下来我们来整合router文件夹和router_handle文件夹,上面说过,中间router文件夹中省略了一部分代码,省略的这部分代码就是import router_handle中的实现的代码 并use上。

import express from 'express';
const router = express.Router();

import {postMethod} from '../router_handle/ceshi.js';

router.post('/postMethodCeshi',postMethod);

export default router;

上述就是router目录下的ceshi.js全部代码,先是常规的 ES Moudle标准的导入所需的模块,然后创建router,然后导入写好的实现文件---即:router_handle目录下的ceshi.js文件。

接下来将引入的router_handle挂载到router.post()下,最后作为modle导出。

整合到cs.js中使用

上面说到,这次我们的主入口是cs.js文件,接下来我们要在cs.js中使用这个模块。

import express from 'express';

import router from './router/ceshi.js'
const app = express();
app.use(express.urlencoded({extended:false}));

app.use(router);

app.listen(6666,()=>{
    console.log('serve is running at http://localhost:6666');
})

接下来我们打开接口测试工具,按照之前测试接口,发现没有问题。优化完成。

相关文章
|
9天前
|
JavaScript 前端开发 NoSQL
使用Node.js进行后端开发入门
【8月更文挑战第10天】恭喜你完成了Node.js后端开发的入门之旅!这只是个开始,Node.js的世界远比这广阔。随着你对Node.js的深入学习和实践,你将能够构建更复杂、更强大的后端应用。不断探索、学习和实践,你将在Node.js的道路上越走越远。
|
15天前
|
JSON JavaScript 前端开发
震惊!JS如何悄无声息追踪你的每一步?揭秘页面访问与关闭的超级上报大法,让数据说话,优化体验不再难!
【8月更文挑战第4天】在Web开发中,跟踪用户行为对提升体验与留存至关重要。本文以在线学习平台为例,介绍如何用JavaScript监听页面访问及关闭,并上报数据。通过`window.onload`监测页面加载,记录用户访问;利用`navigator.sendBeacon`在用户离开时发送少量数据至服务器,无需担心请求失败。需注意隐私合规、性能影响及浏览器兼容性。此技术有助于深入理解用户行为,为产品迭代提供依据。
36 8
|
20天前
|
JavaScript NoSQL Serverless
函数计算产品使用问题之如何创建一个自定义运行时并指定Node.js版本
阿里云Serverless 应用引擎(SAE)提供了完整的微服务应用生命周期管理能力,包括应用部署、服务治理、开发运维、资源管理等功能,并通过扩展功能支持多环境管理、API Gateway、事件驱动等高级应用场景,帮助企业快速构建、部署、运维和扩展微服务架构,实现Serverless化的应用部署与运维模式。以下是对SAE产品使用合集的概述,包括应用管理、服务治理、开发运维、资源管理等方面。
|
16天前
|
缓存 负载均衡 JavaScript
Node.js 服务器性能优化
【8月更文挑战第4天】 Node.js 服务器性能优化
18 1
|
20天前
|
JavaScript API 调度
深入理解Node.js事件循环及其在后端开发中的应用
【7月更文挑战第30天】本文旨在通过深入浅出的方式,解析Node.js事件循环机制的工作原理及其在后端开发中的实际应用。我们将从事件循环的基本概念出发,逐步探讨其与异步I/O操作的关系,以及如何利用事件循环优化后端性能和处理高并发请求。文章将结合实际案例,为读者提供清晰的认识和应用策略。
|
7天前
|
移动开发 前端开发 JavaScript
学习Particles.js 给网页来点粒子特效
学习Particles.js 给网页来点粒子特效
20 0
|
10天前
|
缓存 JavaScript 前端开发
微信 JS-SDK Demo “分享信息设置” API 及数字签名生成方法(NodeJS版本)
微信 JS-SDK Demo “分享信息设置” API 及数字签名生成方法(NodeJS版本)更新时间(2020-10-29)
|
1月前
|
JavaScript Ubuntu Shell
Ubuntu上安装任意版本nodejs方法
通过以上步骤,您可以在Ubuntu系统上灵活地安装和管理不同版本的Node.js。这种方法让开发者能够根据不同项目的需要选择合适的Node.js版本,同时也使版本切换变得非常方便。而且,nvm能够为每个项目独立管理依赖,从而确保不同项目之间的环境隔离,增强了开发环境的稳定性和可维护性。
306 2
|
1月前
|
缓存 监控 JavaScript
常见的JS优化方案都有那些
【7月更文挑战第7天】 JavaScript优化包括代码优化(箭头函数、解构赋值、模板字面量、展开运算符、高阶函数)、DOM操作优化(减少操作、事件委托、节流防抖)、异步优化(Promise、Web Workers)、缓存策略(结果缓存、HTTP缓存)、压缩合并以及性能分析和监控。通过这些方法,提升网页性能和用户体验。
20 1
|
1月前
|
数据采集 缓存 JavaScript
JavaScript递归函数的设计与优化
JavaScript递归函数的设计与优化