Shopify App代理以显示每个页面中的内容

Question

我正在尝试通过加载脚本将App Proxy内容提供给shopify商店。

我创建了一个在Amazon S3服务器上加载的index.html文件，并将内容类型设置为application / liquid。

如果我去shopname / apps / proxy，我会将我的div插入到shopofy布局和一些内容中。 但我的应用程序只是一个div，我想插入到商店的每个页面。 以下是我尝试过的两种方法 -

$('body').load('/apps/proxy'); 无论我在哪个页面，它都会自动将我重定向到主页。

如果我尝试

$('body').append('div id="myDiv">/div>');

$("#mydiv").load('/apps/proxy');

它复制了页面的内容

我无法理解为什么整个店铺布局都被调出，我确信这是我对shopify UI如何工作缺乏了解，但我只希望我的表单显示为div作为一部分这页纸 。

Answer 1

应用程序代理用于完整页面查看，并包含一个shopify页眉和页脚，其中包含您的服务返回的代理内容。 它不适用于部分页面浏览 - 没有合适的方法来嵌入小部件，这让我很懊恼。

当您执行$('body').load('/app/proxy');时，您将用另一整页替换整个页面的正文。

在您的应用设置中，您很可能将/app/proxy设置为重定向到您的主页。如果您愿意，可以在此之外添加更多路径（/app/proxy/sub_page）。但如前所述，它不适合嵌入其他页面，而是用于新的独立页面。

Answer 2

当您呼叫应用程序代理时，您将返回html。将从回调返回的HTML附加到文档中的某个元素，您将完成所需的操作。

请注意，Shopify确实呈现了Shop主题的整个布局。您无法替换Shopify布局。您可以替换代理URL的内容。

所以，最好的办法是将S3内容视为从XHR调用中获得的HTML。

听起来你应该只使用iframe。 App Proxy不适用于您正在做的事情，静态内容。