配置云端运行环境并使用vscode连接服务器做云端开发
步骤有点多,但是配置好了之后可以在学校机房直接连接服务器开发而不用每次都重新配置,也不用担心文件丢失
而且这些步骤都是学过的,正好复习一下
1.创建docker容器
这个步骤参考了Linux Django-2.1. 创建django项目
在acterminal中,将镜像上传到自己租的云端服务器:
scp /var/lib/acwing/docker/images/django_lesson_1_0.tar server_name:
登录自己的云端服务器:
ssh server_name
将镜像加载到本地:
docker load -i django_lesson_1_0.tar
创建并运行django_lesson:1.0镜像 :
(22端口用于ssh登录,8080用于live-server服务,需要去云平台放行20000和8081两个端口)
docker run -p 20000:22 -p 8081:8080 --name web_server -itd django_lesson:1.0
进入创建的docker容器:
docker attach web_server
设置root密码:
passwd
创建普通用户acs:
adduser acs
给用户acs分配sudo权限:
usermod -aG sudo acs
挂起容器:
ctrl p + ctrl q
回到acterminal拷贝一下y总的祖传配置文件:
scp .bashrc .vimrc .tmux.conf server_name:
2.配置acterminal免密登录
在acterminal中编辑~/.ssh/config
并加入以下内容
host web
Hostname 你的服务器IP
User acs
Port 20000
将公钥传到容器中:
ssh-copy-id web
输入密码后测试登录:
ssh web
3.配置live-server环境
更新apt软件列表
sudo apt update
sudo apt upgrade
安装nodejs
# 下载14.16.1版本的压缩包(看官网最新好像出到了17.6.0)
wget https://nodejs.org/dist/v14.16.1/node-v14.16.1-linux-x64.tar.xz
# 解压
tar xf node-v14.16.1-linux-x64.tar.xz
# 安装npm和node
sudo ln -s /home/acs/node-v14.16.1-linux-x64/bin/npm /usr/local/bin/npm
sudo ln -s /home/acs/node-v14.16.1-linux-x64/bin/node /usr/local/bin/node
# 检查是否安装成功
node -v
npm -v
安装live-server
# 用npm下载live-server
npm install -g live-server
# 安装live-server
sudo ln -s /home/acs/node-v14.16.1-linux-x64/lib/node_modules/live-server/live-server.js /usr/local/bin/live-server
# 查看是否安装成功
live-server -v
# 创建工作目录和网页文件
mkdir web_lesson
cd web_lesson
touch index.html
# 打开一个tmux窗口,在里面运行live-server服务
tmux
live-server
运行结果:
在浏览器里输入服务器IP:8081
即可访问。
往index.html
中写入内容后保存,网页就会自动刷新。
样例:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Web应用课</title>
</head>
<body>
<h1>第一讲</h1>
</body>
</html>
4.配置本地免密登录
以我的win10操作系统为例:
在cmd中执行ssh-keygen
生成公钥和密钥(之前生成过的不需要重新生成)
生成的时候记一下.ssh
文件夹的位置,比如我的是下面这个:
打开.ssh
文件夹下的config
文件,填入以下信息(和acterminal相同):
host web
Hostname 你的服务器IP
User acs
Port 20000
因为我的win10没有安装
ssh-copy-id
命令,所以这里采用手动复制公钥的方式:用记事本打开
id_rsa.pub
,将里面的内容复制到web
服务器的~/.ssh/authorized_keys
文件中
测试一下:
ssh web
5.vscode连接服务器做云端开发
下载Remote - SSH
插件:
然后左边会出现一个远程资源管理器
的功能:
如果之前配置过免密登录,点开后就会看到可建立连接的选项(我这里是mob
,按照之前的步骤会显示web
),点击红圈位置:
然后就会打开一个新界面
这时上面会有一个下拉框让你选择操作系统,那自然是Linux
之后就是确定工作目录,按下面图片顺序操作即可:
然后就可以愉快地开发啦~
在vscode中保存之后对应的网页也会刷新~
连接成功的样子:
请问acterminal可以用自己电脑上的终端替代吗
可以,第四条写了怎么配置本地免密登录
如果使用Nginx服务部署过了,就不能用同一个服务器了,得租第二个服务器。
你是指Nginx部署过项目之后不能运行code-server服务了吗?还是一台服务器不能运行两个code-server服务?
好像是Nginx部署过项目后不能再用ip+端口号的方式访问了,只能通过域名,所以就不能运行第二个code_server服务。
原来这样,那没办法了,我的code_server只是为了方便在学校机房完成作业的,没有用在Nginx部署的项目上
换端口就行了,如果要用443,就弄个容器映射,我现在已经跑了3个了,2333
是用Ip加端口访问吗
都是域名,只不过不是同一个,要用一个子域名也不是不行
噢噢不过我没有其他的域名还得申请一下hhh
嗯嗯,没有的话就多弄几个子域名
大佬,我的本地终端可以连上服务器,但是vscode 连不上是什么原因啊
vscode的终端连不上吗,还是remote-ssh插件连不上服务器?
为什么图片挂了 显示不出来
因为我的gitee图床仓库被封了,今天才发现(╬▔皿▔)╯,现在可以访问喽~
gitee不是加了防盗链嘛~
对,所以租了个阿里云OSS专门放图片
可以
太硬了
牛
%%%
orz
学习了!
%%%