V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Goodapp
V2EX  ›  推广

Node.js 快速上手并部署到好雨云

  •  
  •   Goodapp · 2017-01-13 14:36:04 +08:00 · 2159 次点击
    这是一个创建于 2870 天前的主题,其中的信息可能已经有所发展或是发生改变。

    Node.js 快速上手并部署到好雨云

    网站的错误不经常发生,但当我们遇到的时候非常令人懊恼,比如当我们想要在线挂号的时候,遇到了这个:

    201701132957414841857413474.jpg

    为什么会出现这种情况,背后的服务器发生了什么?我们将使用Node.js做一个简单的web服务器并利用好雨应用管理平台将我们本地的服务放到互联网上面。

    Node.js是一个开源的跨平台运行环境,允许我们构建一个服务器端和网络应用的运行环境。使用JavaScript语言开发可以通过Node.js运行时环境跑在任何平台。当然,开始使用前我们需要先进行安装,通过这个下载地址找到适合我们系统的安装包进行安装。

    简单的开始

    首先我们需要写一个JavaScript文件,我们叫它server.js,这个就是我们运行web服务器的程序。

    var http = require("http");
    
    http.createServer(function(request, response) {
      response.writeHead(200, {"Content-Type": "text/plain"});
      response.write("It's work!");
      response.end();
    }).listen(5000);
    

    相信我,这是你看到的最简单的服务器程序了,是不是很简单,接着我们在命令行下运行这个文件。

    node server.js
    

    这样我们的web服务器就已经运行了,打开浏览器让我们确认一下它正常工作了。

    201701131553414841872494604.jpg

    Node.js可以用很少的资源,应付大流量访问,因为node采用了event loop机制来解决单线程的问题,这种运行方式称为"异步模式"(asynchronous I/O)或"非堵塞模式"(non-blocking mode)。

    让我们通过这幅图解释的更详细一些:

    201701134114414842057209799.jpg

    这幅图很好的展示了在 Node.js 服务内部是如何工作的。一个用来处理外部事件并且把它们转换成对回调的调用的实体。

    这些工作都是在服务内服实现的,我们在写代码的过程中不会接触到这些问题。所以我们只需要了解 Node 运行如此快的原因正是基于这种"异步 I/O 模式"就可以了。

    部署到网上

    我的服务器已经正常运行了,可是它只是跑在我的本地,如果想要让更多的人访问我的网站,我需要将它放到互联网上我们需要选择一个云平台来部署我们的网站。对于云平台我们有很多选择,比如亚马逊Heroku等等,但因为众所周知的原因,国外的云服务我们使用起来并不方便,甚至无法访问。所以我选择了好雨云来部署网站,好雨云是一个云端的应用管理平台,也就是我们通常所说的PaaS(platform as a service),它允许你自动部署 web 应用,支持几种构建方式,比如我使用就是源码构建,这节省了我很多时间,可以让我专心写代码,不用为服务器、网络以及代码运行环境的配置操心。

    写个博客

    好,在部署之前,我们需要进行一些开发的工作,让我们写个简单网站,新建项目目录名为myblog,并创建server.js(上面说过的,还记得吗?)首先声明一些变量:

    var http = require("http");
    var fs = require("fs");
    var path = require("path");
    var mime = require("mime");
    

    这里包含了一个第三方的依赖mime,他不是node的一部分,我们需要先安装这些第三方依赖才能让程序工作。为了解决依赖问题我们需要写一个package.json文件将我们项目需要的依赖放进去。

    就像这样:

    {
      "name" : "myblog",
      "version" : "0.0.1",
      "description" : "a simple blog",
      "dependencies" : {
        "mime" : "~1.2.7"
      },
      "scripts": {
        "start": "node server.js"
      },
      "engines": {
        "node": "4.7.2"
      }
    }
    

    语法很简单,但要注意一些语法细节,不然经常会发生因为少了逗号或者引号造成构建失败这种低级的错误。这里我们声明依赖的mime的版本、启动命令以及node的版本。

    如果我们代码的根目录下存在package.json文件那么好雨云就会判断这是Node.js程序并安装相应的依赖以及调用我们声明的命令来启动程序。

    接着我们需要为web服务器增加一些功能来处理不同的请求,send404是当请求到不存在的文件时,我们要如何处理:

    function send404(response) {
      response.writeHead(404, {"Content-type" : "text/plain"});
      response.write("Error 404: resource not found");
      response.end();
    }
    

    sendFile文件数据服务:

    function sendFile(response, filePath, fileContents) {
      response.writeHead(200, {"Content-type" : mime.lookup(path.basename(filePath))});
      response.end(fileContents);
    }
    

    定义服务器如何执行请求:

    function serverWorking(response, absPath) {
      fs.exists(absPath, function(exists) {
        if (exists) {
          fs.readFile(absPath, function(err, data) {
            if (err) {
              send404(response)
            } else {
              sendFile(response, absPath, data);
            }
          });
        } else {
          send404(response);
        }
      });
    }
    

    创建http服务器:

    var server = http.createServer(function(request, response) {
      var filePath = false;
    
      if (request.url == '/') {
        filePath = "public/index.html";
      } else {
        filePath = "public" + request.url;
      }
    
      var absPath = "./" + filePath;
      serverWorking(response, absPath);
    });
    

    配置服务的监控端口:

    var port_number = server.listen(process.env.PORT || 5000);
    

    为啥是5000呢?因为好雨云默认分配5000的监控端口。所以我们将这里配置好,就可以直接被访问到。

    然后我们开始写内容,在项目目录(myblog)下新建几个目录:publicstylesheetsimages。我们将index.html放到public下,将我们样式文件 style.css放到stylesheets下,静态资源图片放到 images 下。

    博客的首页index.html代码如下:

    <!DOCTYPE html>
    <html>
        <head>
            <title>我的博客</title>
            <link rel="stylesheet" type="text/css" href="http://oe5ahutux.bkt.clouddn.com/style.css">
        </head>
        <body>
            <div id="header">
                <span>一个简单的博客</span>
            </div>
            <div id="content">
                <h2><a href="http://www.amazon.cn/gp/product/B007VISQ1Y/ref=as_li_ss_tl?ie=UTF8&camp=536&creative=3132&creativeASIN=B007VISQ1Y&linkCode=as2&tag=jysperm07-23">JavaScript 权威指南</a></h2>
                <p>这本书事无巨细地介绍了 JasvaScript 语言核心、标准库以及浏览器提供的 DOM 和 BOM. 本书并没有由浅入深的结构,而是通篇平铺直叙地介绍,因此适合有一定 JavaScript 基础的人从头至尾阅读来掌握一些相对细节的 JavaScript 知识,或遇到具体问题时查阅相关章节。</p>
                
                <h2><a href="something.html">JavaScript 异步编程</a></h2>
                <p>这本书介绍了 JavaScript 中事件模型、 Promise 、 async.js 等异步抽象的设计和实现,同时也介绍了 Web Woerk 等在浏览器中优化性能的技巧。这本书适合所有 JavaScript 程序员增加对 Promise 等异步模型的理解,并在实践中挑选合适的异步模型。</p>
            </div>
        </body>
    </html>
    
    

    浏览器中访问的样子:

    201701137014314841919993236.jpg

    首页代码中,我故意写了一个可以访问的正确链接和一个不可访问的错误链接,这样我可以试一下404返回内容。

    201701139802914842048899546.jpg

    ###部署到好雨云

    OK ,到这里我们的网站写好了,需要将代码提交到好雨云来部署,点新建应用后,好雨平台会给我们一个 git 代码仓库的地址,我们只需要将代码提交到这个地址就可以了。

    201701139199714841924411600.jpg

    在我们本地的myblog项目目录中执行

    # 初始化本地 git 仓库
    git init
    # 添加远程仓库地址
    git remote add goodrain http://code.goodrain.com/app/simtime_gr8904c4.git
    # 执行提交
    git add .
    git commit -m "first commit"
    git push -u goodrain master
    

    提交后,平台自动识别了我们的语言

    201701132669114841927681472.jpg

    在自动构建和部署之后,我们就可以访问到我们的网站了。

    201701135648614842052264688.jpg

    总结

    我们写了不到 60 行代码,将我们的web服务器构建了起来,并写了一个演示用的博客页面,也许你会说这太简单了,没错,确实是这样,但通过这些你可以快速的了解到 web 服务器是如何工作。你还可以将Node.js与更多技术结合,比如HTML5CSS3以及JavaScript,当然还包括种类丰富的库和框架支持。

    PaaS云平台的选择也是一个重点,可以帮助我们快速学习、试验我们的代码,将我们从复杂的配置和运维工作中解脱了出来。

    参考资料: http://abdelraoof.com/blog/2015/10/28/understanding-nodejs-event-loop/ http://doc.goodrain.com/usage/181950

    2 条回复    2017-01-16 09:15:23 +08:00
    qfdk
        1
    qfdk  
       2017-01-14 16:24:46 +08:00 via iPhone   ❤️ 1
    挺好的 node.js 的科普, 部署到自己的服务器更简单
    npm start 就好了
    Goodapp
        2
    Goodapp  
    OP
       2017-01-16 09:15:23 +08:00
    @qfdk 骚年,你很有眼光
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2608 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 01:53 · PVG 09:53 · LAX 17:53 · JFK 20:53
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.