shopify - Storing and retrieving data for custom Shopify apps
问题描述
So I am trying to build something for my store but a few things are somewhat unclear.
If I need to save some user settings do I need my own backend just for that app specifically? For simplicity sake, I want build an app to save and display a custom message in cart-template.liquid.To achieve that, I think my app should make a request to my backend (let say, on heroku) and save it in some db that app is using?
How do I retrieve that data in cart-template.liquid? I guess I build a snippet that calls a public endpoint of my backend that returns that saved message using fetch() or maybe axios.get and embed it using {% render 'fetch-custom-message-snippet' %} ?
Say I ask for user input, ie. "Engraved message" and the form is in cart-template.liquid, of course. The following snippet is used:
<p class="line-item-property__field"> <label for="engraved-message">Engraved message</label> <input id="engraved-message" type="text" name="properties[Engraved message]"> </p>
How do I make sure that bit of information is captured and passed to me? I guess I want to see it somewhere in the order details.
解决方案
如果我需要保存一些用户设置,我是否需要专门针对该应用程序使用我自己的后端?为简单起见,我想构建一个应用程序来保存并在 cart-template.liquid 中显示自定义消息。为了实现这一点,我认为我的应用程序应该向我的后端(比如说在 heroku 上)发出请求并将其保存在一些该应用程序正在使用的数据库?
是的,您需要自己的后端。您的应用程序独自负责存储自己的信息(有一些例外情况,例如我在下面向您展示的特殊订单字段) - 这通常会推断出备份您的服务并保存您的数据的数据库。请查看此线程,因为您可以在那里找到许多有价值的信息。
关于cart-template.liquid
我建议看一下官方的“Shopify Developers”文档。您被允许显示和请求的所有信息都在那里得到了整齐的解释和排序。
如何在 cart-template.liquid 中检索该数据?我想我构建了一个片段,它调用我的后端的公共端点,它使用 fetch() 或 axios.get 返回保存的消息并使用 {% render 'fetch-custom-message-snippet' %} 嵌入它?
再一次,那里有很好的指南。我建议看看这篇深入探讨这个话题的博文。强烈建议阅读Shopify 关于 Liquid 模板语言的文档。
你如何检索这些数据?根据此特定示例,任何输入都将提供给您在 Shopify 后台中的订单页面。例如:
<label for="CartNote">Special instructions</label>
<textarea name="note" id="CartNote">{{ cart.note }}</textarea>
*取自https://shopify.github.io/liquid-code-examples/example/cart-notes*;显示Special instruction
标签和文本区域供用户提交有关订单的详细信息 - 如前所述,您将在 Shopify 后台的订单页面上获得此数据。
假设我要求用户输入,即。当然,“雕刻信息”和表格在 cart-template.liquid 中。使用了以下代码段: [...]如何确保捕获并传递给我的信息位?我想我想在订单详细信息中的某个地方看到它。
看上面
//编辑:
为避免混淆:您似乎只想开发一个自定义应用程序供个人使用,而不是在Shopify 应用商店中发布- 在这种情况下,您通常不需要外部数据库;例如,您提供的示例带有一个简单的订单请求,可以通过 Shopify 的示例轻松实现。
对于您的特定情况,此代码段(我修改了您的原始示例以适应这种情况 - 它cart-template.liquid
显然不是一个完整的;在这种情况下,该文件被称为cart.liquid
):
<label for="engraved-message">Engraved message</label>
<textarea name="message" id="engraved-message">{{ cart.note }}</textarea>
//编辑2:
该链接 - 由该线程中的另一个用户共享,即@Simas Butavičius - 如果您在一般的定制过程中遇到问题,即如果您想修改一些基本概念或想要检查如何实现代码,实际上是很有用的我建议您浏览一下您网站的整个结构中的上述片段。
不用说,有数百个很好的教程、关于同一“问题”或其他一般资源的问题。
我建议出于进一步阅读的目的查看其中一些链接和指南(上面可能提到了一些):
- https://shopify.github.io/liquid-code-examples/example/cart-notes
- https://shopify.github.io/liquid-code-examples/example/checkout-form(!非常好的深入示例)
- https://www.christhefreelancer.com/shopify-liquid-guide/
- https://shopify.dev/docs/themes/theme-templates/cart-liquid
- https://shopify.dev/docs/themes/liquid/reference
- https://www.shopify.com/partners/shopify-cheat-sheet(!有用的备忘单)
- https://community.shopify.com/c/Shopify-Design/Cart-Use-cart-attributes-to-collect-more-information/td-p/613718
- https://community.shopify.com/c/Shopify-APIs-SDKs/Add-custom-input-fields-to-cart/td-p/154710
- https://community.shopify.com/c/Shopify-Design/Product-pages-Get-customization-information-for-products/td-p/616503
推荐阅读
- angular - 使用 setInterval 取消订阅 RxJS
- javascript - 将模式链接到输入字段并使用 JavaScript 进行验证
- asp.net - 找不到文件 '..\bin\roslyn\csc.exe'。发布到服务器后
- vba - VBA Excel 这个循环的一半有效
- node.js - express static 2个不同的文件夹
- php - 自定义帖子类型分类中未显示帖子
- javascript - AJAX onreadystatechange 函数并不总是被调用
- python - 如何计算列表中的数字
- angular - 无法从 Angular 中的 Web api 获得响应
- user-permissions - 如何设置权限以编辑自己的用户数据而不是其他人的数据?