使用多TOML配置运行Shopify CLI的shopify app dev命令遇测试店铺404错误

1. 核对本地配置文件（shopify.app.local.toml）核心字段 #

• 确认application_url字段：必须和本地开发服务的地址完全匹配，比如本地跑在3000端口就是http://localhost:3000，如果用Shopify CLI自动隧道，要和终端输出的隧道地址一致（注意不要混http/https）
• 检查shop字段：填写的测试店铺域名必须准确，格式为xxx.myshopify.com，不能有拼写错误
• 验证api_key和api_secret_key：确保这两个值是对应测试店铺应用的密钥，不要误填成UAT环境的密钥

2. 检查隧道/本地服务连通性 #

• 执行shopify app dev --config local后，查看终端输出的隧道地址，直接在浏览器访问该地址，确认本地应用首页能正常打开
• 如果用第三方隧道（如ngrok），检查端口映射是否和本地应用端口一致，比如本地应用监听3000，ngrok需映射到3000
• 若本地服务无法访问，先排查应用本身的启动错误（比如依赖缺失、端口被占用）

3. 验证Shopify后台应用配置 #

• 进入测试店铺的Shopify后台，找到目标应用，在App setup页面：
  • 确认App URL和local配置文件里的application_url完全一致
  • 检查**Allowed redirection URL(s)**是否包含本地回调地址，比如http://localhost:3000/auth/callback或对应的隧道回调地址，缺失会导致授权后跳404
  • 确保应用状态为Active，未被禁用

4. 清理缓存并重启服务 #

• 彻底关闭Shopify CLI进程及本地应用服务（如Node.js进程）
• 用浏览器隐身模式打开应用，避免旧缓存地址干扰
• 重新执行shopify app dev --config local，确保终端无报错，隧道正常建立

5. 检查本地应用路由配置 #

• 确认本地应用的路由文件中，存在根路由（/）及Shopify App必需的/auth系列路由
• 如果是Shopify CLI生成的模板，不要随意修改默认路由结构，避免核心路由丢失

内容的提问来源于stack exchange，提问作者Gowtham Paramasivam