xshell下部署静态网页（阿里云服务器，小白入门）

淡淡的烟草味﹌ 2021-09-21 08:40 402阅读 0赞

第一次部署静态网页，自己太笨，感觉自己啥也不懂，疯狂百度，加上请教别人，弄了一天，终于完成了。

下面来说一下这次的经历。

### **1.注册云服务器** ###

**这里我因为是小白，所以注册了阿里云那个免费半年的服务器来练练手，这个仅学生可以领哦**。

下面附上网址：[https://developer.aliyun.com/adc/student/?spm=5176.11399505.0.0.20945631bvPQBf&tdsourcetag=s\_pctim\_aiomsg][https_developer.aliyun.com_adc_student_spm_5176.11399505.0.0.20945631bvPQBf_tdsourcetag_s_pctim_aiomsg]

**我这里选的是Ubtuntu的操作系统。然后查看实例中的公网ip地址（下面连接时会用到）。**

### **2.远程连接云服务器** ###

**我这里是在本地下载了xshell和xftp,安装好了之后，点击文件下方的图标新建会话，进行连接，名称随便起，然后主机那里填写公网ip地址，重新连接勾选上，其他的默认就好。**

![20200626092731324.png][]![20200626100328901.png][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70][]

**连接成功后进入这样一个页面。**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 1][]

**点击帮助下面绿色的文件夹，可以传输文件。是这样一个页面。左边是自己电脑的文件，右边是你服务器要用的文件。**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 2][]

### 3.安装nginx ###

**第一步：在线安装（我这里是Ubuntu的操作系统）,在xshell中输入以下代码：**

apt install nginx

**第二步：启动**

$sudo /etc/init.d/nginx start

**第三步：去配置阿里云的服务器安全组，使80端口开放。点击实例右侧的更多->网络和安全组->安全组配置->配置规则。在入方向添加允许80端口访问。**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 3][]![20200626094443299.png][]

**这时候访问公网ip,应该会出现如下测试页面,则代表配置成功。**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 4][]

**接下来就是上传自己写好的网页了。**

**外网用户访问服务器的 Web 服务由 Nginx 提供，Nginx 需要配置静态资源的路径信息才能通过 url 正确访问到服务器上的静态资源。  
打开 Nginx 的默认配置文件 /etc/nginx/nginx.conf ，修改 Nginx 配置。**

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 5][]

**在server里面修改root  /var/www/html，之后你把那你的html文件都放到这个目录下就可以访问到了。**

**然后http://公网ip/文件名，就可以访问到你放的网页啦！**

[https_developer.aliyun.com_adc_student_spm_5176.11399505.0.0.20945631bvPQBf_tdsourcetag_s_pctim_aiomsg]: https://developer.aliyun.com/adc/student/?spm=5176.11399505.0.0.20945631bvPQBf&tdsourcetag=s_pctim_aiomsg
[20200626092731324.png]: https://img-blog.csdnimg.cn/20200626092731324.png
[20200626100328901.png]: https://img-blog.csdnimg.cn/20200626100328901.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70]: /images/20210920/8b459b7bfb784dfa8c64eb737fe305fe.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 1]: /images/20210920/61e0598082df4d7f9e99923e67049d5f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 2]: /images/20210920/43041427e38f48f4b28f7195a4c0c768.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20200626094326651.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4,size_16,color_FFFFFF,t_70
[20200626094443299.png]: /images/20210920/b725363f11fe4c21a30140409aa12446.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 4]: /images/20210920/ed190553589e4ced98b049de44e26562.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNjc5ODE4_size_16_color_FFFFFF_t_70 5]: /images/20210920/c5d3efe86e4544638f9ff03298025b6b.png