Shopifyembedded式应用程序authenticationstream程帮助SPA
我的Vue JS SPA + Express服务器出现以下问题:
问题#1-
我可以在开发商店安装应用程序,计费工作完美,一旦我进入应用程序,API函数工作得很好,但我认为它实际上是打开应用程序的问题 – 很可能是我的embedded式应用程序SDK的东西有问题,缺lessredirect。
我目前的stream程如下 – >
server.ngrok.io是一个Node / Express JS应用程序
client.ngrok.io是一个独立的客户端只有应用程序使用VueJS(没有服务器端渲染)
-
用户在server.ngrok.io/install上input应用程序
-
/安装构buildauth url并将用户redirect到它
-
Shopifyredirect回server.ngrok.io/finish_auth
-
/ finish_auth交换一个永久的临时令牌,将perm存储在我的数据库中,然后redirect到/ create_charge
-
/ create_charge和/ activate_charge完美工作,redirect到client.ngrok.io/
-
client.ngrok.io会在新窗口中打开,而不是在iFrame中。
我相信在这里的某个地方,我需要像这里的文档中所述的那样逃避一个iFrame –
Since the application is loaded inside an iframe it is critical that the initial OAuth request redirect escapes the iframe to make the requests. Shopify returns the X-Frame-Options=DENY header and prevents any Shopify admin pages from being loaded inside an iframe.
这是我“新窗口”开放问题的原因吗? 如果是这样,你能给我任何指示,这个iFrame逃生应该在我的stream程中发生? 我发现的最好的资料是2014年的这篇关于构buildembedded式Shopify应用程序的文章,但对我来说还是不太清楚。
问题2 –
一旦我进入embedded式应用程序(刷新通常工作),我在控制台中得到这个错误 –
Shopify.AppMessenger received message null from unexpected origin https://client.ngrok.io ; expecting https://server.ngrok.io or subdomain thereof
该应用程序工作正常,我可以做我的API调用罚款 – 但我觉得这也造成了问题。
任何帮助将不胜感激 – 我真的想要得到这个,并得到一些应用程序,但我正在努力解决这两个问题。
在步骤2中,使用“iframe转义”脚本呈现空白页面,而不是直接将用户redirect到OAuth页面。