新浪云搭建简单的 Node.js Web 应用

使用新浪云搭建 Node.js Web 应用教程

[toc]

阅读本文前,需要对 node.js 、npm、常用 Git 操作、express 有基本的掌握

一、准备工作:

注册号新浪云账号

进入 http://www.sinacloud.com/sae.html
(用微博账号即可直接登录)

创建云应用空间

新浪云的应用空间其实就相当于一个 web 站点 + 一个有完整服务器环境的代码仓库

云应用空间的创建,可以参考新浪的文档:如何创建一个云空间应用 。当然这里需要选择开发语言为 Node.js。

登陆,然后进入控制台 -> 云应用SAE -> 代码管理

以上步骤完成后,我们就有了一个 web 应用站点。这个站点可以用来部署我们的 html 页面。站点地址可以从这里查看:

准备工作做好了,接下来该配置 Node.js 服务器环境,部署 web 页面上去。

二、Node.js 服务器配置

新浪云比较方便的是,即使你对 Node.js 服务器开发没有接触过也没关系,新浪云的 Node.js 环境基本是傻瓜式的,即开即用。所以服务器配置环节,过。

node.js 简单教程

顺便安利个 30分钟 Node.js 入门 的教程,完全没有接触过 Node.js 的同学可以快速入门一下。

三、编写 Node.js 服务代码并部署

1、先在本地创建一个代码目录 eg: my-node-demo,从新浪的 Git 仓库里 clone 出空项目到 my-node-demo 下。拉代码的过程很简单,具体可以参考 新浪的代码部署手册 文档

2、在本地代码路径 my-node-demo 下创建一个 server.js 文件,这里我们先使用入门教程里最简单的 Node.js 代码:

// server.js
var http = require('http');

http.createServer(function (request, response) {

    // 发送 HTTP 头部 
    // HTTP 状态值: 200 : OK
    // 内容类型: text/plain
    response.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/');

3、由于新浪的 Node.js 构建环境需要从 package.json 文件中读取配置信息,我们需要在 my-node-demo 下创建一个package.json 文件。

这里我们直接使用 npm init 命令生成一个。 NPM 是 Node Package Manager 的缩写,也就是 Node 包管理器,类似于 iOS 开发中的 CocoaPods,而 npm init 就相当于pod init了.

在 server.js 文件所在目录上,执行 npm init,按照命令行里的提示一步一步直接敲回车即可。

4、部署

这里的所谓部署 == 提交代码到新浪云 Git 服务器……

所以,使用 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 代码后,自动开始构建
➜  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: 导出 Git 代码中...
remote: 构建程序中...
-----> 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

到这里构建成功,就已经部署成功了。这时我们的 Hello world 页面就可以在你的新浪云 Web 站点看到了:

四、部署 html 页面

1、懒得自己写个页面了,直接用一个网站模板:40 个 Bootstrap 网站模板 ,随便选一个,把代码压缩包 down 下来

2、解压,将代码网站模板全部文件拷贝到我们的刚创建的本地 Node 仓库 my-node-demo 目录下。

3、这次我们就不是简单的响应个 hello world 的,需要将 html 文本作为页面 send 出去。这里直接使用 node.js 流行框架 Express 帮我们完成这件事。

首先在代码目录 my-node-demo 路径下执行命令:

npm install express --save

这样会在 package.json 中,生成一条依赖信息:

同时,会将 express 的源码从 npm 仓库中拉下来到本地自动生成的 node_modules 目录中。此时目录结构如下:

4、改造 server.js 代码

工具准备好了,开始使用:

// server.js

var express = require('express')
var app = express()

// 静态 html 页面,需要将当前目录下的所有文件都设置为 static
app.use(express.static(__dirname + '/'));

app.get('/', function (req, res) {
    console.log('start server');
    // sendFile 函数,在有 request 访问时,将当前目录下的 index.html 文件作为 response 返回
    res.sendFile(__dirname + '/index.html');
    console.log('start success');
})

// 监听 8000 端口
app.listen(process.env.PORT || 8000)

5、Ok,再次 commit log、push ,等待编译

编译完成后,刷新我们的站点,就能看到一个漂亮的 html 页面了:

bootstrap 是 Twitter 开源的强大的响应式布局框架,已经帮我们做好了移动端浏览器的适配工作,可以在手机浏览器上访问下试试,效果还是挺不错的。

五、作为服务器接口使用

目前在我们的 Node 服务上,已经成功部署了一个简单的 web 应用。

其实我们日常客户端开发中,需要和服务器联调的各种接口,也都是这样的一个个 服务器上的资源地址路径( URL)。

我们可以在 iOS 项目中,通过 get 请求访问一下我们部署好 HTML 页面的站点 http://xxx.applinzi.com 试试,以 AFNetworkign 为例:

AFHTTPSessionManager *sessionManager = [AFHTTPSessionManager manager];
sessionManager.responseSerializer = [AFHTTPResponseSerializer serializer];

// 通常是 @"text/json" ,我们直接 get 请求页面,需要加上 @"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);
}];

六、其它

新浪云控制台使用

1、查看操作记录


2、注册会送 200 云豆 == 2元

没有额外流量消耗的话,每天默认扣 10 个豆

如果欠费后显示

3、查看日志、重启

最后,新浪是有 node 应用的部署指南的

上边这些坑,整整折腾了我5个小时后,我才发现渣浪早就有这个了: 新浪 node 应用部署指南 不说了,都是泪。

当然使用 Python、PHP 也可以查看对应的文档
https://www.sinacloud.com/index/support.html

参考:

1、 在新浪云上用php+mysql搭建简单后台系列

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,189评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,577评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,857评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,703评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,705评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,620评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,995评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,656评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,898评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,639评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,720评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,395评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,982评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,953评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,195评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,907评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,472评论 2 342

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,423评论 25 707
  • 本文首发于 GitChat,现免费放出~感谢大家的支持。 我们都知道,大学几乎是没有 Web 前端课的。以我所在的...
    hylerrix阅读 4,848评论 8 60
  • 你买了件好衣服,买了双好鞋,却总等着“大日子”才穿,最后衣服旧了,鞋子过时了。我不明白你为什么只有在特定的日子才想...
    微尘九回阅读 255评论 0 0
  • 乔布斯(Steve Jobs)说:“Stay hungry; stay foolish.” 这句话到底是什么意思呢...
    半度Deep阅读 868评论 0 0
  • 教大家做一款黑米糕: 1、黑米、糯米泡过夜晾干,用料理机打成粉过筛。 2、准备三个鸡蛋,分两个盆蛋清蛋黄分离。 3...
    五月的荷阅读 304评论 6 10