Vue项目部署及阿里云服务器配置

282 阅读1分钟

1、购买服务器(我购买的是window系统的)

2、设置实例密码(用于登录服务器的)

image.png

3、远程链接服务器(公网登录输入用户名与密码)

4、登录成功后进入浏览器下载安装nginx (WEb服务器搭建必备)

image.png

5、安装成功后点击nginx.exe启动,在浏览器输入127.0.0.1:8080代表启动成功,如果遇到不确定启动是否成功,可以搜索任务管理器查看进程是否启动,进程不存在可能是端口被占用,在conf文件夹的nginx.conf改写listen为其它端口如8099,浏览器输入127.0.0.1:8099出现welcome则成功

6、在nginx文件设置外网服务器ip(即购买的服务器ip,用于外网访问)

image.png

7、外网ip设置好后可以尝试在内网服务器访问120.27.223.66:8099是否可以访问,不可以访问更换端口,重启nginx,查看nginx进程是否存在

8、外网ip配置好后把vue打包好的项目文件test放置在html文件目录下,然后配置nginx文件,在location里面指定test文件夹与执行index.html文件

image.png

image.png

9、进入阿里云安全组,点击配置规则,手动添加配置规则,将刚刚添加的8099加入规则,授权对象为0.0.0.0/0

image.png

image.png

10、在自己的笔记本里面输入120.27.223.66:8099,此时项目成功打开即配置成功

image.png

不小心开启服务器防火墙导致远程链接无法链接 找到云助手创建命令

选择PowerShell命令

输入以下(关闭服务器)命令点击执行

image.png

image.png

Set-NetFirewallProfile -Profile Domain,Public,Private -Enabled False