前言：
这是我第一次在CSDN上发文章。一方面感谢众多大佬在平台上无私的分享，让我不那么艰难地从无到有拼凑出了一个基本的网页并且能够实现一些基本功能；另一方面我也希望能够留下学习的记录，希望可以帮助到以后的我甚至更多人。
下面我直接开始详细的步骤，原理性的描述和整体的架构放在全部完成之后再来修饰和总结，最后形成系统的文章（其中多有错误，希望大佬们在评论中友善指出，感激不尽）。
一、取得服务器
因为搭建的框架不甚复杂，所以可以直接使用腾讯云的轻量应用服务器（搭配学生优惠性价比较高）。
1.进入轻量应用服务器界面
2.选择合适的配置，点击购买（需要登录并且实名认证）
地域最好选和自己地理位置近的，可以降低延迟。
镜像就是服务器搭载的系统，此处可以选择 Linux Ubuntu20.04。
注意：后面还有一栏Docker基础镜像，是在系统镜像的基础之上默认封装了Docker软件等等。为了便于之后的功能扩展，这里我选择Linux Ubuntu20.04-Docker20。
3.进入控制台，配置ssh远端登录
购买完毕后可以进入轻量应用服务器的控制台，这里可以查看服务器的各种信息，使用较多的是公网IP，安全组和防火墙，后续使用到会介绍相应功能的位置。
远程登录栏，点击一键登录就可以在浏览器内免密登录服务器，可以直接开始键入命令开始操作。但是每次使用服务器都需要先扫码登录腾讯云进入控制台再一键登录，流程难免繁琐，加上浏览器窗口字体过小又无法调整，本人不太愿意使用这个登录方式。
此处介绍使用ssh远端登录的方法。
1）在控制台重置密码
在实例信息栏找到重置密码按钮，点击，可以选择用户名，可以选Ubuntu默认用户，也可以自定义为root用户。这里按照习惯使用root用户，输入密码后确认关机。
但是Ubuntu默认不允许root用户ssh远端登录，需要进入服务器先行配置。根据腾讯文档轻量应用服务器 常见问题 - 文档中心 - 腾讯云中的步骤，在控制台先用一键登录进入服务器配置。（注意，从控制台一键登录的窗口不能Ctrl+V，右键粘贴即可）
2）Windows内置ssh登录
快捷键Win+R打开运行，输入cmd回车，在之后的窗口中输入：
ssh root@xx.xx.xxx.xx 
之后回车，中途也许会提示，输入y来确认，继续输入密码即可登录到服务器上，和在控制台的窗口一样。
（小技巧：右键窗口，选择属性，可以设置自己喜欢的字体和大小）
到此为止，已经成功获得了一个服务器并且实现了远端登录。
二、配置Nginx环境
作为一个网页服务器，需要一个支持网页的框架。目前主流选择是apache，它和PHP也很兼容。具有同样功能的Nginx具有轻量化的特点，同时还可以反向代理，这里就选择Nginx作为web服务器。
1.安装Nginx
在Ubuntu上安装程序大部分可以使用apt-get命令，可以很快捷地安装各种应用。
1）ssh远程登录至服务器，输入命令：
在正式安装之前，可以先更新一下apt源，否则可能报错。（提示：命令apt和apt-get在这里可以视为相等，但是有细微区别，根据市场趋势，更推荐使用apt命令。）
apt update也可以顺便升级一下已有的packages：（过程中的所有选项我全部选择y）
apt upgrade更新完毕之后输入命令安装nginx：
apt install nginx （小提示：右键相当于粘贴功能）回车后出现如下界面：
输入y确认安装，之后无需操作。再次出现光标的时候表示安装完成。输入下面命令查看是否安装成功：
nginx -v
出现版本号表示安装成功。
2）启动Nginx服务
输入命令启动服务：
service nginx start之后打开浏览器，在地址栏直接输入服务器的外网IP，出现以下界面表示安装成功。
2.部署测试网页
刚刚显示的网页就是这个服务器的网页内容，为了展示终端传输过来的数据，我们对网页稍作改动，覆盖原网页。
1）准备文件传输
这里涉及到一个本机和服务器端文件传输的问题，要想把本地写好的网页文件传到服务器，此处我使用WinSCP软件。
打开软件，文件协议保持不变；主机名为外网IP；端口号不变；用户名为刚刚设置的root；密码同理。如果长期使用的话建议点击下方保存，甚至可以勾选记住密码，这样下一次使用的时候就无需输入密码了。
登录成功后，栏目左侧为本机的文件目录，右侧为服务器的内容。为了验证Nginx的静态网页内容，我们可以在右侧栏目中进入var/www/html文件夹，这里是存放网页文件的默认目录。
直接将服务器目录中的文件拖拽到左边本地目录，之后可以本地打开，可以发现和服务器上打开的网页一模一样。
2）制作测试网页
可以在本地重新创建一个html文件，也可以直接改刚刚从服务器下载的文件。上号VS Code，开始修改代码。
<!DOCTYPE html>
<html>
<head>
<title>Welcome to nginx!</title>
<style>
body {
width: 35em;
margin: 0 auto;
font-family: Tahoma, Verdana, Arial, sans-serif;
}
</style>
</head>
<body>
<h1>Hello, nginx!</h1>
<p>下面将展示从终端发送的数据:</p>
<p id='demo'></p>
</body>
</html>预留一个空的p标签，便于后期使用JS插入内容。接下来把这个文件用WinSCP上传到服务器，直接覆盖。再次用浏览器打开服务器，显示如下页面：（注意：文件命名一定需要是index.html，否则Nginx不会默认以这个文件为主页）
非常尴尬，中文乱码了。根据经验跟编码有关系，上网搜索相关的问题，发现需要配置Nginx解析utf-8。这里顺带介绍一下命令行编辑文件（上面在配置root远程登录的时候有用到过，这里再练习一次）。
3）修改Nginx配置支持uft-8
首次使用命令行其实是相当不习惯的，因为没有类似Windows的资源浏览器，也记不住文件的结构。后来发现可以使用命令：ls 展示文件列表，只能说聊胜于无吧。
使用命令进入配置文件所在的目录（cd表示进入，空一格，etc是Linux默认的程序配置文件的存放目录）：
cd /etc/nginx使用ls命令，可以发现一个叫nginx.conf的文件，使用vim打开文件浏览器：
vim nginx.conf按i进入编辑模式，在光标的位置加入一行（注意分号结尾）：
charset utf-8; 
按Esc，输入:wq表示写入并退出。输入下面命令重启Nginx：
nginx -s reload再次进入网页，按Ctrl+F5彻底刷新（清除浏览器本地缓存的静态文件刷新，比如css和js文件，如果后期需要频繁修改这类文件的话，部署之后需要彻底刷新，否则浏览器不会立即更新静态文件），可以看到正常了。
至此网页的配置就告一段落了，如果只是想使用静态网页展示的话，到这里就应该能够实现了。
下一期文章我将使用Python处理服务器的TCP链接，实现服务器与终端的交互操作和数据传输。
873
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
