自己的頁面怎么讓別人訪問到?--node靜態服務器安裝&ngrok外網映射

今天突然想, 自己寫的頁面可不可以讓別人訪問,或者用手機訪問看響應式,于是就有了這篇博客


1.Node安裝

Node.js安裝包及源碼下載地址為:https://nodejs.org/en/download/

Window 上安裝Node.js

你可以采用以下兩種方式來安裝。

1、Windows 安裝包(.msi)

32 位安裝包下載地址 :https://nodejs.org/dist/v4.4.3/node-v4.4.3-x86.msi

64 位安裝包下載地址 :https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi

本文實例以 v0.10.26 版本為例,其他版本類似, 安裝步驟:

步驟 1 : 雙擊下載后的安裝包v0.10.26,如下所示:

步驟 2 : 點擊以上的Run(運行),將出現如下界面:

步驟 3 : 勾選接受協議選項,點擊 next(下一步) 按鈕 :

步驟 4 : Node.js默認安裝目錄為 "C:\Program Files\nodejs\" , 你可以修改目錄,并點擊 next(下一步):

步驟 5 : 點擊樹形圖標來選擇你需要的安裝模式 , 然后點擊下一步 next(下一步)

步驟 6 :點擊 Install(安裝) 開始安裝Node.js。你也可以點擊 Back(返回)來修改先前的配置。 然后并點擊 next(下一步):

安裝過程:

點擊 Finish(完成)按鈕退出安裝向導。

檢測PATH環境變量是否配置了Node.js,點擊開始=》運行=》輸入"cmd" => 輸入命令"path",輸出如下結果:

PATH=C:\oraclexe\app\oracle\product\10.2.0\server\bin;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;

c:\python32\python;C:\MinGW\bin;C:\ProgramFiles\GTK2-Runtime\lib;C:\ProgramFiles\MySQL\MySQLServer5.5\bin;C:\ProgramFiles\nodejs\;

C:\Users\rg\AppData\Roaming\npm

我們可以看到環境變量中已經包含了C:\Program Files\nodejs\

檢查Node.js版本

2、Windows 二進制文件 (.exe)安裝

32 位安裝包下載地址 :http://nodejs.org/dist/v0.10.26/node.exe

64 位安裝包下載地址 :http://nodejs.org/dist/v0.10.26/x64/node.exe

安裝步驟

步驟 1 : 雙擊下載的安裝包 Node.exe ,將出現如下界面 :

點擊 Run(運行)按鈕將出現命令行窗口:

版本測試

進入 node.exe 所在的目錄,如下所示:

如果你獲得以上輸出結果,說明你已經成功安裝了Node.js。

2.Node.js 創建第一個應用

如果我們使用PHP來編寫后端的代碼時,需要Apache 或者 Nginx 的HTTP 服務器,并配上 mod_php5 模塊和php-cgi。

從這個角度看,整個"接收 HTTP 請求并提供 Web 頁面"的需求根本不需 要 PHP 來處理。

不過對 Node.js 來說,概念完全不一樣了。使用 Node.js 時,我們不僅僅 在實現一個應用,同時還實現了整個 HTTP 服務器。事實上,我們的 Web 應用以及對應的 Web 服務器基本上是一樣的。

在我們創建 Node.js 第一個 "Hello, World!" 應用前,讓我們先了解下 Node.js 應用是由哪幾部分組成的:

引入 required 模塊:我們可以使用require指令來載入 Node.js 模塊。

創建服務器:服務器可以監聽客戶端的請求,類似于 Apache 、Nginx 等 HTTP 服務器。

接收請求與響應請求服務器很容易創建,客戶端可以使用瀏覽器或終端發送 HTTP 請求,服務器接收請求后返回響應數據。

創建 Node.js 應用

步驟一、引入 required 模塊

我們使用require指令來載入 http 模塊,并將實例化的 HTTP 賦值給變量 http,實例如下:

varhttp=require("http");

步驟二、創建服務器

接下來我們使用 http.createServer() 方法創建服務器,并使用 listen 方法綁定 8888 端口。 函數通過 request, response 參數來接收和響應數據。

實例如下,在你項目的根目錄下創建一個叫 server.js 的文件,并寫入以下代碼:

varhttp=require('http');http.createServer(function(request,response){// 發送 HTTP 頭部// HTTP 狀態值: 200 : OK// 內容類型: text/plainresponse.writeHead(200,{'Content-Type':'text/plain'});// 發送響應數據 "Hello World"response.end('Hello World\n');}).listen(8888);// 終端打印如下信息console.log('Server running at http://127.0.0.1:8888/');

以上代碼我們完成了一個可以工作的 HTTP 服務器。

使用node命令執行以上的代碼:

node server.jsServerrunning at http://127.0.0.1:8888/

接下來,打開瀏覽器訪問 http://127.0.0.1:8888/,你會看到一個寫著 "Hello World"的網頁。

分析Node.js 的 HTTP 服務器:

第一行請求(require)Node.js 自帶的 http 模塊,并且把它賦值給 http 變量。

接下來我們調用 http 模塊提供的函數: createServer 。這個函數會返回 一個對象,這個對象有一個叫做 listen 的方法,這個方法有一個數值參數, 指定這個 HTTP 服務器監聽的端口號。

3.外網映射

1)安裝ngrok ?: ? https://dashboard.ngrok.com/get-started

2) 在安裝的ngrok.exe目錄下 打開cmd ?把你的 密碼授權輸進去

3)繼續輸入

?./ngrok http 80 ?(不一定是80 和你自己的端口一致?)

4)

然后 把映射的forwarding地址復制到瀏覽器?

大家就可以訪問啦!!


呀呀呀 -------------狗糧嘻嘻嘻
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容