使用新浪云搭建 Node.js Web 應(yīng)用教程
[toc]
閱讀本文前,需要對(duì) node.js 、npm、常用 Git 操作、express 有基本的掌握
一、準(zhǔn)備工作:
注冊(cè)號(hào)新浪云賬號(hào)
進(jìn)入 http://www.sinacloud.com/sae.html
(用微博賬號(hào)即可直接登錄)
創(chuàng)建云應(yīng)用空間
新浪云的應(yīng)用空間其實(shí)就相當(dāng)于一個(gè) web 站點(diǎn) + 一個(gè)有完整服務(wù)器環(huán)境的代碼倉(cāng)庫(kù)

云應(yīng)用空間的創(chuàng)建,可以參考新浪的文檔:如何創(chuàng)建一個(gè)云空間應(yīng)用 。當(dāng)然這里需要選擇開發(fā)語(yǔ)言為 Node.js。
登陸,然后進(jìn)入控制臺(tái) -> 云應(yīng)用SAE -> 代碼管理


以上步驟完成后,我們就有了一個(gè) web 應(yīng)用站點(diǎn)。這個(gè)站點(diǎn)可以用來(lái)部署我們的 html 頁(yè)面。站點(diǎn)地址可以從這里查看:

準(zhǔn)備工作做好了,接下來(lái)該配置 Node.js 服務(wù)器環(huán)境,部署 web 頁(yè)面上去。
二、Node.js 服務(wù)器配置
新浪云比較方便的是,即使你對(duì) Node.js 服務(wù)器開發(fā)沒有接觸過(guò)也沒關(guān)系,新浪云的 Node.js 環(huán)境基本是傻瓜式的,即開即用。所以服務(wù)器配置環(huán)節(jié),過(guò)。
node.js 簡(jiǎn)單教程
順便安利個(gè) 30分鐘 Node.js 入門 的教程,完全沒有接觸過(guò) Node.js 的同學(xué)可以快速入門一下。
三、編寫 Node.js 服務(wù)代碼并部署
1、先在本地創(chuàng)建一個(gè)代碼目錄 eg: my-node-demo,從新浪的 Git 倉(cāng)庫(kù)里 clone 出空項(xiàng)目到 my-node-demo 下。拉代碼的過(guò)程很簡(jiǎn)單,具體可以參考 新浪的代碼部署手冊(cè) 文檔

2、在本地代碼路徑 my-node-demo 下創(chuàng)建一個(gè) server.js 文件,這里我們先使用入門教程里最簡(jiǎn)單的 Node.js 代碼:
// server.js
var http = require('http');
http.createServer(function (request, response) {
// 發(fā)送 HTTP 頭部
// HTTP 狀態(tài)值: 200 : OK
// 內(nèi)容類型: text/plain
response.writeHead(200, {'Content-Type': 'text/plain'});
// 發(fā)送響應(yīng)數(shù)據(jù) "Hello World"
response.end('Hello World\n');
}).listen(8888);
// 終端打印如下信息
console.log('Server running at http://127.0.0.1:8888/');
3、由于新浪的 Node.js 構(gòu)建環(huán)境需要從 package.json 文件中讀取配置信息,我們需要在 my-node-demo 下創(chuàng)建一個(gè)package.json 文件。
這里我們直接使用 npm init 命令生成一個(gè)。 NPM 是 Node Package Manager 的縮寫,也就是 Node 包管理器,類似于 iOS 開發(fā)中的 CocoaPods,而 npm init 就相當(dāng)于pod init了.
在 server.js 文件所在目錄上,執(zhí)行 npm init,按照命令行里的提示一步一步直接敲回車即可。

4、部署
這里的所謂部署 == 提交代碼到新浪云 Git 服務(wù)器……
所以,使用 Git 命令打 commit log,push 代碼,等待云端編譯即可:
// 提交代碼
? yehot git:(master) ? git add .
? yehot git:(master) ? git commit -m "添加package.json"
[master a6b0d8f] 添加package.json
1 file changed, 20 insertions(+)
create mode 100644 package.json
// push 代碼后,自動(dòng)開始構(gòu)建
? yehot git:(master) ? git push sae master
Counting objects: 3, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 377 bytes | 0 bytes/s, done.
Total 3 (delta 2), reused 0 (delta 0)
remote: 導(dǎo)出 Git 代碼中...
remote: 構(gòu)建程序中...
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NPM_CONFIG_PRODUCTION=true
NODE_ENV=production
NODE_MODULES_CACHE=true
-----> Installing binaries
engines.node (package.json): unspecified
engines.npm (package.json): unspecified (use default)
Resolving node version (latest stable) via semver.io...
Downloading and installing node 7.2.1...
Using default npm version: 3.10.10
-----> Restoring cache
Loading 2 from cacheDirectories (default):
- node_modules
- bower_components (not cached - skipping)
- nodegyp_lib (not cached - skipping)
-----> Building dependencies
Pruning any extraneous modules
Installing node modules (package.json)
yehot@1.0.0 /tmp/build
`-- formidable@1.0.17
-----> Caching build
Clearing previous node cache
Saving 2 cacheDirectories (default):
- node_modules
- bower_components (nothing to cache)
- nodegyp_lib (nothing to cache)
-----> Build succeeded!
`-- formidable@1.0.17
-----> Discovering process types
Default types for -> web
-----> Compiled slug size is 16M
remote: Generating docker image...
remote: Pushing image registry.docker.sae.sina.com.cn/yehot:c72c679 .....
remote: 部署程序中 .....
To https://git.sinacloud.com/yehot
a6b0d8f..c72c679 master -> master
到這里構(gòu)建成功,就已經(jīng)部署成功了。這時(shí)我們的 Hello world 頁(yè)面就可以在你的新浪云 Web 站點(diǎn)看到了:

四、部署 html 頁(yè)面
1、懶得自己寫個(gè)頁(yè)面了,直接用一個(gè)網(wǎng)站模板:40 個(gè) Bootstrap 網(wǎng)站模板 ,隨便選一個(gè),把代碼壓縮包 down 下來(lái)
2、解壓,將代碼網(wǎng)站模板全部文件拷貝到我們的剛創(chuàng)建的本地 Node 倉(cāng)庫(kù) my-node-demo 目錄下。
3、這次我們就不是簡(jiǎn)單的響應(yīng)個(gè) hello world 的,需要將 html 文本作為頁(yè)面 send 出去。這里直接使用 node.js 流行框架 Express 幫我們完成這件事。
首先在代碼目錄 my-node-demo 路徑下執(zhí)行命令:
npm install express --save
這樣會(huì)在 package.json 中,生成一條依賴信息:

同時(shí),會(huì)將 express 的源碼從 npm 倉(cāng)庫(kù)中拉下來(lái)到本地自動(dòng)生成的 node_modules 目錄中。此時(shí)目錄結(jié)構(gòu)如下:

4、改造 server.js 代碼
工具準(zhǔn)備好了,開始使用:
// server.js
var express = require('express')
var app = express()
// 靜態(tài) html 頁(yè)面,需要將當(dāng)前目錄下的所有文件都設(shè)置為 static
app.use(express.static(__dirname + '/'));
app.get('/', function (req, res) {
console.log('start server');
// sendFile 函數(shù),在有 request 訪問(wèn)時(shí),將當(dāng)前目錄下的 index.html 文件作為 response 返回
res.sendFile(__dirname + '/index.html');
console.log('start success');
})
// 監(jiān)聽 8000 端口
app.listen(process.env.PORT || 8000)
5、Ok,再次 commit log、push ,等待編譯
編譯完成后,刷新我們的站點(diǎn),就能看到一個(gè)漂亮的 html 頁(yè)面了:

bootstrap是 Twitter 開源的強(qiáng)大的響應(yīng)式布局框架,已經(jīng)幫我們做好了移動(dòng)端瀏覽器的適配工作,可以在手機(jī)瀏覽器上訪問(wèn)下試試,效果還是挺不錯(cuò)的。
五、作為服務(wù)器接口使用
目前在我們的 Node 服務(wù)上,已經(jīng)成功部署了一個(gè)簡(jiǎn)單的 web 應(yīng)用。
其實(shí)我們?nèi)粘?蛻舳碎_發(fā)中,需要和服務(wù)器聯(lián)調(diào)的各種接口,也都是這樣的一個(gè)個(gè) 服務(wù)器上的資源地址路徑( URL)。
我們可以在 iOS 項(xiàng)目中,通過(guò) get 請(qǐng)求訪問(wèn)一下我們部署好 HTML 頁(yè)面的站點(diǎn) http://xxx.applinzi.com 試試,以 AFNetworkign 為例:
AFHTTPSessionManager *sessionManager = [AFHTTPSessionManager manager];
sessionManager.responseSerializer = [AFHTTPResponseSerializer serializer];
// 通常是 @"text/json" ,我們直接 get 請(qǐng)求頁(yè)面,需要加上 @"text/html"
sessionManager.responseSerializer.acceptableContentTypes = [NSSet setWithObject:@"text/html"];
[sessionManager GET:@"http://yehot.applinzi.com/index.html" parameters:nil progress:nil success:^(NSURLSessionDataTask * _Nonnull task, id _Nullable responseObject) {
NSLog(@"%@",responseObject);
} failure:^(NSURLSessionDataTask * _Nullable task, NSError * _Nonnull error) {
NSLog(@"%@",error);
}];
六、其它
新浪云控制臺(tái)使用
1、查看操作記錄

2、注冊(cè)會(huì)送 200 云豆 == 2元
沒有額外流量消耗的話,每天默認(rèn)扣 10 個(gè)豆

如果欠費(fèi)后顯示

3、查看日志、重啟

最后,新浪是有 node 應(yīng)用的部署指南的
上邊這些坑,整整折騰了我5個(gè)小時(shí)后,我才發(fā)現(xiàn)渣浪早就有這個(gè)了: 新浪 node 應(yīng)用部署指南 不說(shuō)了,都是淚。
當(dāng)然使用 Python、PHP 也可以查看對(duì)應(yīng)的文檔
https://www.sinacloud.com/index/support.html