使用 WebIDE 三分钟上手函数计算

背景

为了解决函数计算本地环境差异和配置繁琐的问题，在此背景下，就有了我们的 WebIDE 产品，WebIDE 能让函数的开发、测试和部署更加流畅，降低了函数计算的学习成本和缩短了函数的开发周期。

介绍

WebIDE 是一个基于 H5 支持多语言的集成开发环境。相当于 VS Code 的网页版。
功能特色：

• 文件树，支持拖拽移动、拖拽上传、打包下载、重命名、搜索、同名覆盖确认提醒和多选批量操作。
• 代码编辑器，集成 Monaco Editor，与 VS Code 同款编辑器
• 快捷键，与 VS Code 保持一致。
• 偏好设置，支持工作空间级别的偏好设置。
• 命令面板，通过快捷键 F1 ，唤出快捷打开功能搜索框，搜索想要的快捷功能
• 窗口管理，支持自由分窗和拖拽，并能保存布局。
• Web Terminal，前端集成 XTerm.js，后端运行在 docker container 内部，随意安装软件，不会影响宿主机环境。预制 ubuntu 16.04 和 oh-my-zsh 开箱即用。
• 预制黑白两款主题
• 可以将任意 Mac 和 Linux 系统主机注册成工作主机，所有数据都存储于用户所属的工作主机。
• 引入工作空间概念，支持多项目管理
• 内置函数计算创建向导，支持 fun 模板，内置了函数计算运行，调试和发布工具。

效果图：

使用

1. WebIDE 打开方式

直接在浏览器中输入网址 https://ide.fc.aliyun.com

2. 选择 Region

WebIDE页面打开后，会提示需要先选择一个 Region，目前只有一个杭州可以选择。如下图所示：

3. 创建主机（Host）

主机（Host），目前支持将您本机作为 Host，用于托管您的代码以及连接 Host 上起的 Teminal，所以创建主机流程，就是要在您的机器上执行一个命令安装 ide-agent 来达到效果。

1. 点击 Hosts 视图的 “+” 号，创建一个 主机（Host），复制对话框中的命令，在本机命令行终端中执行。
2. 执行成功后，命令会输出提示信息，其中会提示将路径 /Users/kevin/.ide_home/bin 添加到 PATH，
   /Users/kevin/.ide_home/bin 是我本地路径，您们的路径会和我有点不一样，以您们看到的为准，正确添加到 PATH 后，方可执行 ide start 命令，不然会报命令找不到错误。
3. 接下来，在本地命令行终端运行命令 ide start 启动 ide-agent 服务，此时，在 WebIDE 界面上，可以看到主机图标变成了绿色（绿色图标表示主机是在线的，灰色表示主机离线）。
4. 回到 WebIDE 界面，点击对话框 OK 或者点击 Hosts 视图的刷新按钮，就可以看到您新注册的主机。

注意：

主机（Host），目前支持将您本机作为 Host，用于托管您的代码以及连接 Host 上起的 Teminal，所以创建主机流程，就是要在您的机器上执行一个命令安装 ide-agent 来达到效果。

1. 点击 Hosts 视图的 “+” 号，创建一个 主机（Host），复制对话框中的命令，在本机命令行终端中执行。
2. 执行成功后，命令会输出提示信息，其中会提示将路径 /Users/kevin/.ide_home/bin 添加 PATH， /Users/kevin/.ide_home/bin 是我本地路径，您们的路径会和我有点不一样，以您们看到的为准，正确添加到 PATH 后，方可执行 ide start 命令，不然会报命令找不到错误（window 系统下路径会有差异，以控制台输出的内容为主）。
3. 接下来，在本地命令行终端运行命令 ide start 启动 ide-agent 服务，此时，在 WebIDE 界面上，可以看到主机图标变成了绿色（绿色图标表示主机是在线的，灰色表示主机离线）。
4. 回到 WebIDE 界面，点击对话框 OK 或者点击 Hosts 视图的刷新按钮，就可以看到您新注册的主机。

注意：

• 目前支持 Mac 和 Linux，Windows 10 Pro、Enterprise 或 Education。
• 由于环境依赖 docker 和 docker compose，需要提前安装。其中 docker version >= 1.13.0，docker compose version >= 1.11.0。
• Mac 和 Linux 系统下修改 PATH，如果 shell 是 bash，可以修改文件 ~/.bashrc，将PATH=$PATH:/Users/kevin/.ide_home/bin 追加到文件 ~/.bashrc 末尾。如果 shell 是 zsh，可以修改 ~/.zshrc。/Users/kevin/.ide_home/bin 是我本地路径，您们的路径会和我有点不一样，以您们看到的为准。如果是 Windows，需要设置环境 PATH。

如下图所示：

4. 创建工作空间（Workspace）

工作空间（Workspace），主机上可以创建多个工作空间。点击 Workspaces 视图的 “+” 号，创建一个工作空间（Workspace），在 WebIDE 界面上，绿色图标表示主机是在线的，灰色表示主机离线。如下图所以：

5. 打开工作空间

两种方式：

• 在 Workspaces 的视图中，双击（右键菜单）打开在线的工作空间（绿色图标）
• 在 Files 的视图中，点击 “Open Workspace” 按钮，通过工作空间对话框来打开在线的工作空间
  打开后如下图所示：

6. 创建函数

如下图所示：

根据函数创建向导一步一步创建函数，创建完成后，如下图：

7. 部署函数

由于权限原因，目前只提供通过 Terminal 中的 fun 工具来部署函数，Terminal 的环境中已经预置了 fun 和 fcli 工具，可以很方便的使用。使用 fun 工具之前，需要为 fun 工具配置的 AK，可以通过如下命令：

fun config

配置完后，通过 fun 的部署命令来部署函数，命令如下：

fun deploy

如下图所示：

8. 运行函数

• 打开运行界面
• 点击 “Run” 按钮运行函数

打开运行界面

点击 “Run” 按钮运行函数

小结

通过以上几个步骤，我们就完成了函数计算的开发、部署和运行。预置的 fun 和 fcli 工具，开箱即用，避免了因为安装 fun 和 fcli 所带来的学习成本，也防止了因为用户本地环境差异，导致安装失败的可能。

联系方式

欢迎加入钉钉群联系我们，钉钉群号：11721331，钉钉群二维码如下图所示：