post 方式提交一条新闻|学习笔记

简介: 快速学习 post 方式提交一条新闻

开发者学堂课程【Node.js 入门与实战post 方式提交一条新闻】学习笔记,与课程紧密联系,让用户快速学习知识

课程地址https://developer.aliyun.com/learning/course/588/detail/8283


post 方式提交一条新闻

 

当用户在客户端是用post方提交条新闻的时候,服务器是如何获取的?

新建一个文件

代码:

//表示 post 方提交条新闻

//1.读取data.json 文件中的数据

fs.readFile(path.join(__ dirname, ' data', ' data. json'), 'utf8', function (err, data) {

if (err && err.code !== ENOENT') {

throw err;

}

var list = JSON.parse(data || '[]');

// 2.获取用户post 提交的数据

//因为post 提交数据的时候,数据量可能比较大,所以会分多次

进行提交,每次提交一部分数据

//此时要想在服务器中获取用户提交的所有数据,就必须监听

request 事件的data 事件(因为每次浏览器提交一部分数据到浏览器就会触发一次data事件)

//那么,什么时候才表示浏览器把所有数据都提交到服务器了呢?

就是当request对象的end事件被触发的时候

//监听request的对象的data事件和end事件代码如下:

//声明一个数组,用来保存用户每次提交过来的数据

var array = [];

req.on('data', function (chunk) {

//此处的chunk 参数,就是浏览器本次提交过来的一部分数据// chunk 的数据类型是Buffer ( chunk就是一个Buffer对象)

array .push( chunk);

});

//监听request 对象的end事件

//当end事件被触发的时候,表示上所有数据都已经提交完毕

req.on('end', function () {

//在这个事件中只要把array中的所有数据汇总起来就好了

//把array 中的每个buffer 对象,集合起来转换为一个buffer 对象//title-ffffff&url=fffff&text=fffff

// {title: 'fffff', url: fffff', text: 'fffff'}

// JSON . parse();

var postBody = Buffer . concat (array);

// console . log (postBody) ;

//把获取到的buffer 对象转换为一个字符串

postBody = postBody. toString( 'utf8');

//把post 请求的查询字符串,转换为一个json 对象

postBody = querystring.parse(postBody);

//Console.log(postBody);

//将用户提交的新闻 push 到list中

list.push(postBody);

//将新的list数组,在写入到data.json 文件中

fs.writeFile(path.join(__ dirname, 'data', ' data . json'), JSON. stringify(list), function (err) {

if (err) {

throw err;

}

console.log('ok' );

//设置响应报文头,通过响应报文头告诉浏览器,执行一次页面跳转操作

// 3.跳转到新闻列表页

//重定向

res. statusCode = 302;

res. statusMessage = 'Found';

res . setHeader( 'Location', '/');

res.end();

});

});

在服务器端要想获取用户post提交的数据要执行两步,监听两个事件,第一监听request 对象的data事件(当数据量比较大,浏览器会一点一点向服务器上传数据,每次上传过来一部分数据会触发一次 request 对象的 data 事件。

每触发一次表示浏览器提交一次数据。),第二监听request对象的end 事件(end事件触发的时候,表示浏览器把所以数据都提交完。)

汇总的意思:

现在有一个array数据里面 保存了很多的Buffer对象,每个Buffer对象都是用户提交过来的一小部分数据,最后需要把这个数据保持成完整的数据。把array里面多个Buffer对象汇总成一个Buffer对象。 image.png

两个参数,第一个参数保存了一堆 Buffer 对象的数组。第二个数数组的长度(可传,可不传)

有一个数据里面保存了很多的小 Buffer 对象,通过 Buffer.concat 把数组传过来,把一堆的小 Buffer 转换成一个大 Buffer。

 image.png

一直在转,说明有问题。

需要给用户响应。

image.png

运行成功

在 nodejs 里面如何把一个用户请求的查询字符串转换为  json对象:用 nodejs 里面内置的

Query  String模块。

如何把 title=fffffff&urlffffff&text=ffffff 转换成json对象。

打开Query String,

 image.png

Query string.parse(str[,sep[,eq[,options]]]) 方法

 image.png

//1.加载http 模块

var http = require('http');

var fs = require('fs');

var path = require('path');

var mime = require(mime');

var url = require('url');

var querystring = require(querystring');

相关文章
|
JSON JavaScript 前端开发
form表单提交方式
form表单提交方式
107 0
|
5月前
|
前端开发 JavaScript API
网页自动提交Form表单的方法
在数字化时代,自动化任务如网页自动提交Form表单,能大幅提升效率。这涉及自动填写注册信息等场景。本文概述了多种实现方式:JavaScript可直接在前端自动填充并提交;Python结合Selenium模拟真实用户操作;AOKSend作为API工具发送表单数据;第三方工具如iMacros、AutoHotkey和Zapier提供非编程自动化选项。根据需求选择合适方法,可显著提升工作效能,减少重复性劳动。
|
7月前
获取form表单提交的内容
获取form表单提交的内容
|
前端开发
a标签以post方式提交
a标签以post方式提交
128 0
|
前端开发 JavaScript UED
【查漏补缺】fetch请求是可以取消的
【查漏补缺】fetch请求是可以取消的
806 0
【查漏补缺】fetch请求是可以取消的
|
测试技术 开发者
记一次给 docusaurus 官方提交 pull request 的过程
记一次给 docusaurus 官方提交 pull request 的过程
142 0
记一次给 docusaurus 官方提交 pull request 的过程
|
开发工具
使用wxjava实现发表内容、预览信息以及推送文章
使用wxjava实现发表内容、预览信息以及推送文章
306 0
使用wxjava实现发表内容、预览信息以及推送文章
|
JSON JavaScript 数据格式
封装获取用户 post 提交的数据的方法|学习笔记
快速学习封装获取用户 post 提交的数据的方法
封装获取用户 post 提交的数据的方法|学习笔记
|
JSON JavaScript 数据格式
get 方式提交新闻防止新闻被覆盖掉|学习笔记
快速学习 get 方式提交新闻防止新闻被覆盖掉
get 方式提交新闻防止新闻被覆盖掉|学习笔记
|
JSON JavaScript 数据格式
HackerNews05-通过使用url模块的parse方法获取用户get提交的数据|学习笔记
快速学习 HackerNews05-通过使用url模块的parse方法获取用户get提交的数据
HackerNews05-通过使用url模块的parse方法获取用户get提交的数据|学习笔记