返回

用APICloudStudio3开发调试【真机WiFi方式】

前端

1. 下载APICloudStudio3开发工具

APICloudStudio3是基于vscode内核进行开发的。根据官方要求需要安装Node.js和Java环境。根据自己的电脑的系统进行下载。

2. 安装APICloudStudio3

解压下载的APICloudStudio3安装包到任意目录。双击解压包内install.exe开始安装。安装完成后会自动打开。

3. 新建项目

打开APICloudStudio3后,点击左侧菜单栏的“文件”->“新建”->“项目”创建新项目。

4. 选择项目类型

在弹出的“新建项目”对话框中,选择“空项目”,然后点击“下一步”。

5. 输入项目名称和路径

在“项目名称”字段中输入项目名称,在“项目路径”字段中选择项目的保存路径,然后点击“完成”。

6. 添加项目文件

在项目目录下新建一个名为“index.html”的文件,然后复制以下代码到该文件中:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  
</head>
<body>
  <h1>APICloudStudio3开发调试</h1>
</body>
</html>

7. 打开真机调试面板

点击APICloudStudio3窗口右下角的“调试”按钮,然后选择“真机WiFi调试”。

8. 连接真机

在真机上打开APICloudStudio3客户端,然后点击“扫一扫”按钮扫描电脑上显示的二维码。成功连接后,真机上会显示“已连接”的提示。

9. 启动调试

点击APICloudStudio3窗口右上角的“启动”按钮,然后选择“真机调试”。

10. 查看调试结果

在真机上打开浏览器,输入以下地址:

http://127.0.0.1:8080/index.html

此时,真机上会显示“APICloudStudio3开发调试”的页面。

11. 调试代码

在APICloudStudio3窗口中,点击“调试”菜单,然后选择“开始调试”。此时,真机上的浏览器会自动刷新,并且在代码中设置的断点处会停下来。

12. 结束调试

点击APICloudStudio3窗口右上角的“停止”按钮,然后选择“结束调试”。

13. 真机WiFi调试常见问题

  • 无法连接真机:确保真机和电脑连接在同一个WiFi网络中,并且真机上的APICloudStudio3客户端已经打开。
  • 无法启动调试:确保真机上的浏览器已经打开,并且输入了正确的地址。
  • 断点不起作用:确保在代码中设置了断点,并且真机上的浏览器已经刷新。