简单使用node + nginx部署你的网站

前言

现在公司项目本地使用node实现前后端分离,服务器使用的是 nginx + tomcat 的部署方式。实际上前后端分离的技术完全可以用在node部署上。


本地准备


本地只需要准备下面几个文件:

1)网站的静态资源文件:包括html、js、css、图片等资源。static和view的目录结构参考上图左侧,如果你的网站目录结构不同,只需要在server.js文件中重新配置下路由;

2)package.json:既然使用node部署,那肯定会用到node的一些模块和框架,比如path和express。这个json文件用于记录node依赖的模块和框架,内容如下:

{
  "name": "app-server",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.16.3",
    "path": "^0.12.7"
  }
}
复制代码

3)server.js: 主要文件,用于搭建node服务端,内容如下:

// 依赖项
var express = require('express');
var app = express();
var path = require('path');

// 设置登录页和主页访问路径
app.get('/index', function (req, res) {
    res.sendFile(__dirname + '/' + 'view/html/index.html');
});
app.get('/login', function (req, res) {
    res.sendFile(__dirname + '/' + 'view/html/login.html');
});
app.get('/', function (req, res) {
    res.sendFile(__dirname + '/' + 'view/html/login.html');
});
// 托管静态文件
app.use('/static', express.static(path.join(__dirname, 'static')));
app.use('/view', express.static(path.join(__dirname, 'view')));

// 生成服务器并监听
var server = app.listen(8080,'localhost',function () {//(3.2.3)
    var host = server.address().address
    var port = server.address().port
    console.log('应用实例,访问地址为 http://%s:%s', host, port)
});
复制代码

上面代码主要干了两件事:路由控制和搭建服务器。


开始部署


1)拷文件

  1. 登录你的服务器(我的服务器是window系统)
  2. 把上面的本地文件拷到服务器的C:\Home目录下

2)安装node和nginx

nginx-1.15.3 安装文件: pan.baidu.com/s/17H-S-zdF… 提取码: p3ks 下载后我是放在服务器c盘根目录下。

node v8.11.2 安装文件: pan.baidu.com/s/17H-S-zdF… 提取码: p3ks 下载后在服务器安装,安装时的选项都选择默认,会自动配好环境变量。

3)配置node和nginx

  1. 启动node服务:打开cmd,进去C:\Home\web\路径下,先后执行npm install安装依赖和node server.js启动服务,看到下面的信息表示启动成功,注意不要关闭这个cmd窗口:

  1. 启动nginx:
  • 修改nginx配置文件(如果你的nginx是从分享的网盘下的,那可以省略这一步)打开C:\nginx-1.15.3\conf\nginx.conf文件,找到server节点,修改配置:
  • 再打开一个cmd,进入到C:\nginx-1.15.3\路径下,执行start nginx.exe,如下所示,如果没报什么错误的话表示启动nginx成功。

4)部署完成,可以开始使用外网访问你部署的网站了。

这里是登录页

这里是主页

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值