课程来源:https://www.shiyanlou.com/courses/393【@实验楼】
第1节 服务器的请求和响应
一、开发准备
二、实验步骤
2.1 Hello World

server.js

运行

结果
2.2 代码模块化

server.js 重构

server.js 封装成一个模块

index.js

运行

结果
2.3 实现路由
2.3.1 获取URL

server.js

运行及结果

url == /login

url == /upload
2.3.2 编写 router.js
2.3.3 整合路由和服务器

server.js

index.js

运行及结果

运行及结果
2.4 事件处理
2.4.1 打通路

requestHandlers.js

index.js

server.js

router.js
2.4.2 完善

requestHandlers.js

router.js

server.js

运行及结果

url == /start

url == /upload

url == /foo
第2节 解决服务器的阻塞操作
一、阻塞操作

修改 requestHandlers.js 的 start()
1.1 先访问 /upload,再访问 /start

运行及结果
- /upload 马上返回了
- /start 等待了10秒才返回
1.2 在访问 /start 的时候,马上打开另外一个tab来访问 /upload
二、解决阻塞操作

修改 requestHandlers.js 的 start

运行及结果
说明exec起作用了
之前我们都是直接将这些处理响应的代码放到server.js中的,而为了解决操作阻塞,我们将这些响应的代码放到了exec的回调函数了,这样就不会影响到upload方法了

修改 server.js 的 start 的 onRequest

router.js

requestHandlers.js

运行及结果

浏览器端运行及结果
当请求http://localhost:8888/start的时候,会花10秒钟的时间才载入,而当请求http://localhost:8888/upload的时候,会立即响应,纵然这个时候/start响应还在处理中。
第3节 处理表单输入
一、处理表单

修改 requestHandlers.js 的 start

运行及结果
接下来实现:当用户提交表单时,触发/upload请求处理程序处理POST请求。

修改 server.js 的 start 的 onRequest

修改 router.js

i修改 requestHandlers.js 的 upload

运行及结果

/start 输入 shiyanlou,点 Submit 按钮

自动跳转到 /upload
二、图片处理

requestHandlers.js 增加 /show

在 index.js 注册 /show

运行及结果

浏览器结果

修改 requestHandlers.js 的 body

运行及结果

修改 server.js 的 start 的 onRequest

修改 router.js

修改 requestHandlers.js 的 upload

运行及结果

浏览选择图片,点击 Upload File 上传

自动跳转到 /upload
结束啦~~~~~~最后附上 keke 帅照!
网友评论