手把手教你搭建服务器+部署静态网页

引言

最近想搭建服务器玩玩，后面结合物联网进行有趣的diy。这一节先简介如何搭建自己的网页服务器。

需要的工作

服务器部分

web服务部分，在选择服务器的时候可以定制服务，这里使用的是官方提供的nginx服务。

nginx是一个轻量化的web服务，可以进行反向代理。web服务的意思是，服务器可以使用http协议接受和处理请求；反向代理是说它可以对服务端进行代理，以返回特定的内容。

nginx的设置主要由两个文件组成：

1、nginx.conf

user nginx;
worker_processes 1;
error_log /var/log/nginx/error.log warn;
events {
  worker_connections 1024;
}
pid    /var/run/nginx.pid;
http {
  include    /etc/nginx/mime.types;
  default_type application/octet-stream;
  log_format main '$remote_addr - $remote_user [$time_local] "$request" '
            '$status $body_bytes_sent "$http_referer" '
            '"$http_user_agent" "$http_x_forwarded_for"';
  access_log /var/log/nginx/access.log main; 
sendfile    on;
keepalive_timeout 65;
include /etc/nginx/conf.d/*.conf;

这段代码中首先设置了nginx服务的启动用户，进程数（与cpu核心数有关），日志记录地址，每个进程的最大并发连接数等

2、conf.d中的配置文件

这里面存放了不同服务对应的配置信息

  • 默认的配置文件

这里定义了80端口对应的配置，root设置了80端口服务的根目录，以及默认html文件，后面的是进行了php相关设置，比如当我们的html文件中存在需要php进行后端处理的逻辑，则这里需要进行配置。

server {
    listen       80;
    # server_name  localhost;
    root /usr/share/nginx/html;
    index index.html;
    location ~ \.php(.*)$ {
            fastcgi_pass   unix:/var/run/php.sock;
            fastcgi_index  index.php;
            fastcgi_split_path_info  ^((?U).+\.php)(/?.+)$;
            fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
            fastcgi_param  PATH_INFO  $fastcgi_path_info;
            fastcgi_param  PATH_TRANSLATED  $document_root$fastcgi_path_info;
            include        fastcgi_params;
        }
}
  • 自定义配置文件
    这个conf定义了自定义端口8080相应的服务
server {
    listen       8080;
    # server_name  localhost;
    root /root;
    location ~ \.php(.*)$ {
            fastcgi_pass   unix:/var/run/php.sock;
            fastcgi_index  index.php;
            fastcgi_split_path_info  ^((?U).+\.php)(/?.+)$;
            fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
            fastcgi_param  PATH_INFO  $fastcgi_path_info;
            fastcgi_param  PATH_TRANSLATED  $document_root$fastcgi_path_info;
            include        fastcgi_params;
        }
}

网页部分

html语言采用标签的方式进行设置，其中所有内容都在html标签内，head用于设置网页的信息，body用于设置每个不同的模块等

<!DOCTYPE html>
<html>

<head>
        <title>xxx</title>
        <meta charset="utf-8">
        <meta name="Author" content="wangjunhe">
</head>

<body>
<h1>yyy</h1>

<ul>
        <li><a href="https://www.baidu.com">百度</a></li>
        <li><a href="https://www.google.com/?client=safari">谷歌</a></li>
</ul>
</body>

</html>

结语

这样，我们的网页就完成了，给大家看下暂时的样子: