在 Windows 10 中安装 Fiddler Classic 后对 Shopify CLI 3.x 的抓包流程

1、打开网址：下载：Download Fiddler Classic 并安装。如图1

图1

2、打开 Fiddler 时，弹出提示：Windows 使用称为“AppContainer”的隔离技术，该技术可能会干扰来自沉浸式应用程序和 Edge 浏览器的流量捕获。 使用 Progress Telerik Fiddler Classic 工具栏中的 WinConfig 按钮启用流量捕获。点击 Yes。如图2

图2

AppContainer Configuration

Windows uses an isolation technology called 'AppContainer' that may interfere with traffic capture from Immersive Applications and the Edge browser. Use the WinConfig button in Progress Telerik Fiddler Classic's toolbar to enable traffic capture.
Would you like learn more?
To disable this warning. click 'Cancel'.

3、点击工具栏中的 WinConfig ，弹出提示：Orphaned Exemption Record Found。点击是。如图3

图3

Orphaned Exemption Record Found

A Loopback exemption exists for SID:
.. but no AppContainer with that SID could be found.
Warn if other orphaned exemptions are found in this session?

4、Fiddler 默认是只抓取 http 协议，那么要抓取 https 协议的会话需要打开配置安装证书才可以。Tools – Options – HTTPS – 勾选Decrypt HTTPS traffic。然后会弹出一个对话框 直接点击 Yes 即可。如图4

图4

5、注意，你是第一次安装的 Fiddler 那么正常情况下会弹出证书安装的相关提示。依次点击 是、是、确定 即可。如图5

图5

6、最后勾选 Ignore server certificate errors(unsafe)、check for certificate revocation。如图6

图6

7、从 Actions 中选择 Open Windows Certificate Manager 这一个选项, 打开Windows证书管理器去查看是否已经安装成功。如图7

图7

8、打开Windows证书管理器之后点击菜单栏上的 操作 – 查找证书，然后输入 Fiddler 就会查找出证书了。如果没有说明安装失败。如图8

图8

9、此时，查看抓包的记录，确认已经存在 https 协议的 shopify.com 相关的记录。如图9

图9

10、开始抓包，File – Capture Traffic 就可以了, 开启后在左下角状态栏上会有 Capturing 的字样显示。如图10

图10

11、进入待下载主题的目录：E:\wwwroot\shopify-theme ，执行命令时，提示：要运行此命令，请登录 Shopify 合作伙伴。👉按任意键在浏览器上打开登录页面。如图11

图11

PS E:\wwwroot\shopify-theme> shopify theme pull --store shuijingwanwq-development

To run this command, log in to Shopify Partners.
👉 Press any key to open the login page on your browser

12、打开默认浏览器登录成功后，提示：您已成功登录 Shopify CLI！您可以关闭此选项卡并返回到您的终端。其跳转地址为：http://127.0.0.1:3456/?code=3d1e20fba559104b4239bee72be873312f304dcd51535e463013b192fde9c434&state=4afd9774649e18803abc80237b0bfed53c0f41ef533eb4d73d0dafa0260e 。如图12

图12

You've successfully logged into the Shopify CLI!
You can close this tab and return to your terminal.

13、在终端中登录成功，然后提示：？ 您似乎没有在主题目录中运行此命令。 您确定要继续吗？ （使用“k”向上导航，使用“j”向下导航，按 Enter 键选择），选择 Yes，输入 2。从 shuijingwanwq-development.myshopify.com 选择要拉取的主题（使用 ‘k’ 向上导航，使用 ‘j’ 向下导航，按 Enter 键选择，使用 ‘f’ 过滤，使用 ‘e’ 输入选项），选择 Dawn (Shopify CLI) [unpublished]，输入 2。如图13

图13

PS E:\wwwroot\shopify-theme> shopify theme pull --store shuijingwanwq-development

To run this command, log in to Shopify Partners.
👉 Press any key to open the login page on your browser

Auto-open timed out. Open the login page: Log in to Shopify Partners ( http://accounts.shopify.com/oauth/authorize?client_id=fbdb2649-e327-4907-8f67-908d24cfd7e3&scope=openid+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.admin.graphql+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.admin.themes+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fpartners.collaborator-relationships.readonly+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.storefront-renderer.devtools+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fpartners.app.cli.access&redirect_uri=http%3A%2F%2F127.0.0.1%3A3456&state=4afd9774649e18803abc80237b0bfed53c0f41ef533eb4d73d0dafa0260e&response_type=code&code_challenge_method=S256&code_challenge=rCXVzEXgBGYErEXJXmsaJmH-oefd3xIjDSaBlWq4s10 )

✔ Logged in.
? It doesn’t seem like you’re running this command in a theme directory. Are you sure you want to proceed? (Navigate up ? It doesn’t seem like you’re running this command in a theme directory. Are you sure you want to proceed? (You chose: yes)
? Select a theme to pull from shuijingwanwq-development.myshopify.com (Navigate up with 'k' and down with 'j', press Enter to select, filter with 'f', enter option with 'e')
> 1.  Dawn [live]
  2.  Dawn (Shopify CLI) [unpublished]
  3.  Taste 的更新版副本 的更新版副本 的更新版副本 的更新版副本 的更新版副本 的更新版副本... [unpublished]
  4.  Taste 的更新版副本 的更新版副本 的更新版副本 的更新版副本 的更新版副本 的更新版副本 [unpublished]
  5.  Taste 的更新版副本 的更新版副本  的更新版副本  的更新版副本  的更新版副本 [unpublished]
  6.  Updated copy of Studio [unpublished]
  7.  Copy of Studio [unpublished]
  8.  Dawn [unpublished]
  9.  first-shopify-theme [unpublished]
  10. Taste [unpublished]
  11. shopify-theme-dawn-20221011/main [unpublished]
  12. Dawn Customize [unpublished]
  13. Colorblock [unpublished]
  14. Refresh [unpublished]
  15. Crave 重命名 [unpublished]
  16. Sense [unpublished]
  17. Craft [unpublished]

PS E:\wwwroot\shopify-theme> shopify theme pull --store shuijingwanwq-development

To run this command, log in to Shopify Partners.
👉 Press any key to open the login page on your browser

Auto-open timed out. Open the login page: Log in to Shopify Partners ( http://accounts.shopify.com/oauth/authorize?client_id=fbdb2649-e327-4907-8f67-908d24cfd7e3&scope=openid+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.admin.graphql+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.admin.themes+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fpartners.collaborator-relationships.readonly+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fshop.storefront-renderer.devtools+https%3A%2F%2Fapi.shopify.com%2Fauth%2Fpartners.app.cli.access&redirect_uri=http%3A%2F%2F127.0.0.1%3A3456&state=4afd9774649e18803abc80237b0bfed53c0f41ef533eb4d73d0dafa0260e&response_type=code&code_challenge_method=S256&code_challenge=rCXVzEXgBGYErEXJXmsaJmH-oefd3xIjDSaBlWq4s10 )

✔ Logged in.
? It doesn’t seem like you’re running this command in a theme directory. Are you sure you want to proceed? (Navigate up ? It doesn’t seem like you’re running this command in a theme directory. Are you sure you want to proceed? (You chose: yes)
? Select a theme to pull from shuijingwanwq-development.myshopify.com (Navigate up with 'k' and down with 'j', press Ent? Select a theme to pull from shuijingwanwq-development.myshopify.com (You chose: Dawn (Shopify CLI) [unpublished])
┏━━ Pulling theme files from Dawn (Shopify CLI) (#133492932793) on shuijingwanwq-development.myshopify.com
┃                                                                           100%
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ (159.12s) ━━━新版副本... [unpublished]
√ Theme pulled successfully.                                                    新版副本 [unpublished]
PS E:\wwwroot\shopify-theme>

14、工具栏 – Find ，搜索：shopify.com，shopify.com 相关的记录会以黄色背景显示。如图14

图14

15、但是，最终发现没有捕获到 终端 中的流量。参考：在 Windows 10 中安装 HTTP Toolkit 后对 Shopify CLI 3.x 的抓包流程 。捕获流量成功。