Nginx的Web建站功能

前言

相信很多小伙伴和我最开始学习的时候一样，对Nginx一知半解，知道它是一款轻量级的Web服务器，反向代理服务器，也能说出它的一些优缺点，也会自己安装部署，但究竟如何去使用，还是一头雾水，这里我简单的介绍下Nginx作为Web服务器的功能。

前置准备

没有安装Nginx的可以看我往期博文

Centos7下部署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