上课摸鱼必备 -- Vscode网页版的搭建教程
时间：2023-07-02 14:39:01 | 来源：网站运营
时间：2023-07-02 14:39:01 来源：网站运营
上课摸鱼必备 -- Vscode网页版的搭建教程：
上课摸鱼必备 -- Vscode网页版的搭建教程
前言
上课想练练数据结构与算法？或者就是想玩玩儿Vscode？或者有一个自己的服务器，但是觉得没有利用到极致？那么这篇文章将带你搭建一个在线版的Vscode，利用浏览器实现全平台使用Vscode，管你什么手机，Pad，电脑，板砖，咳咳，整就完了！！！
文章中所有的超链接都是很不错的资源，建议都要仔细看看，为了不让文章那么太长，所以我用了不少超链接。
本文搭建环境：开源项目code-server，一台服务器（至少一核2G才能有比较流畅的效果）
如果本文对你有帮助的话，还望关注，点赞，转发，收藏，谢谢咯。（一）运行效果
这个Vscode在线版是运行在我买的阿里云学生机的9999端口的，毕竟9.9一月，对于学生党很友好，我的个人博客也搭在上面的，性能一般，但是也很够用了。
（二）基础配置
1 - 下载code-server到服务器上
进到服务器的SSH中，这个只要你买了服务器应该都可以用SSH的，服务器还没买的，也不会用服务器的，看以下几篇文章（其实不限制与阿里云的，不是推广阿里云哈，其他云怎么用大家自行选购，因为我用的是阿里云，所以这几篇文章也都是阿里云的一些使用教程）：
- https://zhuanlan.zhihu.com/p/368487727
- https://www.zhihu.com/search?type=content&q=%E9%98%BF%E9%87%8C%E4%BA%91%E5%AD%A6%E7%94%9F%E6%9C%BA%E6%95%99%E7%A8%8B（自己挑着看）
- https://blog.csdn.net/u011002997/article/details/83933365
官网上应该也还有比较完善的使用手册啥的，深入玩一下的话，建议自己多研究研究，上面这几篇文章也是我大体看上去不错的，要想明白究竟怎么用的还是要自己用好搜索引擎。
wget https://github.com/cdr/code-server/releases/download/v3.10.2/code-server-3.10.2-linux-amd64.tar.gz这一步下载速度可能会很慢，甚至中途失败，可以考虑挂代理，不会Linux下挂代理的，看我下面的骚操作
当然，你最好有一个梯子，这样总归是要更快和更稳定的。
下面我将演示如何在Windows下下载code-server再传到服务器上：
- 首先我想介绍一下我使用过那么多的SSH最好用的一款软件：Termius
这个软件是真正的全平台，而且简直是我这种颜值控福利，终端各种皮肤，贼好看，如果你有幸申请到Github学生包的话，还有其他不少福利。
关于Termius的使用教程 - 在Windows下载code-server的压缩包
点击这个链接
再点这个，就开始下载了
- 下载完压缩包之后，找到下载的位置，然后就要介绍Termius的SFTP功能
选中你的服务器
先找到你本地压缩包的网址，选中你本地的压缩包，直接拖到服务器上就行（哎，真不错，我就是玩儿）
- 传过去之后现在你可以到你的服务器中ls -a一下，看看它在不在
那么以上就是下载的全部内容了
2 - 解压安装试运行（运行部分可以先不弄，下一步的更好用）
tar -xvzf code-server-3.10.2-linux-amd64.tar.gzmv code-server-3.10.2-linux-amd64 code-serverPS：得确保你开了9999端口，下面是我的服务器防火墙配置
为啥不用8080端口？戳这
cd code-serverexport PASSWORD="你想设置的密码"./code-server --port 9999 --host 0.0.0.0 --auth password- –port 9999 指定端口，缺省时为 8080
- –host 0.0.0.0 允许公网访问，缺省时为 127.0.0.1，只能本地访问
- –auth password 指定访问密码，可通过 export 命令设置，参数为 none 时不启用密码
./code-server --help- 运行后，打开 Chrome 访问“服务器公网IP:端口”，效果图：
服务器公网IP去哪里查？ 戳这
（三）高级配置
我们都知道Linux是可以写shell脚本的，那么为了简化以上操作，也为了让其根据我们意愿后台运行或者终止，我们着手写两个脚本，start.sh和shut.sh(脚本是要写在code-server目录的奥)
脚本执行目标
- start.sh
- 开启code-server，后台运行该进程
- 记录当前进程的PID，也专门记录一个日志log文件便于以后查看
- 将PID存到文件里面
#start.sh
export PASSWORD="412523"
nohup ./code-server --port 9999 --host 0.0.0.0 --auth password > test.log 2>&1 &
echo $! > save_pid.txt
#shut.sh
kill -9 'cat save_pid.txt'
（四）Ios端/IpadOS端的最佳使用方式
本来配置完以上，我们用任何设备，只要用浏览器就可以使用了，但是Ios端和IpadOS端有一个可以更加沉浸体验的软件，推荐给大家
选好点
Save就可以了，访问效果就如第一步运行效果的图
（五）使用流程总结
- SSH登入服务器
- cd code-server
- ./start.sh
- 浏览器直接访问网址/Apple系列产品的serveditor
- 关了，免得一直占用我的服务器：./shut.sh
（六）参考资料
- https://blog.csdn.net/liteng607/article/details/106601569?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522161529894516780269818215%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=161529894516780269818215&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduend~default-1-106601569.first_rank_v2_pc_rank_v29&utm_term=ipad+Vscode
最后的最后
我是一个热爱IT技术和音乐的Dream Catcher，正在努力培养计算机的深度和广度认知，也会和大家伙儿分享我的音乐，大家伙儿多多关照 (๑❛ᴗ❛๑) 联系我的话，可以邮箱或者私信哦！！谢谢大家咯(*≧▽≦) My Social Link： 我的个人博客站：
https://blog.calvinhaynes.top/ 我的本站主页：
https://www.zhihu.com/people/eternally-92-61 我的B站主页：
https://space.bilibili.com/434604897 我的CSDN主页：
https://blog.csdn.net/qq_45772333 我的邮箱：chx1006488386@163.com 我的Github主页：
https://github.com/CalvinHaynes 我的码云主页：
https://gitee.com/CalvinHaynes喜欢我的文章的话，不妨留下你的大拇指，点个赞再走，您的支持是我创作的最大动力，也欢迎指正博客中存在的问题，谢谢呐(～￣▽￣)～
在线咨询
