让IPad变成你的生产力工具?在IPad上用Vscode写代码搞开发

news2025/1/11 5:55:51

文章目录

  • 前言
  • 视频教程
  • 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

转发自cpolar极点云的文章:如何让IPad变成你的生产力工具?在IPad上用Vscode写代码搞开发

前言

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

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

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

视频教程

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

1. 本地环境配置

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

2023011601

下载code server服务

在浏览器访问:https://github.com/coder/code-server,复制下载命令

2023011602

打开ubuntu命令行执行

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

2023011603

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

2023011604

以下信息表示安装成功

2023011605

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

export PASSWORD=”000000”

20230116112814

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

ifconfig

2023011607

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

code-server --host= “0.0.0.0”

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

2023011608

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

2023011609

2. 内网穿透

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

cpolar官网:https://www.cpolar.com/

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

20230116114805

  • 简单穿透测试
cpolar http 8080

按ctrl+c退出

  • 向系统添加服务
sudo systemctl enable cpolar
  • 启动cpolar服务
sudo systemctl start cpolar
  • 查看服务状态
sudo systemctl status cpolar

20230116114923

正常显示为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

点击创建

2023011610

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

2023011611

3. 测试远程访问

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

2023011612

4. 配置固定二级子域名

4.1 保留二级子域名

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

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

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

  • 地区:选择China vip
  • 二级域名:可自定义填写
  • 描述:即备注,可自定义填写

2023011613·

4.2 配置二级子域名

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

2023011614

修改下隧道信息:

  • 域名类型改为选择二级子域名
  • subdomain:填写刚刚保留成功的二级子域名

点击更新

2023011615

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

2023011616

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

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

2023011617

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

点击创建

2023011618

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

2023011622

7. ipad远程vscode

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

2023011619

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

2023011620

输入相关信息

参数介绍:

  • code-server URL:填写前面配置成功的http公网地址【ipad浏览器访问的那个地址】
  • Instance password:code-server配置的密码
  • Host:这里填写我们前面创建成功的22隧道的公网地址
  • Username: 这个填写ubuntu系统的用户名
  • Port: 这里默认即可无需修改
  • Authentication: 这个填写ubuntu系统用户名对应的密码

2023011621

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

2023011623

8. 配置固定TCP端口地址

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

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

8.1 保留固定TCP地址

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

  • 地区:选择China VIP
  • 描述:即备注,可自定义填写

点击保留

2023011624

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

2023011625

8.2 配置固定TCP端口地址

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

2023011626

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

  • 端口类型:改为选择固定TCP端口
  • 预留的TCP地址:填写刚刚保留成功的固定TCP端口地址

点击更新

2023011627

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

2023011628

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

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

点击左上角i标志

2023011629

选择self Host Server

2023011630

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

2023011631

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

2023011632

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/596172.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

POSTGRESQL 索引添加不合理有什么负面影响

开头还是介绍一下群,如果感兴趣polardb ,mongodb ,mysql ,postgresql ,redis 等有问题,有需求都可以加群群内有各大数据库行业大咖,CTO,可以解决你的问题。加群请联系 liuaustin3 ,在新加的朋友会分到2群(共…

软考A计划-试题模拟含答案解析-卷十六

点击跳转专栏>Unity3D特效百例点击跳转专栏>案例项目实战源码点击跳转专栏>游戏脚本-辅助自动化点击跳转专栏>Android控件全解手册点击跳转专栏>Scratch编程案例 👉关于作者 专注于Android/Unity和各种游戏开发技巧,以及各种资源分享&am…

基于SpringBoot和vue的若依后台管理系统 部署

RuoYi-Vue是一款前后端分离的极速后台开发框架,基于SpringBoot和Vue。 目录 一、准备 二、启动前端项目 解决报错:digital envelope routines::unsupported 【测试】 三、启动后端项目 四、运行数据库sql文件建表 五、开启redis缓存服务 【redis…

基于html+css的图展示103

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…

java 利用poi根据excel模板导出数据(一)

前言 作为B端开发,导出数据是不可以避免的,但是有时候需求很变态,表头复杂的一笔,各种合并单元格,如下图: 这些虽说用代码可以实现,但是很繁琐,而且代码并不能通用,遇到…

哈工大华为提出ControlVideo:一种无需训练的可控视频生成方法

点击下方卡片,关注“CVer”公众号 AI/CV重磅干货,第一时间送达 点击进入—>【扩散模型和Transformer】交流群 导读 哈工大&华为云最新提出了一种可控的文本-视频生成方法ControlVideo,在无需训练的条件下,仅使用一张2080Ti…

长沙之行第二天

这是学习笔记的第 2458篇文章 已经从长沙返京一个多星期了,旅行日记还没有写好,真是羞愧,赶紧补一补回忆。 整体来看返京后这一周我最大的变化就是几乎每天都订1次外卖吃长沙牛肉粉。 第二天 自第一天逛完橘子洲之后,我们的行程重…

3.11 Ext JS文件上传基本使用

文件上传对应的组件是Ext.form.field.File。 组件的效果是输入框+文件选择按钮,如下图所示: 点击“选择文件的按钮”, 会弹出操作系统选择文件的对话框,如下图所示窗口: 选择文件后,输入框会根据不同的浏览器有不同的显示, 有的浏览器是文件名,有的浏览器是完整路径,…

c#特性Attribute

C# 特性(Attribute) 特性(Attribute)是用于在运行时传递程序中各种元素(比如类、方法、结构、枚举、组件等)的行为信息的声明性标签。您可以通过使用特性向程序添加声明性信息。一个声明性标签是通过放置在…

分享几款还不错的工具,这几个工具你们知道吗?

1、可口的披萨 这是一款非常有趣的小游戏,它不仅可以帮助你超解压,还能消磨时间。你将扮演一位店主,经营一家小店。在这个过程中,你会遇到各种不同的人,每个人都有着自己的故事和背景。这些故事非常感人,会…

scitb5函数1.6版本(交互效应函数P for interaction)尝鲜版发布----用于一键生成交互效应表

在SCI文章中,交互效应表格(通常是表五)几乎是高分SCI必有。因为增加了亚组人群分析,增加了文章的可信度,能为文章锦上添花,增加文章的信服力,还能进行数据挖掘。 在上一个版本中,我们…

使用PlotNeuralNet绘制深度学习网络图的基本操作

使用PlotNeuralNet绘制深度学习网络图的基本操作 PlotNeuralNet工具,具如其名,plot neural net用的,首先我们看看效果: PlotNeuralNet安装与简单命令了解 关于如何安装大家可以参考网上的其他教程,网上有很多教程&…

如何使用ArcGIS查找离家最近的地铁站(附练习数据)

学习GIS的目的除了可以用在工作上之外,还可以用在平时的生活中,比如可以用来查找定位离家最近的地铁站,这里给大家介绍一下查找方法,希望能够对大家有所帮助。 近邻分析 在ArcToolbox中点击“分析工具\邻域分析\近邻分析”&#…

数据体系建设-ODS|DW|TDM|ADS介绍

参考书目《数据中台:让数据用起来》 ODS:各业务生成的基础数据存表,如log日志数据等DW:在ods基础上,分主题整合数据TDM:存储标签数据ADS:基于上面的数据源整合而成的供业务应用的指标报表等 贴…

什么是EDI 858装运信息?

EDI 858是电子数据交换(Electronic Data Interchange,简称EDI)中的一种标准格式,它主要用于在供应链管理中进行物流和运输的数据交换。EDI 858是指基于ASC X12标准的858交付和接收数据集,也被称为”Shipping Notice/Ma…

基于Spring boot的图书商城管理系统-源码、数据库、LW

框架:Springboot 数据库:MySQL 下载链接: https://download.csdn.net/download/yw1990128/87851197 B站运行链接: 基于Springboot的图书商城管理系统_哔哩哔哩_bilibili 引言 项目开发背景 Internet最早在美国出现&#xf…

GLSurfaceView 与 SurfaceView 联系与区别

同系列文章: SurfaceView为什么不能做动画? SurfaceViewMediaPlayer实现视频播放 本文目录 笔试题解析有了SurfaceView,为什么还要提供一个GLSurfaceView?SurfaceView有哪些用途? 笔试题解析 下面是属于GLSurfaceView特性的是&a…

Android开机流程、Zygote进程、systemserver、ServiceManager

一、Loader层 1、Boot ROM: 上电后,BootRom会被激活,引导芯片代码开始从预定义的地方(固化在ROM)开始执行,然后加载引导程序到RAM。 2、 Boot Loader引导程序 Android是基于Linux系统的,它没有BI…

Arcgis进阶篇(6)——如何将Arcgis Pro的离线数据发布成服务

常常因为Arcgis Server(或者GeoScene Server)昂贵的价格,而导致小项目技术选型选择开源的GIS Server(如GeoServer等)。但用完之后,发现后者实在拉跨,使用对比差异巨大。那就只能另想办法&#x…

商家618活动文案怎么写,注意事项

马上又是一年的618,特别是最近大家消费热情高涨的时候。今天,就来和大家好好唠一唠618。商家618活动文案怎么写,以及注意事项。 为了以防有些人没有真正了解618,虽然可能性很小,但是本着严谨的原则,还是先介…