使用网络代理监控流量

Vega Studio的网络代理工具可监控Vega应用中的网络活动并对其进行故障排除。它基于mitm-http-proxy库构建而成，充当您的应用与其服务器之间的中间代理，允许检查和修改网络流量。

该工具有助于：

• 调试网络问题
• 检查API调用
• 分析性能瓶颈
• 验证您的Vega应用中的数据传输

该工具捕获来自以下方法的流量：

• HTTP
• HTTPS
• WebSocket
• XMLHttpRequest
• 媒体播放器请求

先决条件

您必须具备以下所列项：

• 已安装Vega SDK和Vega Studio
• Fire TV Stick设备或Vega虚拟设备
• 一个Vega应用项目

设置网络代理

1. 在Visual Studio Code (VS Code) 中，打开命令面板。

   Mac： Shift + Command ⌘ + P

   Linux： 使用Ctrl + Shift + P

   

2. 输入Start Network Proxy（启动网络代理）。

   

   显示Setup Network Proxy（设置网络代理）用户界面 (UI)，默认已选中Capture Call Stack（捕获调用堆栈）和Enable SSL Proxy（启用SSL代理）。

   重要须知： 如果您取消选择Enable SSL Proxy，该工具将不会生成证书，也无法拦截HTTPS流量。如果取消选择Capture Call Stack，则网络代理的用户界面会隐藏此选项。

3. 在Setup Network Proxy用户界面中输入4位数的端口号。

   提示： 不要使用常用端口（例如8081）或其他服务或应用正在使用的端口，以防止任何潜在的冲突。

4. 单击Submit（提交）。

   将打开网络代理用户界面，其中会显示您的设备序列号。

5. 设置端口转发：

   端口转发会指示设备改为向您的计算机发送针对特定端口的请求。

   在命令提示符下，运行：

   vda reverse tcp:<远程端口> tcp:<本地端口>
   

   将<远程端口>替换为您在Fire TV Stick的proxy-config.json文件中配置的端口。将<远程端口>替换为您在开发计算机上为网络代理配置的端口。

   示例：

   复制代码 已复制到剪贴板。

   vda reverse tcp:8888 tcp:8888 
   

   提示： 完成调试后停止端口转发以恢复设备的正常网络配置。

   您应该会看到一条确认消息，表明代理已启动。代理工具会自动执行以下操作：

   • 创建assets/raw目录
   • 生成proxy-config.json
   • 创建SSL证书 (ca.pem)（此选项默认处于启用状态）

网络代理用户界面

网络代理主界面包括以下部分：

• 控制面板
• 流量视图
• 详细面板

控制面板

控制面板提供以下选项：

1. 开始或停止记录

   a. Start Recording（开始记录）- 开始捕获所有网络活动。在记录时：

   • 该工具显示所有网络流量
   • 您可以实时监控请求和响应

   b. Stop Recording（停止记录）- 停止捕获新的请求或响应。

2. Clear（清除）- 重置会话并删除所有捕获的数据

3. Settings（设置）- 提供以下选项：

   a. Export（导出）- 将会话以JSON格式保存到Vega应用生成的文件夹中。

   b. Import（导入）- 加载先前导出的会话。

4. Disable SSL Proxying（禁用SSL代理） - 控制HTTPS流量拦截。

   如果启用，该工具将拦截、解密并在界面中显示HTTPS流量。

   如果禁用，该工具将无法解密HTTPS流量。

5. 启用断点设置

   当您选中Enable Breakpoint Settings（启用断点设置）复选框时，它会激活断点功能并允许您设置断点。

   设置断点

   

   要设置断点，可单击任何网络调用旁边的+图标。工具会在该断点处暂停流量。

   中止、取消或恢复流量

   

   当该工具触发断点时，单击相应的按钮：

   • Abort（中止）- 取消请求
   • Cancel（取消）- 停止断点
   • Resume（恢复）- 继续正常流动

流量视图

网络代理显示每个截获的请求或响应，其中包含以下详细信息：

• Status（状态）- HTTP响应代码，表示请求的结果（例如200或404）。
• Size（大小）- 响应正文的大小。
• Method（方法）- 使用的HTTP方法（例如，GET、POST、PUT或DELETE）。
• Url - 请求的完整URL，包括域名和路径。
• Start Time（开始时间）- 发送响应的时间戳。

• Duration（持续时间）- 处理请求和接收响应所花费的时间（以毫秒为单位）。

  

详细信息面板

当您选择一行特定的截获数据时，底部会打开一个新面板，提供对所选网络流量的见解。

1. Overview（概述）- 提供所选流量的高级摘要，包括一般元数据和状态信息。
2. Contents（内容）- 显示请求和响应的完整详细信息，例如标题、正文内容和其他相关数据。

   • Request Headers（请求标头）- 与请求一起发送的全套标头。

     • Response Headers（响应标头）- 随响应一起发送的全套标头。

   • Body Content（正文内容）- 原始正文或格式化正文（JSON、HTML）。

3. Summary（摘要）- 提供关键指标摘要，例如主机URL、正文大小、Mime类型、状态码、与所选网络流量相关的时间。

调试后清理

在提交应用进行生产之前：

1. 从应用中删除proxy-config.json文件和任何证书文件（例如assets/raw/ca.pem）。

2. 清理您的项目：

   复制代码 已复制到剪贴板。

   kepler clean
   

3. 构建您的应用

故障排除

如果您在使用Vega Studio的网络代理工具时遇到问题，请参阅解决网络代理问题。

相关主题

• 使用Charles代理监控网络流量

---

Last updated: 2025年9月30日