一.fs模塊

1.1 fs讀取文件

//fs:file system 文件系統(tǒng)

//要使用一個(gè)模塊的話(huà)，必須先加載該模塊

// 1.加載模塊，得到一個(gè)模塊

const fs = require('fs')//建議名字和模塊名相同

// console.log(fs);

// read File --讀取文件

// fs.readFile(文件路徑，可選參數(shù),回調(diào)函數(shù)處理讀取的內(nèi)容);

fs.readFile('./demo.html', 'UTF-8',(err,data) =>{

//err 表示是否有錯(cuò)誤，有錯(cuò)誤的話(huà)，err表示錯(cuò)誤信息；沒(méi)有錯(cuò)誤err是undefined

if(err){

????console.log(err)//如果有錯(cuò)誤，輸出錯(cuò)誤

????return;//阻止后續(xù)代碼

}

????console.log(data);

})

fs讀取文件

1.2寫(xiě)入文件

// 1.加載fs模塊

const fs = require('fs');

// 2.調(diào)用writeFile方法，寫(xiě)入文件

// 該方法會(huì)將文件中原有的內(nèi)容覆蓋掉

// 該方法如果發(fā)現(xiàn)文件不存在則會(huì)自動(dòng)創(chuàng)建文件

// fs.writeFile(文件路徑，寫(xiě)什么內(nèi)容，回調(diào)函數(shù)查看是否有錯(cuò)誤)；

fs.writeFile('./demo1.txt','how are you',(err) =>{

????if(err){

????????console.log(err);

? ? ? }else{

????????????console.log('寫(xiě)入成功');

????????}

})

fs寫(xiě)入文件

二.querystring模塊

//使用模塊，先加載

const querystring = require('querystring');

//parse方法，是querystring對(duì)象中封裝的，和JSON.parse不是一個(gè)方法

// parse方法，是將查詢(xún)字符串 轉(zhuǎn)成js對(duì)象

let result = querystring.parse('id=456&name=zhangsan&age=20')

console.log(result);//輸出內(nèi)容{ id: '456', name: 'zhangsan', age: '20' }

console.log(querystring.stringify(result));

querystring方法

三.url模塊

3.1?舊的url

// 使用模塊，先加載

const url = require('url');

const querystring = require('querystring');

// parse用來(lái)解析url的一個(gè)方法

let res = url.parse('http://www.baidu.com:80/test.html?id=123&age=20')

console.log(res);

//獲取參數(shù)：console.log(res.query);

// 轉(zhuǎn)成對(duì)象

console.log(querystring.parse(res.query));

url模塊

3.2?新的url

// 新的api方法

const myUrl = new URL('http://www.baidu.com:80/test.html?id=123&age=20');

console.log(myUrl);//是一個(gè)解析后的對(duì)象，包含了url的各個(gè)組成部分console.log(myUrl.searchParams);//URLSearchParams { 'id' => '123', 'age' => '20' }

// 獲取id參數(shù):必須調(diào)用searchParams對(duì)象中的get方法來(lái)獲取

console.log(myUrl.searchParams.get('id'))

url模塊

四.http模塊（主要）

http服務(wù)器處理模塊，可以使用http模塊搭建一個(gè)服務(wù)器

http是一個(gè)系統(tǒng)模塊，讓我們能夠通過(guò)簡(jiǎn)單的流程創(chuàng)建一個(gè)web服務(wù)器

4.1?搭建web服務(wù)器

//使用http模塊搭建服務(wù)器

// 1.加載http模塊

const http = require('http');

// 2.調(diào)用http模塊中的createServer方法，創(chuàng)建服務(wù)器

const server = http.createServer();

// 3.啟動(dòng)服務(wù)器，并且要為服務(wù)器設(shè)置端口

server.listen(3000,() =>{

? ?????????? console.log('服務(wù)器啟動(dòng)了')

});//監(jiān)聽(tīng)端口

// 4.添加request事件，用于處理所有的http請(qǐng)求

server.on('request',() =>{

? ?????????? console.log('你的請(qǐng)求收到了');

})

使用http模塊搭建服務(wù)器

4.2?對(duì)瀏覽器的請(qǐng)求做出響應(yīng)

? ? 當(dāng)收到瀏覽器的請(qǐng)求后，會(huì)觸發(fā)request事件，其實(shí)就是觸發(fā)request事件的處理函數(shù)（該函數(shù)有兩個(gè)核心參數(shù)request和response）

//使用http模塊搭建服務(wù)器

// 1.加載http模塊

const http = require('http');

// 2.調(diào)用http模塊中的createServer方法，創(chuàng)建服務(wù)器

const server = http.createServer();

// 3.啟動(dòng)服務(wù)器，并且要為服務(wù)器設(shè)置端口

server.listen(3000,() =>{

????????console.log('服務(wù)器啟動(dòng)了')

});//監(jiān)聽(tīng)端口

// 4.添加request事件，用于處理所有的http請(qǐng)求

server.on('request',(req,res) =>{

????????// 事件處理函數(shù)有兩個(gè)參數(shù)

? ? ? ?// 參數(shù)1：表示request，所有和請(qǐng)求相關(guān)的信息，都可以通過(guò)request對(duì)象來(lái)接收

? ? ? ?// 參數(shù)2:表示response，所有和響應(yīng)相關(guān)的信息，都可以使用response對(duì)象來(lái)處理

????????console.log('你的請(qǐng)求收到了');

????????//通過(guò)res.setHeader()方法，來(lái)設(shè)置響應(yīng)頭

????????????res.setHeader('Content-Type','text/html;charset=utf-8')

????????//通過(guò)res對(duì)象的一個(gè)方法end來(lái)對(duì)瀏覽器做出響應(yīng)

????????//res.end()方法的作用，是將響應(yīng)報(bào)文(響應(yīng)行、響應(yīng)頭、響應(yīng)體)返回給瀏覽器

????????????res.end('請(qǐng)求收到了');

})

對(duì)瀏覽器的請(qǐng)求做出響應(yīng)

4.3對(duì)瀏覽器的請(qǐng)求做出響應(yīng),返回html

const http = require('http');

const fs = require('fs');

//調(diào)用createServer

const sever = http.createServer();

//注冊(cè)request，監(jiān)視瀏覽器的請(qǐng)求

sever.on('request',(req,res)=>{

????????// 當(dāng)有請(qǐng)求過(guò)來(lái)，則去讀取demo，html文件并將讀取的結(jié)果返回給瀏覽器

????????fs.readFile('./demo.html','utf-8',(err,data)=>{

????????????????????if(err){

????????????????????????????????return console.log(err);//輸出錯(cuò)誤信息并終止程序繼續(xù)執(zhí)行

????????????????????}

????????????????????????????????// 如果讀文件沒(méi)有錯(cuò)誤，則將讀取的內(nèi)容data返回給瀏覽器 ????????????????????????????????res.setHeader('Content-Type','text/html;charset=utf-8')

????????????????????????????????res.end(data);

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? })

????????})

????????sever.listen(4000,()=>console.log('sever start'))

返回html

4.4?根據(jù)不同的url做出不同的響應(yīng)

const http = require('http');

const server = http.createServer();

server.listen(5000,() => console.log('開(kāi)始啟動(dòng)'));

server.on('request',(req,res) => {

????????// console.log(req);

? ? ? ?/* req.url 表示請(qǐng)求的url，形如/index.html req.method 表示請(qǐng)求方式，比如GET req.headers 表示所 有的請(qǐng)求頭，是一個(gè)對(duì)象 */

????????let url = req.url

????????//判斷，根據(jù)url返回信息

????????if(url === '/index.html'){

????????????????//讀取index.html 并返回內(nèi)容

????????????????res.setHeader('content-type','text/html;charset=utf-8')

????????????????res.end('請(qǐng)求的是index.html')

????????????}else if(url === '/getMsg'){

????????????????????????res.setHeader('content-type','text/html;charset=utf-8')

????????????????????????res.end('請(qǐng)求的是getMsg接口')

????????}else{

????????????????//服務(wù)器沒(méi)有瀏覽器請(qǐng)求的文件或借口

????????????????res.setHeader('content-type','text/html;charset=utf-8')

????????????????res.statusCode = 404;

????????????????res.end('你請(qǐng)求的文件不存在');

????????}

????})?

根據(jù)不同的url做出不同的響應(yīng)

4.5 處理瀏覽器POST方式提交的數(shù)據(jù)

const http = require('http');

const server = http.createServer()

server.listen(8000,() => console.log('服務(wù)啟動(dòng)'));

server.on('request',(req,res) => {

? ? //首先判斷，請(qǐng)求是否是POST請(qǐng)求

? ? if(req.method ==='POST' && req.url === '/addMsg'){

? ? ? ? // console.log(12354);

? ? ? ? //服務(wù)器端接收數(shù)據(jù)的時(shí)候，是分段接收的

? ? ? ? //需要data事件，將瀏覽器發(fā)送過(guò)來(lái)的數(shù)據(jù)，拼接到一起

? ? ? ? let str = '';

? ? ? ? req.on('data',(chunk) => {

? ? ? ? ? ? str += chunk;

? ? ? ? });

? ? ? ? //如果已經(jīng)將全部數(shù)據(jù)接收到了，則觸發(fā)另外end事件，在這個(gè)事件中，就可以獲取到所有的數(shù)據(jù)

? ? ? ? req.on('end',() => {

? ? ? ? ? ? console.log(str);

? ? ? ? })

? ? }

})

?處理瀏覽器POST方式提交的數(shù)據(jù)

4.6?處理靜態(tài)資源

const http = require('http');

const fs = require('fs');

const server = http.createServer();

server.listen(5000,() => console.log('服務(wù)器啟動(dòng)'));

server.on('request',(req,res) => {

? ? //判斷請(qǐng)求的是index.html，則讀取文件，并返回內(nèi)容

? ? if(req.url === '/index.html'){

? ? ? ? fs.readFile('./index.html','utf-8',(err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data);

? ? ? ? });

? ? }else if(req.url === '/index.css'){

? ? ? ? fs.readFile('./index.css','utf-8',(err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data)

? ? ? ? })

? ? }else if(req.url === '/171605405.jpg'){

? ? ? ? fs.readFile('./171605405.jpg',(err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data)

? ? ? ? })

? ? }

})

處理靜態(tài)資源

4.6.1?處理靜態(tài)資源，若多個(gè)圖片和css文件時(shí)，如何處理

const http = require('http');

const fs = require('fs');

const server = http.createServer();

server.listen(5000,() => console.log('服務(wù)器啟動(dòng)'));

server.on('request',(req,res) => {

? ? //判斷請(qǐng)求的是index.html，則讀取文件，并返回內(nèi)容

? ? if(req.url === '/index.html'){

? ? ? ? fs.readFile('./index.html','utf-8',(err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data);

? ? ? ? });

? ? }else if (req.url.endsWith('.css')){

? ? ? ? fs.readFile('.' + req.url , (err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data)

? ? ? ? })

? ? }else if(req.url.endsWith('.jpg') || req.url.endsWith('.png')){

? ? ? ? fs.readFile('.' + req.url , (err,data) => {

? ? ? ? ? ? if(err){

? ? ? ? ? ? ? ? return console.log(err);

? ? ? ? ? ? }

? ? ? ? ? ? res.end(data)

? ? ? ? })

? ? }

})

多個(gè)圖片和css處理