如何解决如何将查询字符串从 Shopify 传递到嵌入式应用程序? 此图片显示了它在每个请求上的外观此图显示了我的应用程序的行为在这张图片中,您可以看到,当您将鼠标悬停在路由上时,不存在查询字符串,这意味着父应用以某种方式传递了这些字符串
我正在使用 Next.js 构建 Shopify 应用程序,我需要获取查询字符串,以便我可以检查 getServerSideProps
商家的身份(请记住,不建议将 Cookie 用于 Shopify 应用程序)
在访问某些应用程序时,我注意到其中一些应用程序在每个请求中都获取了从 Shopify 传递过来的查询字符串。
此图片显示了它在每个请求上的外观
此图显示了我的应用程序的行为
在这张图片中,您可以看到,当您将鼠标悬停在路由上时,不存在查询字符串,这意味着父应用以某种方式传递了这些字符串。
截至目前,我正在使用 Cookie 来传递 shopOrigin,但我觉得如果我能够以某种方式获取每个请求中的查询字符串,以及使用 HMAC,我将能够验证它是没有必要的请求来自 Shopify。
解决方法
从 Shopify 发起的对您的应用的任何调用都会在发出请求时正确提供商店参数。在您自己的 App 调用自身时,您也可能使用商店名称作为查询字符串值。
请注意,您仍然可以使用 cookie 在内部验证您的会话,只是不要像过去那样通过 iframe 之外的第三方路由进行验证。 Shopify 有大量关于如何正确验证和构建应用程序的文档,请查看。他们甚至为您提供了一个可以运行的 Node 应用程序,这样您就可以确保自己做对了。
,解决方案非常简单。
Shopify 提供了一个 div.rounded div div div {
background-image: unset; /* reset background */
padding: unset; /* reset padding */
}
AppBridge 组件,您可以使用它来处理应用程序的导航。它所做的是,在每次路由更改时,它都会重新加载 iframe,并且 hmac、商店、代码和时间戳会出现在请求中。它比客户端路由慢一点,但它按预期工作。
为了使用它,你只需要去:
合作伙伴的仪表板/您的应用程序/扩展程序/嵌入式应用程序(单击管理)/导航(单击配置)并添加导航链接,然后您只需从 TitleBar
导入 TitleBar
和把它放在app-bridge-react
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。