Node 应用基础及教程 4

基于Express的Web应用编程与工程化开发CONTENTS目录01项目初始化02基于Express的路由系统03基于Express的中间件生态04模板引擎与布局管理05会话管理与认证06Express集成07安全与性能优化1.项目初始化使用Express生成器可以快速搭建Express应用骨架。1．使用Express生成器创建项目的主要步骤使用Express生成器创建项目的主要步骤如下。（1）全局安装Express生成器。在终端执行以下命令全局安装Express生成器：npminstall-gexpress-generator其语法格式为npminstall-g<包名>。其中-g表示全局安装，可在任意文件夹使用该命令。（2）创建项目[使用EJS（EmbeddedJavaScript）模板引擎示例]。在终端执行以下命令创建项目：express--view=ejsmy-project或者express-emy-project使用Express生成器创建项目1.项目初始化参数说明：--ejs/-e：指定使用EJS模板引擎（可选项），也可通过--view=hbs指定Handlebars等。其他常用参数如下。--no-view：不生成视图层（适用于API项目）。--port/-p：指定默认端口号，如-p3001。（3）安装依赖。在终端执行以下命令安装依赖：cdmy-projectnpminstall#安装package.json中的依赖#更新mkdirpnpminstallmkdirp@latest（4）启动项目。在终端执行以下命令启动项目：npmstart#启动项目，默认监听3000端口使用Express生成器创建项目1.项目初始化2．生成的项目结构生成的项目结构如下。my-project/├──bin/ #启动脚本文件夹│

└──www #主启动文件（设置端口）├──public/ #静态资源文件夹（CSS、JS、图片等）├──routes/ #路由文件夹│

├──index.js #根路由（首页路由）│

└──users.js #用户相关路由├──views/ #视图模板文件夹（若使用模板引擎）│

├──index.ejs #首页模板│

└──error.ejs #错误信息页模板├──package.json #项目依赖和脚本配置└──app.js #应用入口文件，配置中间件和路由1.项目初始化【验证示例7-1】在文件夹Unit07中执行以下命令创建Web应用项目demo0701。express--view=ejsdemo0701cddemo0701npminstall#安装package.json中的依赖创建项目demo0701时，会默认生成文件入口文件app.js的代码。从本书配套的教学资源中打开“验证示例7-1”对应的程序文件app.js，浏览默认生成的代码。关键代码说明如下。express.static(root)：root为静态资源目录路径，例如'public'。app.use([path],middleware)：path为路由前缀（可选项），middleware为中间件函数。1.项目初始化创建数据库连接会消耗较多的系统资源，连接池通过复用已有连接，避免频繁创建/销毁连接，提升系统性能并减少系统资源消耗。1．MySQL数据库连接池集成MySQL数据库连接池集成的实现步骤如下。（1）安装MySQL驱动。在终端执行以下命令安装MySQL驱动：npminstallmysql2（2）创建pool.js连接池配置文件。MySQL数据库连接池集成

1.项目初始化（3）在路由中使用连接池。MySQL数据库连接池集成

1.项目初始化【操作要求】在文件夹Unit07中创建Web应用项目case0701，从数据表users中查询用户数据并渲染到视图模板users.ejs中。【实现过程】（1）创建Web应用项目case0701的骨架。在文件夹Unit07中执行以下命令创建Web应用项目case0701。express--view=ejscase0701cdcase0701npminstall#安装package.json中的依赖（2）安装依赖包。npminstallexpressmysql2ejs（3）准备数据库。在MySQL中执行以下命令创建数据库与数据表（4）创建文件db.js（数据库连接池）与编写代码。【训练实例7-1】从数据表中查询用户数据并渲染到视图模板1.项目初始化（8）运行应用程序。在终端执行以下命令运行应用程序：nodeapp.js（9）访问测试。打开浏览器访问http://localhost:3000/users。网页输出的用户列表如下：用户列表张珊李斯【训练实例7-1】从数据表中查询用户数据并渲染到视图模板1.项目初始化2．数据库连接池集成的使用要点获取连接：通过pool.query()自动从连接池获取连接，无须手动创建。释放连接：查询完成后，连接自动归还给连接池，无须手动释放。错误处理：使用try/catch捕获连接池操作中的异常（如数据库断开、查询错误）。生产环境将配置放在环境变量中的代码如下：password:process.env.DB_PASSWORD2.基于Express的路由系统查询参数是URL中?后面的键值对，用于传递额外的请求参数，如过滤条件、分页参数等。查询参数通过“?key=value”传递数据，从URL的?后面解析键值对参数。示例代码（Express.js框架）：constexpress=require('express');constapp=express();//解析查询参数：http://localhost:3000/products?category=electronics&page=2app.get('/products',(req,res)=>{constcategory=req.query.category;//获取category参数lectronicsconstpage=Number(req.query.page)||1;//获取page参数2，默认值为1res.send('查询类别：${category}，第${page}页');});app.listen(3000);查询参数解析2.基于Express的路由系统基础路由定义URL与处理函数的映射关系；参数捕获用于动态匹配URL中的变量，例如用户ID、文章ID。路径参数使用“/path/:var”捕获动态值，动态匹配URL中的变量。关键代码解读如下。动态参数用:paramName标记（如:id），:paramName用于定义占位符。匹配结果存储在req.params对象中，通过req.params可获取参数对象。路径中的参数名可自定义，如:postId，但需符合变量命名规则。支持正则表达式约束参数格式，如/users/:id(\\d+)，仅匹配数字ID。基础路由定义与参数捕获

2.基于Express的路由系统【验证示例7-2】在文件夹Unit07中创建JavaScript文件demo0702.js，在该文件中编写以下代码，实现基础路由应用：constexpress=require('express');constapp=express();app.get('/',(req,res)=>{res.send('HelloExpress!');});app.get('/users',(req,res)=>{res.json([{name:'张珊'},{name:'李斯'}]);});app.listen(3000,()=>{console.log('服务器运行在http://localhost:3000');});基础路由定义与参数捕获

2.基于Express的路由系统在终端执行以下命令运行应用程序：nodedemo0702.js打开浏览器访问：http://localhost:3000。网页输出的内容如下：HelloExpress!在浏览器中访问：http://localhost:3000/users。网页输出的内容如下：[{"name":"张珊"},{"name":"李斯"}]基础路由定义与参数捕获

2.基于Express的路由系统中间件是处理请求的函数，可在路由处理前拦截请求，用于权限验证、日志记录等；权限控制通过中间件验证用户身份和权限。中间件通过next()控制执行流程链，在路由处理前执行验证/预处理逻辑。其常用场景包括身份认证、日志记录请求、数据预处理等。路由中间件与权限控制2.基于Express的路由系统在文件夹Unit07中创建JavaScript文件demo0703.js，在该文件中编写以下代码：【验证示例7-3】2.基于Express的路由系统程序的执行流程如下：客户端请求→中间件1→中间件2→……→路由处理函数。关键代码解读如下。中间件函数接收req（请求）、res（响应）、next（下一个处理函数）3个参数。next()：调用后将请求传递给下一个中间件或路由处理函数；若不调用，请求会被阻塞。中间件可串联使用，如authMiddleware、adminOnlyMiddleware，按顺序执行。【验证示例7-3】2.基于Express的路由系统RESTfulAPI通过HTTP方法（GET、POST等）和资源路径设计接口，遵循“资源导向”原则，例如用户资源对应/users路径。REST使用“HTTP方法+资源路径”定义完整的操作语义，HTTP方法表示操作，资源路径定位资源。标准路由设计如表7-2所示。RESTfulAPI路由设计

2.基于Express的路由系统资源命名：用名词复数表示资源，例如/users，而非/getUsers。代码实现：//使用express.Router组织路由constrouter=express.Router();router.get('/',(req,res)=>{/*获取资源*/});router.post('/',(req,res)=>{/*创建资源*/});router.get('/:id',(req,res)=>{/*获取部分资源*/});router.put('/:id',(req,res)=>{/*全量更新资源*/});router.delete('/:id',(req,res)=>{/*删除资源*/});app.use('/api/users',router);//挂载到路径其优势如下。接口语义清晰。降低URL设计复杂度。遵循HTTP标准。RESTfulAPI路由设计

2.基于Express的路由系统在文件夹Unit07中创建JavaScript文件demo0704.js，在该文件中编写以下代码：RESTfulAPI路由设计

3.基于Express的中间件生态中间件是按顺序执行的函数，Express中间件是处理HTTP请求的函数，接收req、res和next3个参数，通过next()控制流程走向。示例代码：app.use((req,res,next)=>{console.log('Middleware1');next();//必须调用next()才能进入下一层});app.use((req,res,next)=>{console.log('Middleware2');next();});app.get('/',(req,res)=>{res.send('HelloWorld');});中间件机制与执行顺序3.基于Express的中间件生态（1）创建JavaScript文件与编写代码。在文件夹Unit07中创建JavaScript文件demo0705.js，在该文件中编写以下代码：【验证示例7-5】3.基于Express的中间件生态（2）安装express。在终端执行以下代码安装express：npminstallexpress（3）启动服务器。打开一个终端，将之称为终端1，然后在终端1中执行以下命令启动服务器：nodedemo0705.js此时，终端1输出以下信息：服务器运行在http://localhost:3000（4）使用curl命令测试API。①

未授权请求（返回401）。打开另一个终端，将之称为终端2，在终端2执行以下命令：curlhttp://localhost:3000/user终端2的响应信息如下：未授权此时，终端1输出以下信息：[17:08:01]GET/user-2003.基于Express的中间件生态打开浏览器，访问http://localhost:3000，此时，页面输出以下内容：未授权②

授权请求（返回用户信息）。在终端2执行以下命令：curl-H"Authorization:valid-token"http://localhost:3000终端2的响应信息如下：你好！中间件此时，终端1输出以下信息：[17:13:05]GET/user-200在终端2执行以下命令：curl-H"Authorization:valid-token"http://localhost:3000/user终端2的响应信息如下：用户信息此时，终端1输出以下信息：[07:23:55]GET/-200请求头必须包含Authorization:valid-token才能通过验证。3.基于Express的中间件生态1．body-parser该中间件用于解析请求体，如JSON、表单数据等。示例代码：constbodyParser=require('body-parser');app.use(bodyParser.json());//解析JSON格式app.use(bodyParser.urlencoded({extended:true}));//解析表单数据参数说明：extended:true：使用qs库解析，允许解析嵌套对象。extended:false：使用原生querystring库解析，仅解析简单结构。常用中间件3.基于Express的中间件生态2．cookie-parser该中间件用于解析请求中的Cookie。示例代码：constcookieParser=require('cookie-parser');app.use(cookieParser('secret'));//'secret'是签名密钥//使用示例res.cookie('user','admin',{maxAge:900000,httpOnly:true});constuser=req.cookies.user;//读取Cookie值常用中间件3.基于Express的中间件生态3．helmet该中间件用于设置HTTP头部，增强安全性。示例代码：consthelmet=require('helmet');app.use(helmet());//启用所有安全策略//自定义策略（例如禁用X-Powered-By头）app.use(helmet({xPoweredBy:false}));支持contentSecurityPolicy、xssFilter等策略。常用防护：XSS（跨站脚本攻击防护、禁止iframe嵌入、隐藏X-Powered-By头）。常用中间件3.基于Express的中间件生态morgan是HTTP请求日志中间件，可自定义格式。基础使用示例代码：constmorgan=require('morgan');app.use(morgan('dev'));//'dev'格式显示状态码和响应时间自定义日志格式示例代码：morgan.token('custom-time',()=>newDate().toISOString());app.use(morgan(':custom-time-:method:url:status'));输出示例：2025-10-01T12:00:00Z-GET/api/users200定制日志中间件3.基于Express的中间件生态JWT原理：生成包含用户信息的令牌（Token），客户端携带令牌访问，服务器端验证合法性。1．生成Token示例代码：constjwt=require('jsonwebtoken');//生成jwt令牌consttoken=jwt.sign({userId:123},'your_secret_key',{expiresIn:'1h'}//有效期1小时);JWT身份认证中间件

3.基于Express的中间件生态2．验证中间件示例代码：functionauthenticate(req,res,next){//从请求中获取客户端携带的令牌consttoken=req.headers.authorization?.split('')[1];if(!token)returnres.status(401).send('Accessdenied');//服务器端验证令牌合法性jwt.verify(token,'your_secret_key',(err,decoded)=>{if(err)returnres.status(403).send('Invalidtoken');req.user=decoded;//将解码数据附加到reqnext();});}//保护路由app.get('/profile',authenticate,(req,res)=>{res.json({user:req.user});});3.基于Express的中间件生态【操作要求】编写程序，生成与验证JWT，包括Token验证流程、中间件权限控制、安全密钥管理等功能。【实现过程】（1）创建JavaScript文件与编写代码。在文件夹Unit07中创建子文件夹case0702，然后在文件夹case0702中创建JavaScript文件case0702.js，在该文件中编写代码。从本书配套的教学资源中打开“训练实例7-2”对应的程序文件case0702.js，浏览相应代码。（2）安装依赖。在终端执行以下命令安装依赖：npminit-ynpminstallexpressjsonwebtoken【训练实例7-2】生成与验证JWT3.基于Express的中间件生态（3）启动服务器。在终端执行以下命令启动服务器：nodecase0702.js（4）测试API。①

获取Token（模拟登录）。在终端执行以下命令：#使用-d参数（自动转为POST）curl-d"""http://localhost:3000/login?username=admin"或者#显式指定POST方法curl-XPOST"http://localhost:3000/login?username=admin"响应示例如下：{"token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwicm9sZSI6ImFkbWluIiwiaWF0IjoxNzQ4ODM2MDg0LCJleHAiOjE3NDg4Mzk2ODR9.KQTh3sO9RvwGDBlxMDGtWY8EWP2PmPAz-0MxL5GL13s"}3.基于Express的中间件生态②

使用Token访问受保护路由。在终端执行以下命令：curl-H"Authorization:Bearer<复制上面的Token>"http://localhost:3000/admin返回信息有以下几种情况。对于管理员用户：返回管理员专属内容。对于普通用户：返回“无管理员权限”。对于无效Token的用户：返回“令牌无效”。③

用表单数据模拟真实登录场景。在终端执行以下命令：#发送JSON格式的用户名和密码curl-XPOST\-H"Content-Type:application/json"\-d'{"username":"admin","password":"admin123"}'\http://localhost:3000/login3.基于Express的中间件生态错误处理函数必须包含4个参数（err、req、res、next），且注册在所有路由之后。（1）定义错误处理函数。示例代码：app.use((err,req,res,next)=>{console.error('错误日志:',err);res.status(500).send('ServerError!');});（2）触发错误。示例代码：app.get('/error',(req,res,next)=>{try{thrownewError('Somethingbroke!');}catch(err){next(err);//传递错误给错误中间件}});Express错误处理中间件

3.基于Express的中间件生态（3）异步错误处理。示例代码：app.get('/async-error',async(req,res,next)=>{try{awaitsomeAsyncOperation();}catch(err){next(err);//必须通过next传递}});注意：错误处理中间件需定义在所有路由之后。调用next(err)会跳过后续中间件，直接进入错误处理部分。Express错误处理中间件

3.基于Express的中间件生态【验证示例7-6】在文件夹Unit07中创建JavaScript文件demo0706.js，在该文件中编写以下代码：Express错误处理中间件

4.模板引擎与布局管理模板引擎的核心作用是将动态数据与HTML模板结合生成最终页面。小型项目首选EJS（降低学习成本），中大型项目考虑Pug（提高开发效率）。1．EJS模板引擎EJS的语法与HTML的类似，接近标准原生HTML，允许在HTML中直接内嵌并执行原生JavaScript代码。在终端执行以下命令安装EJS：npminstallejsEJS/Pug模板引擎

4.模板引擎与布局管理示例代码：EJS/Pug模板引擎

4.模板引擎与布局管理2．PugPug支持缩进式语法，无标签闭合，更注重逻辑与结构分离。在终端执行以下命令安装Pug：npminstallpug示例代码：EJS/Pug模板引擎

4.模板引擎与布局管理1．视图渲染视图渲染的核心方法：res.render(viewName,[locals],[callback])参数说明：viewName：视图文件名（不含扩展名，如'user'）。locals：传递给视图的数据对象（可选项）。callback：渲染完成后的回调函数（可选项）。全局数据：通过app.locals设置（如网站标题、导航菜单）。页面专属数据：通过res.render()的第2个参数传递。视图渲染与布局管理

4.模板引擎与布局管理2．布局管理（1）使用EJS实现布局模板。EJS布局实现需express-ejs-layouts支持。①

布局文件<!--views/layout.ejs-->。②

主视图文件<!--views/index.ejs-->。（2）使用Pug实现布局模板。Pug布局实现原生支持extend/block。①

布局文件//-views/layout.pug。②

主视图文件//-views/index.pug。视图渲染与布局管理

5.会话管理与认证Cookie是存储在客户端浏览器中的小型文本数据，用于跟踪用户状态。会话（Session）则是服务器端存储的用户数据，通常通过Cookie中的SessionID关联。服务器通过Set-Cookie响应头将SessionID发送给浏览器，浏览器后续请求自动携带该Cookie，服务器据此识别用户会话。关键代码示例（PythonFlask版）基于Cookie的会话实现

5.会话管理与认证基于Cookie/Session的认证方式由服务器端完全控制会话数据，适用于传统Web应用场景。认证流程如下。①

用户提交登录表单（用户名+密码）。②

服务器验证凭证：创建Session存储用户ID。③

服务器通过Cookie将SessionID返回给客户端。④

后续请求中，客户端携带Cookie，服务器通过SessionID验证用户状态。Python示例代码（用户退出登录）：@app.route('/logout')deflogout():session.pop('user_id',None)#移除Session中的用户IDreturn"Loggedout"基于Cookie/Session的认证5.会话管理与认证OAuth第三方登录具有无须管理密码、用户体验佳的优势，适用于快速注册/登录。核心流程（以GitHub登录为例）如下。（1）用户单击“GitHub登录”链接，重定向到GitHub授权页面。示例代码：/login/oauth/authorize?client_id=YOUR_CLIENT_ID&redirect_uri=/callback&scope=user:email（2）用户同意授权后，GitHub重定向回用户的应用，返回临时授权码code给应用。示例代码：/callback?code=XYZ123（3）用户的服务器用code换取访问令牌（AccessToken）。（4）用AccessToken获取用户信息，完成登录。OAuth第三方登录集成6.Express集成Sequelize是Node.js中流行的ORM库，支持MySQL、PostgreSQL等关系数据库。通过ORM库连接数据库，将数据库操作转化为JavaScript对象操作。【训练实例7-3】使用Sequelize实现Express与数据库的集成【操作要求】编写程序，使用Sequelize实现Express与数据库的集成，实现简单用户管理系统的后端部分。【实现过程】（1）在文件夹Unit07中创建子文件夹case0703。（2）安装依赖。将文件夹case0703设置为当前文件夹，然后执行以下命令安装依赖：npminstallexpresssequelizemysql2#以MySQL为例（3）初始化连接。（4）定义数据模型。Express与数据库集成

6.Express集成（5）在路由中使用。（6）创建server.js文件。关键代码解读如下。①

依赖导入。express：创建HTTP服务器。sequelize（从database.js导入）：管理数据库连接。userRoutes（从routes/userRoutes.js导入）：处理用户相关的API请求。②

中间件使用。app.use(express.json())：解析客户端发送的JSON请求体，例如POST请求中的req.body。③

路由挂载。app.use('/users',userRoutes)：将所有用户相关的路由（如POST/users）挂载到/users路径下。Express与数据库集成

6.Express集成④

数据库和服务器启动。sequelize.authenticate()：测试数据库连接是否正常。sequelize.sync()：将模型同步到数据库，如果数据表不存在，自动创建users表。app.listen()：启动Express服务器。核心方法说明如下。Model.create()：创建新记录。Model.findAll()：查询所有记录。Model.findByPk()：通过主键查询。Model.update()：更新记录。Model.destroy()：删除记录。（7）创建文件data.json。（8）运行程序与输出结果。Express与数据库集成

6.Express集成【操作要求】编写程序，设置Swagger文档工具，自动生成和展示API文档。【实现过程】（1）在文件夹Unit07中创建子文件夹case0704。（2）安装工具链。在终端执行以下命令安装OpenAPI工具链：npminstallswagger-jsdocswagger-ui-express参数说明如下。swagger-jsdoc：通过JSDoc注释生成OpenAPI规范。swagger-ui-express：在Express中挂载SwaggerUI。（3）创建OpenAPI配置。【训练实例7-4】自动生成和展示API文档6.Express集成（4）使用JSDoc注释定义API。①

定义数据模型（schemas）。②

编写获取所有用户的代码。③

编写创建新用户的代码。关键配置项说明如下。①@openapi：标记OpenAPI注释块的开始。②summary：API操作的简短描述。③description：API操作的详细描述。④tags：API分组标签。⑤requestBody：请求体定义。⑥responses：响应格式定义（状态码、内容类型、schema）。⑦$ref：引用其他组件（schemas、responses等）。（5）集成到Express应用。【训练实例7-4】自动生成和展示API文档6.Express集成（6）启动服务器。在终端执行以下命令启动服务器：nodeapp.js（7）访问SwaggerUI。打开浏览器，输入网址http://localhost:3000/api-docs，按【Enter】键，进入图7-2所示的“用户管理系统API文档”页面。（8）测试接口。①GET用户列表。在SwaggerUI中，找到“GET/users获取所有用户”接口。依次单击“Tryitout”→“Execute”按钮，查看返回的模拟用户列表。②POST创建用户。在SwaggerUI中，找到“POST/users创建新用户”接口。单击“Tryitout”按钮，然后输入请求体。【训练实例7-4】自动生成和展示API文档6.Express集成统一错误处理功能通过错误处理中间件集中管理异常，避免重复编写错误处理代码，提升API的健壮性和一致性。错误处理中间件的特点如下。①

必须包含4个参数（err、req、res、next）。②

需注册在所有路由之后。③

可通过next(error)将错误传递给下一个错误处理中间件。④

支持异步错误捕获（结合express-async-errors包）。统一错误处理

6.Express集成【操作要求】编写程序，构建Express应用中的错误处理机制，主要包括错误处理中间件（errorHandler.js）、注册错误处理中间件（app.js）和路由中触发错误（控制器代码）。【实现过程】（1）在文件夹Unit07中创建子文件夹case0705，按照以下项目结构创建所需的子文件夹和文件。（2）创建数据库配置文件database.js。在数据库配置文件database.js中编写如下代码，配置Sequelize连接，这里以SQLite为例，便于测试。（3）创建文件index.js。（4）创建User模型文件User.js。（5）创建文件errorHandler.js，定义错误处理中间件。（6）创建路由文件userRoutes.js。【训练实例7-5】构建Express应用中的错误处理机制7.安全与性能优化HTTPS通过传输层安全协议/安全套接层（TransportLayerSecurity/SecureSocketsLayer，TLS/SSL）加密客户端与服务器间的通信，防止数据被窃听或篡改，证书用于验证服务器身份。实例：Nginx配置HTTPS。Nginx示例代码：HTTPS配置与证书管理7.安全与性能优化浏览器出于安全限制，禁止前端向非同源域名发送请求。CORS允许服务器通过响应头声明“允许哪些域名访问自己的资源”。关键配置项说明如下。①origin：允许访问的域名，设为*会禁用credentials（无法携带Cookie）。②methods：允许的HTTP方法。③allowedHeaders：允许的请求头。④credentials：是否允许发送身份凭证，设为true时，origin必须指定具体域名，不能设为*。⑤maxAge：预检请求的缓存时间，避免频繁发送OPTIONS请求，单位为秒。CORS配置7.安全与性能优化数据库连接池参数应根据数据库服务器配置调整，如MySQL推荐max_connections不超过500。负载均衡结合健康检查（如Nginx的health_check），自动隔离故障节点。1．数据库连接池：数据库连接优化连接池预先创建并管理一组数据库连接，避免频繁创建/销毁连接的开销，提升请求处理效率。2．负载均衡：请求分发优化数据库连接池与负载均衡7.安全与性能优化负载均衡：请求分发优化，将客户端请求分发到多个服务器，避免单节点过载，提升系统可用性和吞吐量。实例：Nginx负载均衡配置。Nginx示例代码：【验证示例7-8】创建JavaScript文件task0701.js，在该文件中编写代码实现完整的文件上传、文件下载、获取文件列表和删除文件功能，支持单个和多个文件上传。任务7-1文件上传与管理任务描述任务实施1．创建文件夹与JavaScript文件2．准备就绪与启动服务器3．测试API（1）上传单个文件。（2）上传多个文件。（3）获取文件列表。（4）下载文件。（5）删除文件。创建JavaScript文件task0702.js，在该文件中编写代码实现用户注册表单验证，支持多种验证规则和自定义验证逻辑。任务7-2用户注册表单验证与处理任务描述任务实施1．创建文件夹与JavaScript文件在文件夹Unit07中创建子文件夹task0702，在该子文件夹中创建JavaScript文件task0702.js，在