node.js 初学 —— http fs 服务器/文件/post get

  这个世界,从来不会给失败者颁奖!  


了解 node.js (开源)

  node.js 是用来做后台开发的,但是现在大部分前端人员也要掌握一定的 node.js 知识。

  主要学习 node.js 的基础用法,模块,自定义。

  JavaScript 主要用作前端。node.js 专注于后台, 与 JavaScript 差不多,语法基本一样。

  后台:python  java  PHP 等等。


为什么会出现 node.js 呢?

  1、性能高。比如 node.js 比 PHP 性能高出86倍。

  2、与前台 JS 配合起来相当方便。node.js 全面取代 python ,PHP ,java 不可能。

  3、NodeJS 更便于前端程序员学习。


node 安装运行

node.js 官网:https://nodejs.org

  

安装完 node.js 可以使用命令行操作(cmd)

  - 输入 node,进入环境

  - 输入 ctrl + C 终止程序

node.js 也是 js ,没有太大区别。

后台纯程序,只有代码,没有界面,只需要 js 文件。

cmd 操作:

  1. 切换盘符  e:

  2. 改变目录  cd 目录名

  3. 执行程序  node xxx.js


 JavaScript 能用的 ,node.js 都能用

// 输出
console.log('asdfg'); var oDate = new Date();
// 获取时间
console.log(oDate.getFullYear()); // 正则表达式
var re = /\d+/g;
console.log("asfdsvdsvn 65dfs4vg6d5r".match(re));

  


如何用 node.js 写一些真正有价值的东西 —— 服务器

一个真正的服务器最基本的目标 —— 别人可以访问他。

任何浏览器和服务器之间的通信都是通过 http 访问的,http 是一种协议,即双方都必须遵守的规范。

node.js 官方手册:https://nodejs.org/dist/latest-v8.x/docs/api/

编写一个小服务器:

// 编写一个服务器

// 引用一个http模块
var http = require("http");
// 创建一个服务器
var server = http.createServer(function (req, res) {
// request 请求:请求输入进来的信息, response 响应:输出给浏览器的东西
console.log(req.url); // 获得请求的url
/*
/index.html 请求url
/favicon.ico 请求图标 自动的
*/ switch (req.url) {
case '/1.html':
// 返回数据
res.write("1");
break;
case '/2.html':
// 返回数据
res.write("2");
break;
case '/3.html':
// 返回数据
res.write("3");
break;
} // 结束返回
res.end();
}); // 监听 —— 等着别人来访问。
// listen(端口)
server.listen(8080);


向浏览器返回文件

如何进行文件操作 —— fs   :File Ststem

  fs 官方文档:https://nodejs.org/dist/latest-v8.x/docs/api/fs.html

    fs.readFile(文件名,回调函数二人,(err,data))  :读文件

    fs.writeFile(文件名,内容,回调函数(err)) :写文件

异步 VS 同步

  异步:多个操作同时进行,前一次操作没完成,后一次也可以开始。

  同步:一次一个,前一次没完成,后边的等着。

读写文件

    

aaa.text

42313
fdvdfvd
6546465vdsvs
vsdvs16556

fs.js

const fs = require('fs');

// readFile(文件名,回调函数)
// 异步操作
// 读取文件内容
/**
* aaa.txt 文件内容
* 42313
* fdvdfvd
* 6546465vdsvs
* vsdvs16556
*/
fs.readFile('aaa.txt',function(err,data){
// console.log(err); // 读取文件是否出错 none
if(err){
console.log('读取文件失败!');
}else{
//console.log(data); // 获得二进制数据
//<Buffer 34 32 33 31 33 0d 0a 66 64 76 64 66 76 64 0d 0a 36 35 34 36 34 36 35 76 64 73 76 73 0d 0a 76 73 64 76 73 31 36 35 35 36>
console.log(data.toString()); // 转字符串
//
// fdvdfvd
// 6546465vdsvs
// vsdvs16556
}
}); // 写文件
// writeFile(文件名,内容,回调函数) fs.writeFile('bbb.txt','wangjiawei',function(err){
console.log(err); // 打印是否出错!
// 文件写入成功,生成bbb.txt,内容为 wangjiawei。
});

bbb.txt

wangjiawei

向浏览器返回 HTML 文件

  

1.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>1.html</title>
</head>
<body>
<h2>这是1.html</h2>
</body>
</html>

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>
js学习
</title>
</head> <body>
<h1>
欢迎光临,node.js 的学习
</h1>
</body> </html>

 server.js 文件

const http = require('http');

const fs = require('fs');

var server = http.createServer(function (req, res) {
// req.url -> /index.html
// 读取 -> ./www/index.html
// './www'+req.url
var file_name = './www' + req.url;
// 读取并返回文件
fs.readFile(file_name, function (err, data) {
if (err) {
res.write('404'); // 返回 404 错误!
} else {
res.write(data); // 返回数据
}
res.end(); // 结束返回
});
}); server.listen(8080);

  


服务器接收前台的请求  —— GET / POST

数据请求方式:

  前台:form 、ajax 、json 等。

  后台:处理方式一样。

前台和后台交互只有一种协议:http通信。只是方式不同。

请求方式:

  - GET :数据在url中

  - POST :数据不在url中

  

GET 方式

直接从 req.url 中拿,url.parse(路由,true)

  QueryString 官方文档:https://nodejs.org/dist/latest-v8.x/docs/api/querystring.html  用于解析get请求参数

querystring 小案例

const querystring = require('querystring');

// 转换成小json数据
var json = querystring.parse('user=blue&pass=123&age=18'); console.log(json);

向后台发送GET数据案例:

  

form.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>GET 方式传输数据</title>
</head> <body>
<form action="http://localhost:8080/aaa/" method="GET">
用户名:
<input type="text" name="user" value="">
<br> 密码:
<input type="password" name="pass" value="">
<br>
<input type="submit" value="提交">
</form>
</body> </html>

server.js

const http = require('http');
const querystring = require('querystring'); http.createServer(function (req, res) {
var GET = {};
if (req.url.indexOf('?') != -1) {
console.log(req.url);
// 用 ? 拆分路由
var arr = req.url.split('?');
// url 存取路径
var url = arr[0];
// arr[1]中存取数据,转换成json
GET = querystring.parse(arr[1]);
}else{
var url = req.url;
}
console.log(url,GET);
// req 来获取前台请求数据
res.write("aaa");
res.end();
}).listen(8080);

  

优化

URL模块官方文档:https://nodejs.org/dist/latest-v8.x/docs/api/url.html  专门用来解析路由地址的。

url模块小案例

const urlLib = require('url');

// true解析query部分。
var obj = urlLib.parse("http://www.wangjiawei.com/index.html?user=wjw&pwd=123",true);
console.log(obj.pathname,obj.query);

  

浏览器向后台传输GET数据案例

const http = require('http');
const urlLib = require('url'); http.createServer(function (req, res) {
// 解析路由地址
var obj = urlLib.parse(req.url,true);
// 获取地址
var url = obj.pathname;
// 获取数据
var GET = obj.query;
// 打印
console.log(url,GET);
// req 来获取前台请求数据
res.write("aaa");
res.end();
}).listen(8080);

  

POST 方式

  

POST 数据接收:POST数据比GET大得多!

因为POST接收的数据很大,可以一次性发完,也可以切成一小段一段一段的发送。

  req.on('data', function (data) {});
  req.on('end', function (data) {});

    data —— 一段数据到达

    end —— 全部数据到达

 案例代码:

目录结构

  

form.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>POST传输数据</title>
</head> <body>
<form action="http://localhost:8080/aaa" method="POST">
用户名:
<input type="text" name="user" id="">
<br> 密 码:
<input type="password" name="pass" id="">
<br>
<input type="textarea" name="content" row="8" cols="40">
<br>
<input type="submit" value="提交">
<br>
</form>
</body> </html>

server.js 文件

// POST 数据接收
var http = require('http');
// 新建一个服务
http.createServer(function (req, res) {
// post 数据从 req 中获取
var str = ''; //用于组成接收的最终数据,等着拼接
var i = 0; // 写个数,看多少次接收数据。
req.on('data', function (data) {
// data —— 每当有一段数据达到运行一次(很多次)
// function 中的 data 为接收的那段数据,可以去别的名字。
i++;
console.log("第"+i+"次收到数据");
str += data;
}); // on可以理解为事件
req.on('end', function () {
// end —— 数据全部到达運行(只发生一次)
console.log(str);
}); // on可以理解为事件

}).listen(8080);

  

  

POST数据根据数据量大小来分,如果传输的数据量太大,它就会咔咔给我分段传输。

注意:上边的案例是使用字符串接收的,那样不是很好,因为有些时候前端可能传输图片和文件,就需要二进制接收,不能用字符串,以后再讲···

 解析传输过来的数据

// POST 数据接收
var http = require('http');
const querystring = require('querystring');
// 新建一个服务
http.createServer(function (req, res) {
// post 数据从 req 中获取
var str = ''; //用于组成接收的最终数据,等着拼接
var i = 0; // 写个数,看多少次接收数据。
req.on('data', function (data) {
// data —— 每当有一段数据达到运行一次(很多次)
// function 中的 data 为接收的那段数据,可以去别的名字。
i++;
console.log("第"+i+"次收到数据");
str += data;
}); // on可以理解为事件
req.on('end', function () {
// end —— 数据全部到达運行(只发生一次)
// 解析数据
var POST = querystring.parse(str);
console.log(POST);
}); // on可以理解为事件
}).listen(8080);

  


服务器项目代码总结

目录结构

  

main_server.js 文件

const http = require('http');
const fs = require('fs');
const querystring = require('querystring');
const urlLib = require('url'); var server = http.createServer(function (req, res) { // GET
var obj = urlLib.parse(req.url, true);
var url = obj.pathname;
const GET = obj.query;
// POST
var str = "";
req.on('data', function (data) {
str += data;
});
req.on('end', function () {
var POST = querystring.parse(str)
/**
* url 要的时那个文件
* GET get数据
* POST post数据
*/
// 打印一下
console.log(url, GET, POST);
});
// 文件请求 }).listen(8080);

form.html 文件 ( get 请求 )

<!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>POST传输数据</title>
</head> <body>
<form action="http://localhost:8080/aaa" method="get">
用户名:
<input type="text" name="user" id="">
<br> 密 码:
<input type="password" name="pass" id="">
<br>
<input type="submit" value="提交">
<br>
</form>
</body> </html>

  

  

 form.html 文件 ( post 请求 )

<!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>POST传输数据</title>
</head> <body>
<form action="http://localhost:8080/aaa" method="post">
用户名:
<input type="text" name="user" id="">
<br> 密 码:
<input type="password" name="pass" id="">
<br>
<input type="submit" value="提交">
<br>
</form>
</body> </html>

        

前端读取后台文件

目录结构

  

1.html 文件

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="main.css" />
<script src="main.js"></script>
</head>
<body>
<h1>这是1.html文件!</h1>
</body>
</html>

main_server.js 文件

const http = require('http');
const fs = require('fs');
const querystring = require('querystring');
const urlLib = require('url'); var server = http.createServer(function (req, res) { // GET
var obj = urlLib.parse(req.url, true);
var url = obj.pathname;
const GET = obj.query;
// POST
var str = "";
req.on('data', function (data) {
str += data;
});
req.on('end', function () {
var POST = querystring.parse(str)
/**
* url 要的时那个文件
* GET get数据
* POST post数据
*/
// 打印一下
console.log(url, GET, POST);
});
// 文件请求
var file_name = "./www" + url;
fs.readFile(file_name,function(err,data){
if (err) {
res.write("404");
}else
{
res.write(data);
}
res.end();
});

}).listen(8080);

  

  


node.js 初学(一)—— http fs 服务器/文件/post get的更多相关文章

  1. node.js 初学(二)—— 搭建注册/登录服务器

    node.js 初学(二)—— 搭建注册/登录服务器 理论上来说,代码实现在理论和实际上是一样的.但实际上来说,他们不是 做一个最简单的用户注册登录功能 1.接口定义: 注册:/user?act=re ...

  2. node.js 使用 UglifyJS2 高效率压缩 javascript 文件

    UglifyJS2 这个工具使用很长时间了,但之前都是在 gulp 自动构建 时用到了 UglifyJS 算法进行压缩. 最近玩了一下 UglifyJS2 ,做了一个 在线压缩javascript工具 ...

  3. Node.js初学

    Node.js 初学~ 其技术上最大的卖点是非阻塞的I/O和基于事件的异步处理机制. 后端没有什么深入研究,一直对其不是很了解. 透过一个例子看 非阻塞 与 通常的 阻塞 var text = rea ...

  4. 用Node.js原生代码实现静态服务器

    ---恢复内容开始--- 后端中服务器类型有两种 1. web服务器[ 静态服务器 ] - 举例: wamp里面www目录 - 目的是为了展示页面内容 - 前端: nginx 2. 应用级服务器[ a ...

  5. node.js 如何处理一个很大的文件

    node.js 如何处理一个很大的文件 思路 arraybuffer 数据分段 时间分片 多线程 web workers sevice workers node.js 如何处理一个很大的文件 http ...

  6. Fenix – 基于 Node.js 的桌面静态 Web 服务器

    Fenix 是一个提供给开发人员使用的简单的桌面静态 Web 服务器,基于 Node.js 开发.您可以同时在上面运行任意数量的项目,特别适合前端开发人员使用. 您可以通过免费的 Node.js 控制 ...

  7. node.js中net模块创建服务器和客户端(TCP)

    node.js中net模块创建服务器和客户端 1.node.js中net模块创建服务器(net.createServer) // 将net模块 引入进来 var net = require(" ...

  8. Node.js快速创建一个访问html文件的服务器

    var http = require('http'), // 引入需要的模块 fs = require('fs'), //引入文件读取模块 cp = require('child_process'), ...

  9. 用node.js实现简单的web服务器

    node.js实现web服务器还是比较简单的,我了解node.js是从<node入门>开始的,如果你不了解node.js也可以看看! 我根据那书一步一步的练习完了,也的确大概了解了node ...

随机推荐

  1. js动态规划---最少硬币找零问题

    给定钱币的面值 1.5.10.25 需要找给客户 36 最少找零数为: 1.10.25 function MinCoinChange(coins){ var coins = coins; var ca ...

  2. GO language

    看到有人说GO是未来10年的主流了,不论是速度迅速接近于C,还是语法简洁接近于C,结果尽然还是编译型的,不需要虚拟机,生成程序已经是本地字节码. 得,我不淡定了,这个不学,枉为程序员啊. 今天,讲讲l ...

  3. (已解决)Eclipse报错:Could not find XXX.apk. 没有Android项目命名. There is no android project named

    可能是你把当前项目设置为library项目了,按以下步骤切换回普通项目: 选择 Project->Properties 在左边的列表中,选择 Android 取消钩中"Is Libra ...

  4. (已解决)Xcode 换电脑提示 Could not attach to pid:“XXXX”错误

    在运行项目时出现了如下错误 (基本上重新启动项目即可) 紧接着再次运行又没有问题了. 稍微查询了一下得知,这个问题并不是由我们的操作引起的,有时就会莫名其妙的出现,但是有一些不同的情况 下面列出如何解 ...

  5. Linux基础(一)流程控制

    Shell 流程控制 if 语句语法格式1: 写成一行(适用于终端命令提示符):if [ $(ps -ef | grep -c "ssh") -gt 1 ]; then echo ...

  6. 201803020001-多重MACD图.png

  7. Hibernate框架第二天

    ### Hibernate的持久化类 ### ---------- **什么是持久化类** 1. 持久化类:就是一个Java类(咱们编写的JavaBean),这个Java类与表建立了映射关系就可以成为 ...

  8. notepad去掉空行

    选择替换,把查找模式设置为正则表达式,在查找框中自己输入 ^\s+  ,替换框留空,点“全部替换”,即可(先全选).注意:不要复制我的,自己输入,且用英文格式输入.

  9. Vue系列之 => 自定义全局指定让文本框自动获取焦点

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. mysql主从配置,读写分离

    Mysql主从配置,实现读写分离 大型网站为了软解大量的并发访问,除了在网站实现分布式负载均衡,远远不够.到了数据业务层.数据访问层,如果还是传统的数据结构,或者只是单单靠一台服务器扛,如此多的数据库 ...