在瀏覽器輸入存在的網址的一個交互過程html
1.用戶經過瀏覽器發送一個http的請求到指定的主機node
2.服務器接收到該請求,對該請求進行分析和處理後端
3.服務器處理完成之後,返回對應的數據到用戶機器瀏覽器
4.瀏覽器接收服務器返回的數據,並根據接收到的進行分析和處理服務器
由客戶端發送一個http請求到指定的服務端 -> 服務端接收並處理請求 -> 返回數據到客戶端app
Node.js 建立第一個應用 函數
若是咱們使用 PHP 來編寫後端的代碼時,須要 Apache 或者 Nginx 的 HTTP 服務器, 來處理客戶端的請求相應。不過對 Node.js 來講,概念徹底不同了。使用 Node.js 時, 咱們不單單在實現一個應用,同時還實現了整個 HTTP 服務器。 ui
第一步:直接建立一個app.js文件,而後引入http模塊編碼
第二步:建立服務器 ,使用 http.createServer() 方法建立服務器,並使用 listen 方法綁定 8888 端口。函數經過 request, response 參數來接收和響應數據。url
var http = require('http'); http.createServer(function (request, response) { // 發送 HTTP 頭部 // HTTP 狀態值: 200 : OK //設置 HTTP 頭部,狀態碼是 200,文件類型是 html,字符集是 utf8 response.writeHead(200,{ "Content-Type": "text/html;charset=UTF-8" }); // 發送響應數據 "Hello World" response.end("哈哈哈哈,我買了一個 iPhone" + (1+2+3) + "s"); }).listen(8888); // 終端打印以下信息 console.log('Server running at http://127.0.0.1:8888/');
第三步:運行程序 而且瀏覽器運行
會發現,咱們本地寫一個 js,打死都不能直接拖入瀏覽器運行,可是有了 node,我 們任何一個 js 文件,均可以經過 node 來運行。也就是說,node 就是一個 js 的執行環境
http模塊詳解
引入http模塊:搭建一個http的服務器,用於處理用戶發送的http請求,須要使用node提供一個模塊 http
var http = require('http');
建立服務器對象方法:建立並返回一個HTTP服務器對象,requestListener : 監聽到客戶端鏈接的回調函數
var server = http.createServer([requestListener]);
監聽客戶端請求:監聽客戶端鏈接請求,只有當調用了listen方法之後,服務器纔開始工做
server.listen(port, [hostname], [backlog], [callback]); // port : 監聽的端口 ,不指定端口號,系統會自動分配一個; // hostname : 主機名(IP/域名); // backlog : 鏈接等待隊列的最大長度; // callback : 調用listen方法併成功開啓監聽之後,會觸發一個listening事件,callback將做爲該事件的執行函數
listening事件:當server調用listen方法併成功開始監聽之後觸發的事件
server.on('listening', function() {
console.log('listening...'); })
error事件:當服務開啓失敗的時候觸發的事件,參數err : 具體的錯誤對象
server.on('error', function(err){
console.log(err);
});
request事件: 當有客戶端發送請求到該主機和端口的請求的時候觸發.
參數request : http.IncomingMessage的一個實例,經過他咱們能夠獲取到此次請求的一些信息,好比頭信息,數據等;
server.on("request",function (req,res) { console.log('有客戶端請求了........'); console.log(req.headers); // 請求頭信息中的數據 console.log(req.httpVersion); // 使用的http協議版本 console.log(req.url); // 請求地址,這個地址指的是域名後面的地址(路由) console.log(req.method); // 請求方式 })
參數response : http.ServerResponse的一個實例,經過他咱們能夠向該次請求的客戶端輸出返回響應
server.on("request",function (req,res) { console.log('有客戶端請求了........'); // 設置返回頭信息,獨立進行頭部信息設置,對發送的數據不會產生任何的影響 res.setHeader('miaov', 'leo'); // writeHead(statusCode, [reasonPhrase], [headers]): 這個方法只能在當前請求中使用一次,而且必須在response.end()以前調用 // 第一個參數:是狀態碼,用來標識服務器處理後的狀態 第二個參數:是對應着第一個參數狀態碼的描述信息,是一個字符串,不寫默認是跟狀態碼相對應的默認描述 // 第三個參數:是一個對象,這個參數是要告訴瀏覽器,我將要發送的數據類型是什麼 // 這個方法最好寫在write方法以前調用 res.writeHead(200, 'miaov', { 'content-type' : 'text/html;charset=utf-8' //表示要發送html的文本數據類型,瀏覽器會對相應的數據類型進行解析 }); // write(chunk, [encoding]) : 發送一個數據塊到響應正文中(將數據寫入到客戶端),第一個參數:要發送的數據,第二個參數:編碼(可選) res.write('<h1>hello</h1>'); // 當全部的正文和頭信息發送完成之後調用該方法告訴服務器數據已經所有發送完成了,這個方法在每次完成信息發送之後必須調用,而且是最後調用 // 第一個參數:要發送的數據 第二個參數:編碼,這個方法一樣能夠向客戶端發送數據,而且發送完數據以後會結束此次請求 res.end(); })
response.end()方法產生兩次訪問的問題
var http = require('http'); //http是node中自帶的一個模塊,引入便可使用 http.createServer(function (request,response) { response.writeHead(200, {'Content-Type': 'text/html; charset=utf-8'}); if(request.url !== "/favicon.ico"){ // 清除第二次訪問 console.log("訪問"); response.write("hello world"); response.end("") // 不寫這個方法則會沒有http協議尾,寫了會產生兩次訪問 } }).listen(9000)
最關鍵的就是 req.url 屬性,表示用戶的請求 URL 地址。全部的路由設計,都是經過 req.url 來實現的。 咱們比較關心的不是拿到 URL,而是識別這個 URL,識別 URL,用到了下面的 url 模塊
URL 模塊的詳解
URL模塊的主要三個方法
url.parse() // 解析 URL url.format(urlObject) // 是上面 url.parse() 操做的逆向操做 url.resolve(from, to) // 添加或者替換地址
url.parse()
parse這個方法是用來解析訪問者的url,一般用於獲取url後面的get傳值
var http = require('http'); var url = require('url'); http.createServer(function(req,res){ res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); if(req.url!='/favicon.ico'){ // http://localhost:8001/news?aid=123 console.log(req.url); //返回 /news?aid=123 // 第一個參數是地址,第二個參數是true的話表示把get傳值轉換成對象 var result = url.parse(req.url, true); console.log(result) // 獲取url的get傳值,若是訪問的連接中沒有這個參數那麼就是undefined console.log('aid='+result.query.aid); console.log('cid='+result.query.cid); } res.write('你好 nodejs'); res.end(); // 結束響應 }).listen(8001);
運行而且瀏覽器分別http://localhost:8001和http://localhost:8001/news?aid=123&cid=3訪問,後臺打印結果
/
Url {
protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: null, query: [Object: null prototype] {}, pathname: '/', path: '/', href: '/' } aid=undefined cid=undefined /news?aid=123&cid=3 Url { protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: '?aid=123&cid=3', query: [Object: null prototype] { aid: '123', cid: '3' }, pathname: '/news', path: '/news?aid=123&cid=3', href: '/news?aid=123&cid=3' } aid=123 cid=3
url.format(urlObject)
var http=require('http'); var url=require('url'); http.createServer(function(req,res){ res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); if(req.url!='/favicon.ico'){ // http://localhost:8001/news?aid=123 console.log(req.url); //返回 /news?aid=123 // 第一個參數是地址,第二個參數是true的話表示把get傳值轉換成對象 var result = url.parse(req.url, true); var urlFormat = url.format(result); console.log(urlFormat) } res.write('你好 nodejs'); res.end(); // 結束響應 }).listen(8001);
運行而且瀏覽器分別http://localhost:8001和http://localhost:8001/news?aid=123&cid=3訪問,後臺打印結果
/
/
/news?aid=123
/news?aid=123
url.resolve(from, to)
var http=require('http'); var url=require('url'); http.createServer(function(req,res){ res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' }); if(req.url!='/favicon.ico'){ // http://localhost:8001/news?aid=123 console.log(req.url); //返回 /news?aid=123 // 第一個參數是地址,第二個參數是true的話表示把get傳值轉換成對象 var result = url.parse(req.url, true); var urlResolve = url.resolve(result, '/news?aid=123') console.log(urlResolve) } res.write('你好 nodejs'); res.end(); // 結束響應 }).listen(8001);
運行而且瀏覽器http://localhost:8001 訪問,後臺打印結果
/ /news?aid=123
當瀏覽器訪問http://localhost:8001/news?cid=123,再查看結果參數被替換了