前端网页发布到nginx_nginx部署前端页面

关于nginx

现在很多网站都是使用 nginx当静态文件服务器和反向代理服务器

从维基百科上摘两段话吧

Nginx(发音同engine x)是一个网页服务器，它能反向代理HTTP, HTTPS, SMTP, POP3, IMAP的协议链接，以及一个负载均衡器和一个HTTP缓存

Nginx是一款面向性能设计的HTTP服务器，相较于Apache、lighttpd具有占有内存少，稳定性高等优势。与旧版本(<=2.2)的Apache不同，nginx不采用每客户机一线程的设计模型，而是充分使用异步逻辑，削减了上下文调度开销，所以并发服务能力更强。整体采用模块化设计，有丰富的模块库和第三方模块库，配置灵活。 在Linux操作系统下，nginx使用epoll事件模型，得益于此，nginx在Linux操作系统下效率相当高。同时Nginx在OpenBSD或FreeBSD操作系统上采用类似于epoll的高效事件模型kqueue。

安装 nginx

为了方便, 我们使用apt-get 安装, 有兴趣也可以看看怎么源码安装

我们首先使用中科大的镜像提高一下软件的安装速度(腾讯云默认使用它的内网镜像, 速度更快, 不需要进行这一步)

sudo sed -i 's/archive.ubuntu.com/mirrors.ustc.edu.cn/g' /etc/apt/sources.list

sudo apt-get update

然后安装nginx

sudo apt-get install nginx

启动 nginx

sudo service nginx start

打开浏览器访问 http://你的ip 将看到nginx默认界面

上传你的网页到服务器

这里我们使用scp 命令将我们的前端页面上传至服务器. Windows系统使用在网页所在的文件夹的上层目录打开git bash, Linux 系统直接用终端就好.

scp 命令的用法如下

scp -r 你的页面目录 你的服务器用户名@你的服务器ip:/home/你的用户名

举个scp的例子

例子:假设你的前端页面在桌面的myHtml文件夹里面, 你的服务器 ip 是 192.168.1.2, 用户名是 ubuntu , 那就是在桌面打开 git bash ,然后输入

scp -r myHtml ubuntu@192.168.1.2:/home/ubuntu

如果不喜欢命令上传, 也可以使用winscp这个图形化的上传工具

修改nginx配置文件

vi /etc/nginx/sites-available/default

找到下面这一段

location / {

# First attempt to serve request as file, then

# as directory, then fall back to displaying a 404.

try_files $uri $uri/ =404;

# Uncomment to enable naxsi on this location

# include /etc/nginx/naxsi.rules

}

在后面添加

location /myHtml {

index index.html;

root /home/ubuntu;

}

保存后退出

然后重新加载 nginx的配置文件

nginx -s reload

最后打开浏览器, 输入 http://服务器ip/myHtml

就能看到你的网页啦