目录

前言

视频教程

1. 本地环境配置

2. 内网穿透

2.1 安装cpolar内网穿透(支持一键自动安装脚本)

2.2 创建HTTP隧道

3. 测试远程访问

4. 配置固定二级子域名

4.1 保留二级子域名

4.2 配置二级子域名

5. 测试使用固定二级子域名远程访问

6. iPad通过软件远程vscode

6.1 创建TCP隧道

7. ipad远程vscode

8. 配置固定TCP端口地址

8.1 保留固定TCP地址

8.2 配置固定TCP端口地址

9. 使用固定TCP地址远程vscode


前言

随着平板电脑的普及,大多数人的生活习惯和生活场景都离不开平板电脑的使用,刷剧,看短视频,玩主流游戏等,但是这些只是娱乐性质的场景,那想实现把平板结合到工作或者生产之中场景中呢,如编辑文档,制作工作表格,编写代码?

所以在入手ipad后,为了防止“买前生产力,买后爱奇艺”。我们可以在linux上搭建code server,然后用ipad通过浏览器或者或app,来远程访问code server。使用服务器的资源来跑代码,而ipad前端上只需要负责撸代码和运行就可以啦,让ipad完美变身移动开发工具!!

并且,为了实现在外随时随地远程移动开发,我们搭配使用了cpolar内网穿透,突破局域网的限制,实现在公网环境下也可以用ipad写代码开发!!

视频教程
bilibili html5 playerhttps://player.bilibili.com/player.html?aid=393728409)(image-

可以使iPad秒变生产力工具!在iPad上用vscode写代码

1. 本地环境配置

准备一台虚拟机,Ubuntu或者centos都可以,这里以VMware Ubuntu系统为例

下载code server服务

在浏览器访问:GitHub - coder/code-server: VS Code in the browser,复制下载命令

打开ubuntu命令行执行

curl -fsSL https://code-server.dev/install.sh | sh

出现需要输入ubuntu的登录账户密码,输入密码即可,然后等待安装完成

以下信息表示安装成功

接着输入以下命令设置code-server的登录密码

export PASSWORD=”000000”

查看IP地址,作局域网访问使用

ifconfig

设置好密码后启动code-server服务,输入以下命令:

code-server --host= “0.0.0.0”

出现地址和端口号信息表示成功

接着打开浏览器通过局域网访问http://192.168.30.128:8080/,出现welcone code-server表示成功,输入我们设置的密码,登录即可。

2. 内网穿透

接着我们使用cpolar穿透本地code-server服务,使得远程可以进行访问,随时随地写代码。cpolar支持http/https/tcp协议,不限制流量,操作简单,无需公网IP,也无需路由器。

cpolar官网:cpolar - 安全的内网穿透工具

2.1 安装cpolar内网穿透(支持一键自动安装脚本)

  • cpolar 安装(国内使用)

curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash
  • 或 cpolar短链接安装方式:(国外使用)

curl -sL https://git.io/cpolar | sudo bash
  • 查看版本号

cpolar version
  • token认证

登录cpolar官网后台,点击左侧的验证,查看自己的认证token,之后将token贴在命令行里

cpolar authtoken xxxxxxx

  • 简单穿透测试

cpolar http 8080

按ctrl+c退出

  • 向系统添加服务

sudo systemctl enable cpolar
  • 启动cpolar服务

sudo systemctl start cpolar
  • 查看服务状态

sudo systemctl status cpolar

正常显示为active则表示服务为正常在线启动状态

2.2 创建HTTP隧道

在ubuntu系统本地安装cpolar内网穿透之后,在ubuntu浏览器上访问本地9200端口,打开cpolar web ui界面:http://127.0.0.1:9200。

点击左侧仪表盘的隧道管理——创建隧道,由于code-server中配置的是8080端口,因此我们要来创建一条http隧道,指向8080端口:

  • 隧道名称:可自定义,注意不要重复

  • 协议:http协议

  • 本地地址:8080

  • 域名类型:选择随机域名

  • 地区:选择China VIP

点击创建

创建好后,点击左侧的状态——在线隧道列表,查看公网地址,将其复制下来

3. 测试远程访问

打开ipad浏览器,输入刚刚复制的公网地址访问即可,访问后输入前面设置的密码,出现vscode界面表示成功

4. 配置固定二级子域名

4.1 保留二级子域名

由于以上使用cpolar所创建的隧道使用的是随机临时公网地址,该地址在24小时内会发生变化,不利于长期远程访问。因此我们可以为其配置二级子域名,该地址为固定地址,不会随机变化【ps:cpolar.cn已备案】

需要注意,配置固定二级子域名需要将cpolar升级到基础套餐或以上。

登录cpolar官网,点击左侧的预留,选择保留二级子域名,设置一个二级子域名名称,点击保留,保留成功后复制保留的二级子域名名称

  • 地区:选择China vip

  • 二级域名:可自定义填写

  • 描述:即备注,可自定义填写

4.2 配置二级子域名

访问本地9200端口,打开cpolar web ui 界面,点击左侧的隧道管理——隧道列表,找到vscode隧道,点击右侧的编辑

修改下隧道信息:

  • 域名类型改为选择二级子域名

  • subdomain:填写刚刚保留成功的二级子域名

点击更新

隧道更新成功之后,点击左侧的状态——在线隧道列表,查看公网地址,此时可以看到地址变成了二级域名,将其复制下来

5. 测试使用固定二级子域名远程访问

接着我们再次打开ipad浏览器,访问刚刚配置成功的固定二级子域名地址,出现vscode界面表示成功,就可以愉快的写代码啦.

6. iPad通过软件远程vscode

接下来我们通过servediter for code-server软件来实现ipad远程访问vscode

6.1 创建TCP隧道

首先需要创建一条TCP隧道,指向我们服务器的22端口,servediter for code-server这个软件需要连接服务器,在ubuntu上打开浏览器访问本地9200端口,登录cpolar web ui界面,点击左侧的隧道管理——创建隧道

  • 隧道名称:可自定义,注意不要重复

  • 协议:tcp协议

  • 本地地址:22

  • 域名类型:选择随机临时TCP端口

  • 地区:选择China VIP

点击创建

隧道创建成功之后,点击左侧的状态——在线隧道列表,将所生成的公网地址复制下来。

7. ipad远程vscode

在ipad上,点击打开appstore,下载软件servediter for code-server

下载成功后点击打开,由于该软件是付费的,可以自由选择购买,这里选择免费试用,选择最后一个free

输入相关信息

参数介绍:

  • code-server URL:填写前面配置成功的http公网地址【ipad浏览器访问的那个地址】

  • Instance password:code-server配置的密码

  • Host:这里填写我们前面创建成功的22隧道的公网地址

  • Username: 这个填写ubuntu系统的用户名

  • Port: 这里默认即可无需修改

  • Authentication: 这个填写ubuntu系统用户名对应的密码

输入完信息后点击右上角save后就会自动连接,出现vscode界面表示连接成功啦

8. 配置固定TCP端口地址

由于前面我们创建的ssh 22端口的隧道选择的是随机临时地址,该地址会在24小时内变化,为了使我们ipad里面使用vscode连接更加通畅,我们需要固定ssh 的公网地址。

注意需要将cpolar套餐升级至专业套餐或以上。

8.1 保留固定TCP地址

登录cpolar官网后台,点击左侧的预留,找到保留的TCP地址:

  • 地区:选择China VIP

  • 描述:即备注,可自定义填写

点击保留

固定TCP地址保留成功,系统生成相应的公网地址+固定端口号,将其复制下来

8.2 配置固定TCP端口地址

浏览器访问http://127.0.0.1:9200/登录cpolar web UI管理界面,点击左侧仪表盘的隧道管理——隧道列表,找到codeserver隧道,点击右侧的编辑

修改隧道信息,配置固定TCP端口地址:

  • 端口类型:改为选择固定TCP端口

  • 预留的TCP地址:填写刚刚保留成功的固定TCP端口地址

点击更新

提示更新隧道成功,点击左侧仪表盘的状态——在线隧道列表,可以看到刚刚修改的隧道的公网地址已经更新为固定TCP端口地址,将其复制下来。

9. 使用固定TCP地址远程vscode

在ipad上,打开servediter for code-server软件,修改host的参数,将其修改为我们刚刚配置成功的固定TCP端口地址。

点击左上角i标志

选择self Host Server

把Host值改为我们刚刚官网保留的tcp地址

更改完后点击右上角save,点击完后会自动连接,出现vscde界面表示成功了,至此,教程就结束了,使用ipad开启愉快的编程吧!该公网地址不会再随机变化了。

你真的会用iPad吗,如何使iPad秒变生产力工具?在iPad上用vscode写代码搞开发相关推荐

  1. iPad秒变生产力工具?在iPad上用vscode写代码搞开发【内网穿透】

    文章目录 视频教程 1. 本地环境配置 2. 内网穿透 2.1 安装cpolar内网穿透(支持一键自动安装脚本) 2.2 创建HTTP隧道 3. 测试远程访问 4. 配置固定二级子域名 4.1 保留二 ...

  2. iPad Pro变生产力工具,你还缺这个轻量级浏览器端代码编辑器

    晓查 发自 凹非寺  量子位 报道 | 公众号 QbitAI 注意,这篇文章就是在劝你买iPad Pro(手动狗头)~ 最近,苹果推出了新的iPad Pro,号称生产力工具. 然而对程序员来说,不能写 ...

  3. 闲置ipad打造真正的生产力工具

    文章目录 前言 视频教程 1. 本地环境配置 2. 内网穿透 2.1 安装cpolar内网穿透(支持一键自动安装脚本) 2.2 创建HTTP隧道 3. 测试远程访问 4. 配置固定二级子域名 4.1 ...

  4. ipad一直卡在白苹果_苹果或将推出带触控板的 iPad 键盘,距离生产力工具还有多远?...

    这是苹果将 iPad 推向 MacBook 的又一举措. iPad 是很多人眼中的大号 iPhone,但苹果却一直想让它变成生产力工具,配件上推出了 Smart Keyboard.Apple Penc ...

  5. ipad和iphone切图_如何在iPhone,iPad和Mac上使消息静音

    ipad和iphone切图 If you use Messages on your iPhone, iPad, or Mac, then you probably know how quickly y ...

  6. iPad pro能运行c语言吗,2018年款iPad Pro一周使用心得:不只适合专业人士

    本文由腾讯数码独家发布 自从上周发售第一天我拿到2018年款iPad Pro起,我一直只使用它完成各种计算任务.一个星期以来我摸都没有摸我老朽的Mac计算机.我使用新款iPad工作.娱乐,因此,我对它 ...

  7. 安卓10可用的性能监视器_iPad 秒变监视器,无线图传设备真的有用吗?

    ​后期小伙伴买回来一个新玩意儿,说是能让 iPhone.iPad 秒变监视器,还能一拖四,乍一听感觉还挺好玩,仔细一想又觉得挺鸡肋.无线图传设备说白了就是把相机上的画面无线传输到手机或者平板上,这种偏 ...

  8. ipad和iphone切图_如何在iPhone,iPad和Apple TV上设置Steam Link

    ipad和iphone切图 Kevin Parrish 凯文·帕里什 Steam Link allows you to stream games from your gaming rig to a m ...

  9. 如何在 iPad 上运行 VSCode

    注:本教程基于 code-server v3.8.0,CentOS 8.2. 补充更新 更推荐以 Docker 方式安装 code-server 服务. 仅需一行命令部署,且无需配置后台运行,自带 G ...

最新文章

  1. 北大元培系AI公司,一年狂揽三轮融资,最新A轮斩获数千万美元
  2. Python入门(一)了解与安装
  3. VMware Network Adapter VMnet1和VMnet8 未识别的网络的解决方法
  4. wxWidgets:wxAnimationCtrl类用法
  5. ubuntu 设置大小写切换隐藏_VirtualBox中ubuntu的LAMP项目(温度采集)
  6. 高效开发者是如何个性化VS Code插件与配置的?
  7. arraylist下标从几开始_剖析JAVA面试题 手写ArrayList的实现,在笔试中过关斩将?...
  8. int main ( int argc, char** argv )的说明
  9. 总编下午茶:技术老男人的创业经
  10. WIN10中如何关闭Windows Search
  11. 【触动精灵将图片转成base64字符串后通过post方式上传给服务器】
  12. java自动发送qq消息
  13. CentOS7安装无线网卡驱动和更新yum源
  14. js页面刷新或关闭时弹框
  15. 淘宝自动发货源码,网店自动值守发货系统 不限制域名 支持客户自助提货及自动评价...
  16. 光吹牛可不行 无人驾驶何时才能实现真正无人? | 观察
  17. Xcode6 app沙盒目录
  18. python 微信撤回消息
  19. peewee mysql_tornado+peewee-async+peewee+mysql(一)
  20. Java微信公众平台开发之群发接口(高级群发)

热门文章

  1. 【Python入门教程】第83篇 常用字符串方法之startswith()和endswith()
  2. 52-第三方控件修饰文本输入框
  3. 关于Gensim的初次见面 和 Doc2vec 的模型训练
  4. 潮流计算程序————求解雅克比矩阵
  5. 主板usb接口全部失灵_Z170主板安装win7系统时USB接口全部失灵了怎么办?解决方案...
  6. 学习软件测试11月26日
  7. 无源晶振负载电容选择方法
  8. Corrupt GZIP trailer错误解决方法之一
  9. 【工具】25 个实用前端网站工具推荐
  10. Tomcat软件启动时闪退