通过端口转发访问本地服务器和 Chrome 实例

Kayce Basques
Meggin Kearney
Meggin Kearney
Sofia Emelianova
Sofia Emelianova
GitHub

您可以使用端口转发实现以下目的：

  • 情形 1：调试在其他 Chrome 实例上打开的标签页。
  • 情形 2：在开发机器网络服务器上托管网站，然后通过 USB 线从 Android 设备访问内容。

在案例 2 中，端口转发通过 Android 设备上映射到开发机器上的 TCP 端口的监听 TCP 端口进行。端口之间的流量通过 Android 设备与开发计算机之间的 USB 连接传输，因此连接取决于您的网络配置。

此外，如果您的网络服务器使用的是自定义网域，您可以通过自定义网域映射将 Android 设备设置为访问该网域中的内容。

设置端口转发

根据您的具体情况，按照后续步骤操作。

案例 1：为另一个 Chrome 实例设置端口转发

  1. 使用 --remote-debugging-port=PORT 参数运行另一个 Chrome 实例，例如：

    MacOS

    open -a "Google Chrome" --args --remote-debugging-port=PORT

    Windows

    start chrome --remote-debugging-port=PORT

    Linux

    google-chrome --remote-debugging-port=PORT

  2. 在用于调试的 Chrome 实例中：

    1. 打开 chrome://inspect/#devices。
    2. 确保已选中 复选框。 发现网络目标。
    3. 点击相应复选框旁边的配置。

    4. 在目标发现设置中，输入 localhost:PORT，勾选 复选框。 启用端口转发，然后点击完成。

      目标发现设置窗口。

    5. 返回到设备，您会看到一个新的远程目标。点击您要调试的标签页旁边的 Inspect。

      远程目标上的标签页旁边的检查链接。

  3. 系统会在设备模式下打开新的开发者工具窗口。在顶部的地址栏中，您可以输入要调试的网站的网址。

    设备模式下的开发者工具。

  4. 在地址栏的旁边，您可以切换输入法。

案例 2：为 Android 设备设置通过 USB 进行端口转发

  1. 在开发机器和 Android 设备之间设置远程调试。完成后，您应该会在列表中看到您的 Android 设备。

    列表中的 Android 设备。

  2. 确保已选中 复选框。 发现 USB 设备。

  3. 点击复选框旁边的端口转发。

  4. 在端口转发设置中，localhost:8080 已默认设置。选中启用端口转发。

    端口转发设置。。

  5. 如果您要设置其他端口，请按照后续步骤操作。否则，请跳过这些步骤，然后点击完成。

  6. 在左侧的端口文本字段中，输入您要从其端口中注入的端口号 能够在您的 Android 设备上访问该网站。例如，如果您想访问 如果是从 localhost:5000 中选择，则请输入 5000。

  7. 在右侧的 IP 地址和端口文本字段中，输入需要访问的 IP 地址或主机名 后接端口号。对于 例如，如果您的网站在 localhost:5000 上运行，请输入 localhost:5000。

  8. 点击完成。

端口转发现已设置完毕。顶部还会显示端口转发的状态指示器 。

端口转发状态。

若要查看这些内容，请在 Android 设备上打开 Chrome，然后转至您之前设置的 localhost 端口 设备端口字段中指定的地址。例如，如果您在字段中输入 5000，那么 会转到 localhost:5000。

映射到自定义本地网域

借助自定义网域映射，您可以查看 Android 设备上来自 使用自定义网域的开发机器。

例如，假设您的网站使用的第三方 JavaScript 库仅适用于 列入许可名单的网域 chrome.devtools。因此，您需要在应用的 hosts 文件中创建一个条目， 将此网域映射到 localhost（即 127.0.0.1 chrome.devtools）。更新后 设置自定义网域映射和端口转发，您将能够在自己的 Android 设备，网址为 chrome.devtools。

为代理服务器设置端口转发

要映射自定义网域，您必须在开发机器上运行代理服务器。代理示例 服务器为 Charles、Squid 和 Fiddler。

如需为代理设置端口转发，请执行以下操作：

  1. 运行代理服务器并记下其正在使用的端口。

  2. 为您的 Android 设备设置端口转发。对于本地地址字段，请输入 localhost:，后跟运行代理服务器的端口。例如，如果 在端口 8000 上运行，则应输入 localhost:8000。在设备端口字段中 输入您希望 Android 设备收听的号码，例如 3333。

在设备上配置代理设置

接下来，您需要配置 Android 设备，以便与代理服务器进行通信。

  1. 在 Android 设备上，转至设置 >WLAN。

  2. 长按您连接到的网络的名称。

  3. 点按修改网络。

  4. 点按高级选项。系统会显示代理设置。

  5. 点按代理菜单，然后选择手动。

  6. 在 Proxy hostname（代理主机名）字段中，输入 localhost。

  7. 在代理端口字段，输入您在 上一节。

  8. 点按保存。

通过这些设置，您的设备会将所有请求转发给您开发中的代理 虚拟机。代理会代表您的设备发出请求，以便将请求发送到您自定义的本地 网域得到正确解析

现在，您可以在 Android 设备上访问自定义网域，就像在 开发机器。

如果您的网络服务器正在非标准端口上运行，请记得在 从您的 Android 设备请求内容。例如，如果您的网络服务器使用的是 网域 chrome.devtools（端口：7331）后，当您通过 Android 设备查看该网站时，应该 使用的网址 chrome.devtools:7331。