nodejs之http、fs、querystring模組實現網頁與伺服器的互動
一.實現瀏覽器端請求之後，伺服器響應開啟相應的靜態網頁內容：
思路：直接通過瀏覽器端輸入的url值來判斷，從而顯示出該url對應的網頁的內容。直接在配置伺服器的js程式碼裡寫出靜態頁面的內容：
//前端頁面和伺服器未分離
var http = require('http');//使用node提供的http模組
var server = http.createServer(function(req,res){//建立webserver
//req是客戶端（瀏覽器）傳來的引數，包含method、url、head等一些屬性
//res是伺服器對客戶端的一些響應
console.log(req.method);
console.log(req.url);
if 開啟cmd，啟動伺服器
開啟瀏覽器，輸入請求的url,
各個url對應的頁面之間也可以互相轉化：
此時會發現cmd裡打印出了請求的url:
二.將網頁檔案和伺服器js檔案相分離，此時就要用到node的fs（file system)模組，瀏覽器傳送請求時，再通過fs將html檔案讀入：
//前端頁面和伺服器分離
var http = require('http');//匯入node提供的http模組
var fs = require('fs'); //匯入node提供的filesystem模組，用它的屬性來進行檔案操作
var app = http.createServer(function(req,res){//建立webserver
//req是客戶端（瀏覽器）傳來的引數，包含method、url、head等一些屬性
//res是伺服器對客戶端的一些響應
if(req.method === 'GET' ){
switch(req.url){
case '/index.html':
fs.readFile('../index.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'text/html'});
res.write(data.toString());
res.end();
});
break;
case '/add.html':
fs.readFile('../add.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'text/html'});
res.write(data.toString());
res.end();
});
break;
case '/remove.html':
fs.readFile('../remove.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'text/html'});
res.write(data.toString());
res.end();
});
break;
case '/find.html':
fs.readFile('../find.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'text/html'});
res.write(data.toString());
res.end();
});
break;
case '/edit.html':
fs.readFile('../edit.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'text/html'});
res.write(data.toString());
res.end();
});
break;
default :
var html = '<html><head><meta charset="UTF-8"><title></title></head><body>' +
'404 not found!</body></html>';
res.writeHeader(404,{'Content-Type':'text/html'});
//res.setHeader('Content-Encoding','utf8');
res.end(html);
}
}else{
console.log('not support!');
}
}).listen(2333);其他的幾個頁面分別編寫，此時的目錄結構是：
開啟cmd啟動伺服器：
開啟瀏覽器訪問：
各個頁面之間可以互相切換
三.伺服器響應瀏覽器的POST請求
在add.html頁面中，會有一個表單，當按下“submit”按鈕之後，將上面表單中的所有內容提交到伺服器
var http = require('http');
var fs = require('fs');
var qs = require('querystring');//伺服器解析表單提交的資料所用到的模組
var websites = [];
var app = http.createServer(function(req,res){
var dataPost ='';
if(req.method === 'GET'){
//處理一些簡單的html請求
switch (req.url){
case '/index.html':
fs.readFile('../index.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'utf8'});
res.end(data.toString());
})
break;
case '/add.html':
fs.readFile('../add.html',function(err,data){
if(err){
throw err;
}
res.writeHeader(200,{'Content-Type':'utf8'});
res.end(data.toString());
})
break;
}
}else if(req.method === 'POST'){
//處理複雜的請求
switch(req.url){
case '/add.js':
//通過request的兩個事件來完成對post方法傳入的資料進行讀取等操作
//data事件，監聽資料的傳輸
req.on('data',function(chunck){
dataPost += chunck;
});
//end事件，監聽資料傳送完成
req.on('end',function(){
//列印伺服器接收的form表單的資料格式
//domainName=www.nodejs.json.com&name=node.js&email=nodejs%40json.com&age=3&click=3000
// console.log(dataPost);
//伺服器對所接收的資料進行解析
//最終將資料解析成一個物件，比如domainname就是該物件的屬性，www.nodejs.json.com就是對應屬性的值
var website = qs.parse(dataPost);
console.log(website.domainName);
console.log(website.name);
console.log(website.age);
console.log(website.click);
//接下來實現在伺服器中對資料的儲存，可以存在記憶體中、檔案中或資料庫中
//下面採用最簡單的方式--儲存在記憶體中，即伺服器一停止服務，資料將會丟失
websites.push(website);
//用JSON的方法測試陣列的輸出
//res.end(JSON.stringify(websites));
var html = '<html><head><meta charset="utf-8"><title>nodejs</title></head><body>';
html +='<table>';
for(var i = 0; i<websites.length; i++){
var row='<tr>'+
'<td>'+websites[i].domainName +'</td>'+
'<td>'+websites[i].name +'</td>'+
'<td>'+websites[i].email +'</td>'+
'<td>'+websites[i].age +'</td>'+
'<td>'+websites[i].click +'</td>'+
'</tr>';
html +=row;
}
html +='</table>';
html += '</body></html>';
res.writeHeader(200,{'Content-Type':'text/html'});
res.end(html);
//測試表單傳入伺服器的資料
// res.end(dataPost);
});
break;
}
}
}).listen(2333);啟動伺服器：
開啟瀏覽器：
開啟add.html
填寫表單：
提交，就會按伺服器處理資料的方式將資料顯示在頁面中：
此時控制檯的資訊：
以上就是看捷訓網nodejs視訊所學內容的總結，對nodejs的伺服器搭建有了初步的瞭解，具體的細節還需要以後分模組逐步學習。
相關推薦
nodejs之http、fs、querystring模組實現網頁與伺服器的互動
一.實現瀏覽器端請求之後，伺服器響應開啟相應的靜態網頁內容： 思路：直接通過瀏覽器端輸入的url值來判斷，從而顯示出該url對應的網頁的內容。直接在配置伺服器的js程式碼裡寫出靜態頁面的內容： //前端頁面和伺服器未分離 var http = requir
Nodejs入門基礎（fs、path模組）
案例：載入靜態資訊（如圖片，網頁等），post提交方式獲取資料，path擷取字尾名預設介面 index.html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF
nodejs之http模組
nodejs伺服器端 const http = require('http'); const server = http.createServer(function (req, res) { res.writeHead(200, { 'content-type': 'text/p
nodejs之http模組對路由的處理
const http = require('http'); const fs = require('fs'); const Mime = require('./libs/Mime');//這個是處理content-type的庫 let users = [
Java程式設計之HTTP的Post、Get、Put、Delete
Http：在網路中，傳送檔案、資料需要遵循的一種協議。客戶端需要和伺服器端建立聯絡，就需要使用HTTP協議，保證伺服器端可以識別客戶端的請求，並把相應的資源發給客戶端使用。例如，訪問CSDN，在不同電腦的網頁上輸入https://www.csdn.net/即可看到CSDN的網
http抓包實戰之http協議初始、fiddler初始
wid window 超文本傳輸協議 輸出 技術 服務 英文 捕獲 通過 1、什麽是http協議？ HTTP協議是Hyper Text Transfer Protocol（超文本傳輸協議）的縮寫,是用於從萬維網（WWW:World Wide Web ）服務器傳輸超文本到本
nodejs之http請求解析
上篇文章簡單講到了如何利用express建立一個服務，那麼如何處理客戶端傳遞的引數了？首先，來看個簡單的get請求： 這裡只傳了一個引數id,如何獲取這個引數了？在router.js里加上這句 控制檯輸出： 是不是很簡潔，express提供的路由容器router，讓程式碼看起來簡潔易維
linux-Centos-7-64位：5、 nginx代理+sticky模組實現基於cookie的負載均衡
nginx 可以使用各平臺的預設包來安裝，本文是介紹使用原始碼編譯安裝，包括具體的編譯引數資訊。 準備工作： 1、安裝必備工具： 編譯環境gcc g++ 開發庫之類的需要提前裝好 $ yum -y install gcc gcc-c++ autoconf aut
js、jq兩種方法實現網頁側邊導航
js第一種方法: 實現的效果如下: 1.在側欄滑動時背景顏色切換和字型顏色切換. 2.視窗滾動時，右邊側欄隨之變化. 3.點選側欄選項,跳動到當前選項對應的頁面,並且側欄也隨之變化. 程式碼如下: html+css: *{
【Android】Android與伺服器互動 POST上傳多個圖片檔案、文字內容 GET下載圖片
這裡伺服器端採用的是php解析內容 HTTP請求 HTTP 請求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 這幾種。用於資料互動的最基本方法一般為GET、POST、PUT、DELETE。對
利用Apache的轉發模組實現反向代理伺服器
問題又來公司的LAMP伺服器使用Apache的VirtualHost功能部署了多個擁有獨立域名的網站。httpd.conf配置檔案部分如下：# 省略本文無關部分 Listen 80 # www.xxx.com <VirtualHost *> Server
Fragment學習之使用介面回撥的方式實現Fragment與Activity通訊
Fragment與Fragment之間可以進行資訊傳遞，同樣，Fragment與Activity也可以進行資訊的傳遞。 下面是一個演示在Activity中獲取來自Fragment的資訊，使用介面回撥的方法在Activity中接收資訊 MainActivity.java:
初級爬蟲(一) requests模組實現網頁批量圖片爬取
思路分析: 已知網頁:如http://www.jiangxian.gov.cn/N20180821093426.html 1, 檢查網頁分析網頁中圖片的地址形式, 2,獲取網頁內容,正則匹配出所有圖片的地址, 3,拼接地址生成列表 4,迴圈列表,生成圖片地址的文字檔案 5,迴圈列表,取出
HTTP與伺服器互動的方式get和post的區別
1.http四種互動方式： get和post是HTTP與伺服器互動的方式， 說到方式，其實總共有四種：put，delete，post，get。 他們的作用分別是對伺服器資源的增，刪，改，查。 所以，get是獲取資料，post是修改資料。 2.
GSM模組_STM32實現GPRS與伺服器資料傳輸經驗總結
硬體環境 MCU：STM32F103RET6 （偵錯程式：J-Link） GSM模組：Ai-Thinker_A6 （安信可）（還需要配一個串列埠列印工具，當初選這個模組純粹是因為價格是最便宜的）
Linux下網路程式設計之自定義協議進行併發多客戶端與伺服器的通訊(多程序處理併發)不足佔用資源太多
自定義協議訊息體*********msg.h*************#ifndef _MSG_H_#define _MSG_H_struct msg{ char head[10]; //頭部 char msg_chck; //效驗碼 char buff[512];/
Nodejs入門基礎（http、url、mysql模組）
Node.js特點：單執行緒，非阻塞IO，事件驅動單執行緒執行任務，如遇到阻塞會掛起任務繼續執行其他，執行完其他再通過事件驅動處理阻塞的任務 node xxx.js 即可直接執行伺服器 第三方外掛需要安裝，在控制檯npm install mysql 案例：登入頁面-註冊頁面訪問並輸出錄入資訊，rou
Nodejs的http、url模組
一、http模組 1、http模組簡介 http模組是Node提供的一個系統模組，使用該模組可以讓我們根據自己的需求建立一個web伺服器並定製伺服器功能。 2、構建web伺服器步驟 ① 載入http模組 const http = require('http');
一些liunx base-fs、mini-fs、docker image 系統 安裝kernel、grub文件，使之獨立運行的註意事項
ystemd 直接 ase base 強制 min 可能 成功 註意事項 如題 通常你不會順利的啟動成功的！ 其原因在於 init 初始化管理系統 ，主要是systemd在作祟！ 要麽官方沒有安裝，要麽安裝的是定制多的刪減版，故意是base系統無法啟動！ 怎麽辦？
week5：模組之json、pickle、dump和load方法、shelve、xml
一、什麼是序列化？ 我們把物件（變數）從記憶體中變成可儲存或傳輸的過程稱之為序列化。在python中叫picking。 序列化之後，就可以把序列化的內容寫入磁碟，或者通過網路傳輸到別的機器上。 反過來，把變數內容從序列化的物件重新讀到記憶體裡稱之為反序列化。即unpicking 二、