Nginx的Web建站功能
前言
相信很多小伙伴和我最开始学习的时候一样,对Nginx一知半解,知道它是一款轻量级的Web服务器,反向代理服务器,也能说出它的一些优缺点,也会自己安装部署,但究竟如何去使用,还是一头雾水,这里我简单的介绍下Nginx作为Web服务器的功能。
前置准备
没有安装Nginx的可以看我往期博文
如果能够浏览器访问,则说明安装成功
原理说明
通俗易懂的说明下Nginx怎么实现Web浏览器的
可以查看Nginx默认的网页源码
这些都是安装Nginx自带的网页文件,那么是否能用我们自己写好的网页文件给替换掉,输入IP地址浏览器访问到的就是我们自己写好的网页文件了呢?如果在换成公网IP,是否大家也能够访问了呢?如果再通过公网IP申请一个域名,是否就是我们平时访问的网站了呢?
答案是肯定的,当然一个能够上线的网站远远不止这么简单,但这些都是能够实现的基础
修改网页文件
进入Nginx安装后的网页文件位置
这是自带的网页配置文件
[root@k8s-node-2 ~]# cd /usr/share/nginx/html/
[root@k8s-node-2 html]# ls
50x.html index.html
[root@k8s-node-2 html]# cat index.html
<!DOCTYPE html>
<html>
<head>
<title>Welcome to nginx!</title>
<style>
html {
color-scheme: light dark; }
body {
width: 35em; margin: 0 auto;
font-family: Tahoma, Verdana, Arial, sans-serif; }
</style>
</head>
<body>
<h1>Welcome to nginx!</h1>
<p>If you see this page, the nginx web server is successfully installed and
working. Further configuration is required.</p>
<p>For online documentation and support please refer to
<a href="http://nginx.org/">nginx.org</a>.<br/>
Commercial support is available at
<a href="http://nginx.com/">nginx.com</a>.</p>
<p><em>Thank you for using nginx.</em></p>
</body>
</html>
将自带的网页文件删除或重命名
[root@k8s-node-2 html]# mv index.html 1
[root@k8s-node-2 html]# ls
1 50x.html
此时再重新浏览器访问,可以看到已经没有了之前的欢迎页面,报了403的错误
准备你写好的网页文件,命名为index.html 上传至该目录下
这里只是演示,我就随便找了个网页文件
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/new_file.css" />
<title>人民铁军-铁军由来</title>
</head>
<body>
<div id="page">
<ul id="pictures">
<li><img src="img/dunpai.jpg" </li>
<li><img src="img/yeting.jpg" </li>
<li><img src="img/heying.jpg" </li>
<li class="last"><img src="img/dazhang.jpg" </li>
</ul>
<h1><span>人民铁军</span></h1>
<h2>朱德</h2>
<div id="intro">
<ul>
<li>[<a href="index.html">网站首页</a>]</li>
<li>[<a href="origin.html">铁军由来</a>]</li>
<li>[<a href="history.html">战斗历程</a>]</li>
<li>[<a href="general.html">铁军将帅</a>]</li>
<li>[<a href="tenfirst.html">十个第一</a>]</li>
<li>[<a href="spirit.html">铁军精神</a>]</li>
</ul>
<p>
铁军是指中部战区127旅,是一支历史悠久、战功卓著的英雄部队,是中国共产党掌握的
第一支武装力量,素有“铁军”之称。
<p>
听党指挥,忠于人民,坚贞不渝的铁的信念;不怕牺牲,敢于胜利,百折不挠的铁的意志;军民一致,牢不可破的铁的团结;
令行禁止,知己严明,秋毫无犯的铁的纪律;勇猛顽强,英勇善战,所向无敌的作风。
</p>
</div>
</div>
</body>
</html>
然后将你写好的文件,上传至服务器或者虚拟机中
注意:在没有修改Nginx配置文件的前提下,一定要上传默认目录中:/usr/share/nginx/html
[root@k8s-node-2 html]# pwd
/usr/share/nginx/html
[root@k8s-node-2 html]# ls
1 50x.html index.html
[root@k8s-node-2 html]# cat index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="css/new_file.css" />
<title>人民铁军-铁军由来</title>
</head>
<body>
<div id="page">
<ul id="pictures">
<li><img src="img/dunpai.jpg" </li>
<li><img src="img/yeting.jpg" </li>
<li><img src="img/heying.jpg" </li>
<li class="last"><img src="img/dazhang.jpg" </li>
</ul>
<h1><span>人民铁军</span></h1>
<h2>朱德</h2>
<div id="intro">
<ul>
<li>[<a href="index.html">网站首页</a>]</li>
<li>[<a href="origin.html">铁军由来</a>]</li>
<li>[<a href="history.html">战斗历程</a>]</li>
<li>[<a href="general.html">铁军将帅</a>]</li>
<li>[<a href="tenfirst.html">十个第一</a>]</li>
<li>[<a href="spirit.html">铁军精神</a>]</li>
</ul>
<p>
铁军是指中部战区127旅,是一支历史悠久、战功卓著的英雄部队,是中国共产党掌握的
第一支武装力量,素有“铁军”之称。
<p>
听党指挥,忠于人民,坚贞不渝的铁的信念;不怕牺牲,敢于胜利,百折不挠的铁的意志;军民一致,牢不可破的铁的团结;
令行禁止,知己严明,秋毫无犯的铁的纪律;勇猛顽强,英勇善战,所向无敌的作风。
</p>
</div>
</div>
</body>
</html>
浏览器访问
此时通过浏览器访问,就可以看到,是我准备的网页文件
由于我没有上传图片,所以图片就不能加载出来, 我是在虚拟机演示的,所以只有自己本地能访问
想要别人也看到就需要一个公网IP,因为内网IP只有局域网内能够访问
配置文件说明
一般情况下,浏览器输入IP地址,默认访问的是80端口,如果你不想输入IP地址就跳转你的网页,可以修改Nginx的默认端口号
如果你不想修改原本Nginx自带的欢迎页面,也可以在配置文件中修改Nginx默认访问的位置
进入Nginx的配置文件
这个可能不同版本的Nginx的配置文件在的地方不一样
下面以我安装的Nginx1.24为例
[root@k8s-node-2 ~]# cd /etc/nginx/
[root@k8s-node-2 nginx]# ls
conf.d fastcgi_params mime.types modules nginx.conf scgi_params uwsgi_params
[root@k8s-node-2 nginx]# cd conf.d/
[root@k8s-node-2 conf.d]# ls
default.conf
[root@k8s-node-2 conf.d]# vim default.conf
==注意:==如果要修改Nginx的配置文件,修改过后需要重新加载配置文件才能生效
重新加载命令:nginx -s reload