我是 Shopify 的初学者,在使用 Shopify 代理时遇到了麻烦
前店:
https://bhavin.myshopify.com
应用程序商店:
https://myapp.ngrok.io
(Laravel)
我想在我的前端存储中添加两个文件(自定义 js 和 manifest.json)。
安装和身份验证工作正常
我正在添加
manifest.json
类似的东西
var link = document.createElement('link');
link.rel = 'manifest';
link.href = 'https://myapp.ngrok.io/manifest.json';
document.head.appendChild(link);
1。没有代理
manifest.json
文件已正确添加,但会抛出类似这样的错误
Access to resource at 'https://myapp.ngrok.io/manifest.json' from origin 'https://bhavin.myshopify.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
2。使用代理
Subpath prefix: apps
Subpath: cnv
Proxy URL: https://myapp.ngrok.io/proxy
现在我的
manifest.json
文件路径是https://bhavincb.myshopify.io/apps/cnv/manifest.json
如果我登录管理面板,Url 工作正常 如果我在未登录时打开该 URL,它会返回
This page isn’t working with HTTP ERROR 401
在我的前台商店加载清单文件时显示类似的内容(登录时)
Manifest: Line: 1, column: 1, Unexpected token.
manifest.json
没有任何错误
我正在使用 Laravel Shopify 包
据我所知,我想我在代理配置方面做错了。
有人有解决办法吗?
任何帮助将不胜感激
我决定发布我自己(参考 2。使用代理)
我的商店的问题实际上我正在使用免费试用并且在免费试用中你不能禁用密码保护
如果您的 密码保护 已启用并且您尝试在未登录的情况下访问代理 URL,在这种情况下,Shopify 将不允许访问。
购买计划后,一切正常
其实问题不在于Shopify demo的密码。 问题是当浏览器发送清单请求时,请求需要发送 shopify auth 的 cookie,否则它将被重定向到密码屏幕。
所以解决方案是在您的 html 中添加这样的“使用凭据”:
<link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials" />
(在此处查看文档https://developer.mozilla.org/en-US/docs/Web/Manifest)
更好的食谱可能是这个。第一,您使用您的应用程序访问商店主题的资产,并将您的 manifest.json 文本文件作为资产上传。这意味着它可以在 Liquid 和主题中访问,因此商店可以渲染它并使其有用。
其次,使用您的应用程序安装 custom.js 作为 ScriptTag 资产。这是完成运行您自己的 JS 的常用方法。
App Proxy 并不真正适合您使用它的方式。