使用 node.js 模仿 Apache 小部分功能

來源：懂視網責編：小采時間：2020-11-27 21:54:12

使用 node.js 模仿 Apache 小部分功能

使用 node.js 模仿 Apache 小部分功能:首先，這個例子用到了服務端渲染的技術。服務端渲染，說白了就是在服務端使用模板引擎，這里我先簡單的介紹一下服務端渲染與客戶端渲染之間的區別。服務端渲染與客戶端渲染之間的區別: 客戶端渲染不利于搜索引擎優化服務端渲染可以被爬蟲抓取到，而客戶端

推薦度：

點擊下載本文 文檔為doc格式

導讀使用 node.js 模仿 Apache 小部分功能:首先，這個例子用到了服務端渲染的技術。服務端渲染，說白了就是在服務端使用模板引擎，這里我先簡單的介紹一下服務端渲染與客戶端渲染之間的區別。服務端渲染與客戶端渲染之間的區別: 客戶端渲染不利于搜索引擎優化服務端渲染可以被爬蟲抓取到，而客戶端

首先，這個例子用到了服務端渲染的技術。服務端渲染，說白了就是在服務端使用模板引擎，這里我先簡單的介紹一下服務端渲染與客戶端渲染之間的區別。

服務端渲染與客戶端渲染之間的區別:

客戶端渲染不利于搜索引擎優化

服務端渲染可以被爬蟲抓取到，而客戶端異步渲染很難被爬蟲抓取到（例如：AJAX）

大部分的網站既不是純異步（客戶端），也不是純服務端渲染出來的，而是兩者結合的

例如：京東的商品列表采用的就是服務端渲染，目的是為了SEO搜索引擎優化，說白了就是為了能夠被搜索到，且能被爬蟲抓取（搜索引擎本身也是一種爬蟲）。

而京東的商品評論列表為了用戶體驗，而且也不需要SEO優化，所以才用的是客戶端渲染

簡單的判斷內容為服務端渲染還是客戶端渲染

　　最簡單的方法就是：

點擊訪問一個頁面（我們這里以京東為例）
隨便訪問一個商品頁，然后復制商品標題
然后鼠標右擊點擊查看網頁源代碼
在源代碼頁按 Ctrl + f ，接著把復制的內容粘貼進去
能搜到就是服務端渲染，否則的話，就是客戶端渲染。

利用 art-template 模板引擎

安裝：在想要安裝的目錄下打開命令行工具輸入 npm install art-template, 然后它會自動生成 node_modules 目錄（前提，系統已經安裝了 Node.js 環境）
在需要使用的文件模塊中加載 art-template:
const template = require('art-template');
就可以使用了 , 官方文檔地址：https://aui.github.io/art-template/zh-cn/docs/index.html

Apache 部分功能實現

Node.js 相關API(本例中使用):

基于http

createServer() : 創建一個服務器

on(): 提供服務：對數據的服務，發請求，接收請求，處理請求，發送響應，等等

listen(): 綁定端口號，啟動服務器

基于fs(文件系統)

readFile(): 讀取文件（參數一為文件路徑，參數二為回調函數）

readdir(): 讀取目錄（參數一位目錄路徑，參數二為回調函數）

基于path(路徑)

extname(): 獲取文件后綴名

隨便在一個位置建立 www 文件夾（文件名可以自己隨意）:

寫HTML：

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="utf-8">
 <title>Index of / {{title}}</title>
</head>
<body>
 <h1>Index of / {{title}}</h1>
 <ul>
 <li><a href="/" rel="external nofollow" > Parent Directory</a></li>
 {{each files}}
 <li><a href="/{{ $value }}" rel="external nofollow" >{{ $value }}/</a></li>
 {{/each}}
 </ul>
</body>
</html>

node.js:

const http = require('http');
const fs = require('fs');
const template = require('art-template');
const path = require('path');
const port = 5000;
const server = http.createServer();
server.on('request', (request, response) => {
 let url = request.url;
 let wwwDir = 'D:/www';
 fs.readFile('./template.html', (error, data) => {
 if (error) {
 return response.end('404 Not Found');
 }
 // 1.如何得到 wwwDir 目錄列表中的文件名和目錄名
 // fs.readdir
 // 2.如何將得到的文件名和目錄名替換到 template.html 中
 // 2.1 在 template.html 中需要替換的位置預留一個特殊的標記
 // 2.2 根據 files 生成需要的 HTML 內容
 // 模板引擎
 if (url !== '/') {
 wwwDir += url;
 }
 let fileEnd = path.extname(wwwDir);
 /**
 * 如果是文件，則訪問該文件
 * 如果是文件夾，則訪問里面的內容
 */
 if (fileEnd !== '') {
 fs.readFile(wwwDir, (error, data) => {
 if (error) {
 return response.end('404 Not Found');
 }
 // 獲取文件后綴名(具體問題具體分析，這里我只設置 .txt 文件的 編碼類型)
 if (fileEnd === '.txt') {
 response.setHeader('Content-Type', 'text/plain; charset=utf-8');
 }
 if (fileEnd === '.jpg') {
 response.setHeader('Content-Type', 'image/jpeg');
 }
 if (fileEnd === '.mp4') {
 response.setHeader('Content-Type', 'video/mpeg4');
 }
 response.end(data);
 });
 } else {
 console.log(wwwDir);
 fs.readdir(wwwDir, (error, files) => {
 if (error) {
 return response.end('Can not find this dir');
 }
 console.log(files);
 // files: [ 'a.txt', 'apple', 'images', 'index.html', 'static', 'videos' ]
 let htmlStr = template.render(data.toString(), {
 title: wwwDir,
 files: files,
 });
 // 3.發送響應數據
 response.end(htmlStr);
 });
 }
 });
});
server.listen(port, () => {
 console.log(`服務器已經開啟，您可以通過 http://127.0.0.1:${port} 訪問....`);
});

總結

以上所述是小編給大家介紹的使用 node.js 模仿 Apache 小部分功能，希望對大家有所幫助，如果大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復大家的！

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

使用 node.js 模仿 Apache 小部分功能

推薦度：

點擊下載本文 文檔為doc格式

標簽：使用部分模仿

熱門焦點

使用 node.js 模仿 Apache 小部分功能

使用 node.js 模仿 Apache 小部分功能

使用 node.js 模仿 Apache 小部分功能

最新推薦

猜你喜歡

熱門推薦