阿里云服务器初尝试

建站记录

前端小菜鸟,希望能在工作之余想要看mob端运行效果的有气势兼容性效果的时候,能稍稍方便点,于是想到建站。第一次接触云服务器,想要记录建站全过程,便于日后参考。


1. 阿里云服务器

1.1 服务器购买

有可能是最近活动还是不知道咋,一年的资源还是很很便宜的,选择了对我来说够用的配置。
在这里插入图片描述

1.2 密码重置

付完钱没两分钟短信就发过来提示实例创建成功了,并且提示需要去实例详情中重置下密码。
在这里插入图片描述

1.3 控制台登录

先在控制台连接看了下,是可以正常登录的。

2. 远程连接

也不知道Mac用什么样的远程连接工具比较好用,我又是一个懒得利其器,想赶快善其事的懒工,还是说干就干,懒得去研究了,直接在App Store 中安装了PortX,连接倒是很方便,输入了下用户名和密码就连接上了。
本地成功远程连接服务器

3.服务器yum安装

3.1 出现问题

# 安装命令
sudo apt-get install yum

报错信息:
E:Unable to locate package yum
yum安装报错

3.2 解决

以下参考文章:https://blog.csdn.net/SH_ke/article/details/118496704

#修改sourcelist
#1. 备份源文件
sudo cp /etc/apt/sources.list /etc/apt/sources.list.bak
#2. 打开文件,通过vim操作方法添加下面的源
sudo vim /etc/apt/sources.list
#3. 保存退出后运行以下命令,更新源
sudo apt-get update
# 以防失败,用于恢复原list的命令
sudo cp /etc/apt/sources.list.bak  /etc/apt/sources.list

这里的源我只是尝试将阿里云源添加上去了,结果竟然管用了,如果不管用,可尝试其他。

# 阿里云源
deb http://mirrors.aliyun.com/ubuntu/ trusty main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ trusty-security main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ trusty-updates main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ trusty-proposed main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ trusty-backports main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ trusty main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ trusty-security main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ trusty-updates main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ trusty-proposed main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ trusty-backports main restricted universe multiverse

# 网易源
deb http://mirrors.163.com/ubuntu/ utopic main restricted universe multiverse
deb http://mirrors.163.com/ubuntu/ utopic-security main restricted universe multiverse
deb http://mirrors.163.com/ubuntu/ utopic-updates main restricted universe multiverse
deb http://mirrors.163.com/ubuntu/ utopic-proposed main restricted universe multiverse
deb http://mirrors.163.com/ubuntu/ utopic-backports main restricted universe multiverse
deb-src http://mirrors.163.com/ubuntu/ utopic main restricted universe multiverse
deb-src http://mirrors.163.com/ubuntu/ utopic-security main restricted universe multiverse
deb-src http://mirrors.163.com/ubuntu/ utopic-updates main restricted universe multiverse
deb-src http://mirrors.163.com/ubuntu/ utopic-proposed main restricted universe multiverse
deb-src http://mirrors.163.com/ubuntu/ utopic-backports main restricted universe multiverse

# 搜狐源列表
deb http://mirrors.sohu.com/ubuntu/ utopic main restricted universe multiverse
deb http://mirrors.sohu.com/ubuntu/ utopic-security main restricted universe multiverse
deb http://mirrors.sohu.com/ubuntu/ utopic-updates main restricted universe multiverse
deb http://mirrors.sohu.com/ubuntu/ utopic-proposed main restricted universe multiverse
deb http://mirrors.sohu.com/ubuntu/ utopic-backports main restricted universe multiverse
deb-src http://mirrors.sohu.com/ubuntu/ utopic main restricted universe multiverse
deb-src http://mirrors.sohu.com/ubuntu/ utopic-security main restricted universe multiverse
deb-src http://mirrors.sohu.com/ubuntu/ utopic-updates main restricted universe multiverse
deb-src http://mirrors.sohu.com/ubuntu/ utopic-proposed main restricted universe multiverse
deb-src http://mirrors.sohu.com/ubuntu/ utopic-backports main restricted universe multiverse

当下的个人理解:报无法定位包的错,只是因为源中没有含该包的地址,所以,多加几个试试?

3.3 继续安装

# 安装命令
sudo apt-get install yum

可能会报缺少相关依赖包的错误,按提示挨个sudo apt-get install 即可
缺少依赖包

4 nginx安装

4.1 徒劳记

nginx安装失败
本来安装yum是想安装nginx的,结果给我报了这个错,yum repolist all,我也看了,返回了个0,又开始寻找解决方法了。。。
查了一会发现了这个https://blog.csdn.net/weixin_41931602/article/details/83211455,文章中说“centos中使用才可以,这里使用的是Ubuntu,ubuntu默认软件包管理器不是yum,而是dpkg,安装软件时用apt-get你说的网上常见法解决方法,命令改为代码:sudo apt-get install net-tools,这样就安装好了”。
由于Linux知识欠缺,现在还不是特别理解,默默接受,看明白的是,刚刚折腾了一大圈的yum是白装了,于是

sudo apt-get install nginx -y

4.2 nginx启动

此处按照查来的操作进行

# 1. 开启防火墙
systemctl start nginx
# 2. 启动nginx
service nginx start

# ps: nginx重启命令
nginx -s reload
# ps:nginx关闭命令
service nginx stop

4.3 端口开通

nginx启动之后就可以在浏览器中输入公网IP试试能不能访问成功了,我尝试了一下是没反应的,按大佬的说法,需要在阿里云配置安全组规则,进入实例详情->安全组:
安全组规则添加
后三条是原有的,建议还是自己手动添加点一条出来,按如上规则填写。我先是自己编辑的一条,一不小心更改了原来的规则,导致本地客户端连接不上了,阿里云控制台也连接不上了,然后自己又恢复了原来的,虽然不知道是不是原样的,但好歹连接成功了。。。又是不知道原理的一个地方,再给自己打个问号,路漫漫其修远兮。
此时,重启nginx,再去浏览器中输入公网地址八成就是成了吧,我这边还需要一些配置
访问成功

4.4 nginx配置

接下来就到了nginx配置的部分了,不得不说,处处是盲区。
nginx实现反向代理的关键在于nginx.conf文件中的配置,首先我们可以看看文件存储在哪里。

whereis nginx.conf

一般好像都是存储在etc目录下的,可以直接用vim打开,自己也可以去看下目录层级。

vi /etc/nginx/nginx.conf

5 上传

5.1 本地文件准备

因为是初次尝试,所以随便初始化了一个react项目,直接npm run build了一下看看效果。

5.2 sftp配置

现在突然觉得之前安装的portx很好用了,ssh连接和sftp上传都可以搞定。
点击右上角的三个点,选择SFTP,配置上传的信息。sftp上传
配置如下:

  1. 第一个tab的配置是有关远程连接信息的,Name似乎随便填就可以,协议就是SFTP,IP地址是阿里云提供的公网地址,端口号正常22(当然,需要在控制台安全组那边配置下该端口)
    远程信息
    2.第二个tab的配置如下,填写服务器的登录账号密码即可。
    服务器权限
  2. 最后一个tab填写的是文件信息,需要选择下本地文件的路径和上传到的目标目录
    路
    配置完成后,点击connect即可。

5.3 上传

连接成功的话应该展示的是如下窗口,左边是本地选择的目录文件夹,右边是服务器的目录,从这里可以看出我们之前在浏览器中输入IP的时候,使用的页面就是/var/www/html中的这个index.nginx-debian.html文件,所以我也将我的大包文件丢在了这里,自己创建一个自己的目录将文件拖进去即可:
在这里插入图片描述
在浏览器中输入 公网IP/build,可以看出其实是访问成功了的,但是还有一点点的小问题需要解决一下。
访问半成功

5.4 解决

先是翻了好些资料,大概是如这位大佬所说解决create-react-app build 后静态资源文件夹(static)路径不对,于是乎照做,未生效。

又翻了好些资料,看到这位大佬的文章关于react 在打包后:“找不到资源路径”的问题、部署到服务器二级目录 “打开为空白” 的问题,虽然不信,且不理解,但还是试了下,
发现自己把自己坑到了,似乎是因为我在html下面建立了一个二级目录build导致的,给他们挨个挪出来,如图所示:
在这里插入图片描述
于是,效果图如下,感觉以上两个需要同时结合生效,长记性了。
成功图

总结

以上就是初次动手的全程了,虽然也踩坑,总体来说还算是顺利👌

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值