浏览器给服务器传递参数,最常用的是地址栏传参(get),以及表单提交(post)

先说get传参,就是在url后跟上?key=value&key2=value2......

但是按照前几篇的http服务器中,当我们访问localhost:3000/text?a=1时,服务器却返回了404页面

在终端打印出的request.url中是这样的:/text?a=1

这样当然匹配不到路由方法了,当然要返回404页面

首先我们要只取到?号以前的路径,再去想办法取到?号之后的参数,这样就不会返回404页面了

nodejs中有一个专门处理url的核心库,可以取地址栏上的各种值,下面来更改一下之前的http服务器代码,来取到url路径以及参数:

把整个服务器代码都考过来:

api.js:(未变动)

var server = require("./server");
var router = require("./router");
var handler = require("./handler"); var handle = {}; handle["/"]=handler.home;
handle["/home"]=handler.home;
handle["/review"]=handler.review;
handle["/api_records"]=handler.api_records;
handle["/text"]=handler.text; server.startServer(router.route,handle);

server.js:(有变动  变动的用红色字体标出)

var http = require("http");
var url = require("url"); var startServer = function(route,handle){
var onRequest = function(request,response){
var pathname = url.parse(request.url).pathname;//取到?号前面的url路径
console.log("request received"+pathname);
var params = url.parse(request.url,true).query;//取到url上?之后的内容 第二个参数是布尔值,true:格式化 false:非格式化 返回的是字符串形式的
route(handle,pathname,response,params); } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

router.js(有变动)

var fs = require("fs");

function route(handle,pathname,response,params){
console.log("Routing request for"+pathname);
if(typeof handle[pathname] === 'function'){
handle[pathname](response,params);
}else{
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/404.html","utf8").pipe(response);
}
} module.exports.route=route;

handler.js(有变动)

var fs = require("fs");

function home(response,params){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/index.html","utf8").pipe(response);
} function review(response,params){
response.writeHead(200,{"Content-Type":"text/html"});
fs.createReadStream(__dirname+"/review.html","utf8").pipe(response);
} function api_records(response,params){
response.writeHead(200,{"Content-Type":"application/json"});
response.end(JSON.stringify(params));
} function text(response,params){
response.writeHead(200,{"Content-Type":"text/plain;charset=UTF-8"});
response.end("文本内容");
} module.exports={
home,
review,
api_records,
text
}

上面代码就是关于应对get请求的全部更改,我们在handler.js中的api_records方法中,把取回来的params返回到了页面上,输入:localhost:3000/api_records?a=1&b=2

页面会展示出{a:1,b:2}

这样,我们在服务端获取到参数值后,可以根据参数值来返回给页面对应的内容!!!

下面说一下,怎么接受post传来的数据,我们以表单提交为例

在index.html中写上一个表单:

`<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>html</title>
<style>
div{
color:red;
font-size:50px;
}
</style>
</head>
<body>
<div>我是从服务器传回来的html页面</div>
<form action="/api_records" method="POST">
name:<input type="text" name="name">
age:<input type="text" name="age">
job:<input type="text" name="job">
<input type="submit" value="提交">
</form>
</body>
</html>

主要更改server.js中的代码就行;

var http = require("http");
var url = require("url");
var querystring = require("querystring");//解析post传过去的数据,以防乱码 var startServer = function(route,handle){
var onRequest = function(request,response){
var pathname = url.parse(request.url).pathname;//取到?号前面的url路径
console.log("request received"+pathname);
var data = "";
request.on("error",function(err){//请求发生错误时触发
console.error(err);
}).on("data",function(chunk){//请求接收到数据时触发
data+=chunk;
}).on("end",function(){//请求结束后触发
if(request.method === "POST"){
route(handle,pathname,response,querystring.parse(data));
}else if(request.method === "GET"){
var params = url.parse(request.url,true).query;//取到url上?之后的内容 第二个参数是布尔值,true:格式化 false:非格式化 返回的是字符串形式的
route(handle,pathname,response,params);
}
}) } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

这样在 请求接收到之后,可以冲request.method中判断是get还是post请求,若是get,就把params响应回去,若是post就把data响应回去!!!

接收post传来的数据还有一种写法,把data定义成数组,然后在request接收数据时,将chunk挨个push进去,然后用Buffer.concat()方法将data片段合并,取字符串:

var http = require("http");
var url = require("url");
var querystring = require("querystring");//解析post传过去的数据,以防乱码 var startServer = function(route,handle){
var onRequest = function(request,response){
var pathname = url.parse(request.url).pathname;//取到?号前面的url路径
console.log("request received"+pathname);
var data = [];
request.on("error",function(err){//请求发生错误时触发
console.error(err);
}).on("data",function(chunk){//请求接收到数据时触发
data.push(chunk);
}).on("end",function(){//请求结束后触发
if(request.method === "POST"){
data = Buffer.concat(data).toString();
route(handle,pathname,response,querystring.parse(data));
}else if(request.method === "GET"){
var params = url.parse(request.url,true).query;//取到url上?之后的内容 第二个参数是布尔值,true:格式化 false:非格式化 返回的是字符串形式的
route(handle,pathname,response,params);
}
}) } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

如果浏览器端发送给服务端的数据量很大的话,可以把这个请求取消掉:

server.js:

var http = require("http");
var url = require("url");
var querystring = require("querystring");//解析post传过去的数据,以防乱码 var startServer = function(route,handle){
var onRequest = function(request,response){
var pathname = url.parse(request.url).pathname;//取到?号前面的url路径
console.log("request received"+pathname);
var data = [];
request.on("error",function(err){//请求发生错误时触发
console.error(err);
}).on("data",function(chunk){//请求接收到数据时触发
data.push(chunk);
}).on("end",function(){//请求结束后触发
if(request.method === "POST"){
if(data.length>1e6){//若post发送给服务端数据量很大时,将请求取消
console.log(data.length);
request.connection.destroy();
}
data = Buffer.concat(data).toString();
route(handle,pathname,response,querystring.parse(data));
}else if(request.method === "GET"){
var params = url.parse(request.url,true).query;//取到url上?之后的内容 第二个参数是布尔值,true:格式化 false:非格式化 返回的是字符串形式的
route(handle,pathname,response,params);
}
}) } var server = http.createServer(onRequest);
//最后让服务器监听一个端口
server.listen(3000,"127.0.0.1");//还可以加第二个参数 127.0.0.1代表的是本地 console.log("server started on localhost port 3000");//加一个服务器启动起来的提示
} module.exports.startServer=startServer;

如果我们想要使用别人编写好的express服务器框架,

可以执行:

npm install express

来安装express框架,

按住那个完后,项目中会出现node_modules文件夹,里面放着依赖文件,当我们用require()引入库时,就会来这个文件递归查找,不用我们写详细路径

npm官网:www.npmjs.com  里面海量资源,等着你去用,可以在里面查看各种包的用法

当我们想知道我们的node项目中到底引入了哪些npm包时,我们很希望有一个文件去显示这些安装过的包名称,做一个记录,package.json就是你想要的文件:

我们执行

npm init

就会出现这个package.json文件,运行过这个命令后,会问一些问题,项目名称啊,版本啊,git地址啊等,直接一路回车就行!!

一般这个npm init命令是来初始化一个项目的,初始化之后就会出现package.json文件

比如上面的,我们想使用express框架,我们可以执行

npm install --save express

这样,安装的express版本号 名称 就会记录在package.json文件中

注意,npm init  要在npm install --save express之前执行,这样项目中才会出现node_modules文件夹

最后说一下nodemon工具,它可以监听自己的服务器项代码改变,如果代码改变,会自动重启服务器,不用自己再去手动重启服务器了

安装

npm install -g nodemon

之前我们是用node app来启动服务器的

但是现在我们可以使用 nodemon app来启动服务器,这样当我们代码发生改变时,服务器会自动重启!!!

nodejs中http服务器,如何使用GET,POST请求发送数据、npm、以及一些插件的介绍的更多相关文章

  1. sql server 中不同服务器上的数据库中表怎么互导数据

    --创建一个链接 EXEC sp_addlinkedserver 'OtherServerDb','','SQLOLEDB','192.168.12.101' --第一个参数是给远程的服务器起的别名 ...

  2. 本地主机作服务器解决AJAX跨域请求访问数据的方法

    近几天学到ajax,想测试一下ajax样例,由于之前在阿里租用的服务器过期了,于是想着让本地主机既做服务器又做客户端,只是简单地测试,应该还行. 于是,下载了xampp,下载网址http://www. ...

  3. nodeJs中创建服务器

    var http=require('http'); var httpObj=http.createServer(function(req,res) { console.log('someBody:' ...

  4. .Net“/”应用程序中的服务器错误 超过了最大请求长度 错误解决办法

    错误如下: 错误提示: 说明: 执行当前 Web 请求期间,出现未处理的异常.请检查堆栈跟踪信息,以了解有关该错误以及代码中导致错误的出处的详细信息. 异常详细信息: System.Web.HttpE ...

  5. nodeJS中express框架设置全局跨域请求头

    //设置跨域请求头 router.all('*', function(req, res, next) { res.header("Access-Control-Allow-Origin&qu ...

  6. SSH服务器与Android通信(1)--服务器端发送数据

    很多应用要求SSH服务器不仅和PC通信,还要和Android移动设备通信,这时就需要用到JSON了.其基本原理是服务器将数据转换成JSON格式,发送给Android客户端,客户端再将JSON格式的数据 ...

  7. nodejs创建http服务器

    之前有简单介绍nodejs的一篇文章(http://www.cnblogs.com/fangsmile/p/6226044.html) HTTP服务器 Node内建有一个模块,利用它可以很容易创建基本 ...

  8. FTP-Linux中ftp服务器搭建

    一.FTP工作原理 (1)FTP使用端口 [root@localhost ~]# cat /etc/services | grep ftp ftp-data 20/tcp #数据链路:端口20 ftp ...

  9. Linux中ftp服务器搭建

    一.FTP工作原理 (1)FTP使用端口 [root@localhost ~]# cat /etc/services | grep ftp ftp-data 20/tcp #数据链路:端口20 ftp ...

随机推荐

  1. PHP关于VC11,VC9,VC6以及Thread Safe和Non Thread Safe版本选择的问题

    这里是我在搭建php环境时收集的资料供大家参考: 现在PHP官网上下载PHP安装包都有VC11或VC9的字样,这是什么含义,我们应该下载哪种安装包更好呢?其实PHP官网给出了答案: VC6版本是使用V ...

  2. archive_lag_target参数

    需求,由于一套生产环境归档日志切换频率过低,建议修改参数,使其间隔一定时间周期自动切换生成归档日志; SQL>; THREAD# SEQUENCE# TO_CHAR(COMPLETION_TIM ...

  3. Sharding-Jdbc 插件应用

    Sharding-Jdbc介绍 Sharding-Jdbc在3.0后改名为Shardingsphere它由Sharding-JDBC.Sharding-Proxy和Sharding-Sidecar(计 ...

  4. Senparc.Weixin+nginx配置之坑 ‘10003 redirect_uri域名与后台不一致’

    微信公众号扫一扫功能提示:10003 redirect_uri域名与后台不一致 Senparc.Weixin组件很好用,但一个坑,不知道这和个是否有关.. 先说明下环境,centos+.net cor ...

  5. VBA学习资料分享-6

    从网上抓取数据到EXCEL中是VBA的一个常用之处,今天分享下VBA网抓的一些套路,主要有以下几种: 第一种:msxml2.xmlhttp/Microsoft.XMLHTTP/WinHttp.WinH ...

  6. Script text 属性

    参考 Script text 属性

  7. Android高版本收不到静态注册的广播

    Beginning with Android 8.0 (API level 26), the system imposes additional restrictions on manifest-de ...

  8. ES6 Proise 简单理解

    Promise 这是ES6中增加的一个处理异步的对象. 传统变成写异步函数的时候,经常会遇到回调套回调: Promise 是异步编程的一种解决方案,比传统的解决方案 -----回调函数和事件----- ...

  9. mysql控制台常用命令

    登录: D:\seegot\mysql5.5.36\bin> mysql -uroot -proot Welcome to the MySQL monitor. Commands end wit ...

  10. Bind Mounts and File System Mount Order

         When you use the bind option of the mount command, you must be sure that the file systems are m ...