Shopify 订单项属性 图片上传方式 Ajax
Shopify Line Item Properties Image upload via Ajax
是否可以使用 Shopify 通过 Ajax 上传订单项 属性 图片? Shopify 不允许通过 Ajax.
上传文件
我想出了一个使用 Cloudinary 的解决方法(不直接上传到 Shopify)。我想我会在这里分享它。
Ajax 在 Shopify 中上传图片作为订单项属性的解决方案。
最初,我尝试将图像转换为 BASE64,然后 Ajax 上传 BASE64 字符串。然而,这在它显示整个 BASE64 字符串而不是图像的顺序内有效...
所以,我求助于 Cloudinary——一种图片上传服务。 Cloudinary 自动将 BASE64 编码图像转换回 'proper' 图像。
在 Cloudinary 中,我们需要启用未签名的图片上传才能正常工作。
http://cloudinary.com/blog/direct_upload_made_easy_from_browser_or_mobile_app_to_the_cloud
启用后,我们可以AJAX将 BASE64 图像上传到 Cloudinary。
var data = {
upload_preset: "019au6h3", // the unsigned image preset within cloudinary
tags: "foo", // any tags you wish to apply
context: "photo=phototitle",
file: encodedImage // the BASE64 encoded image file
}
// standard Jquery ajax post
jQuery.post("https://api.cloudinary.com/v1_1/dn5wucjj2/upload", data).done(function(data) {
// do something here
}).then(function(data) {
addToCart(data.secure_url) // addToCart is the ajax add to cart post function (whatever function your theme uses, modified to accept an the returned image)
});
data.secure_url 是 Cloudinary returns 图片上传后的 url。然后我们可以将其传递给我们的 addToCart 函数 - 它将产品添加到 Shopify 的购物车。
在结帐时,客户会看到 url 他们的图像(不理想)。但是,在后端,在订单中,Shopify 将 url 变成了 link.
是否可以使用 Shopify 通过 Ajax 上传订单项 属性 图片? Shopify 不允许通过 Ajax.
上传文件我想出了一个使用 Cloudinary 的解决方法(不直接上传到 Shopify)。我想我会在这里分享它。
Ajax 在 Shopify 中上传图片作为订单项属性的解决方案。
最初,我尝试将图像转换为 BASE64,然后 Ajax 上传 BASE64 字符串。然而,这在它显示整个 BASE64 字符串而不是图像的顺序内有效...
所以,我求助于 Cloudinary——一种图片上传服务。 Cloudinary 自动将 BASE64 编码图像转换回 'proper' 图像。
在 Cloudinary 中,我们需要启用未签名的图片上传才能正常工作。
http://cloudinary.com/blog/direct_upload_made_easy_from_browser_or_mobile_app_to_the_cloud
启用后,我们可以AJAX将 BASE64 图像上传到 Cloudinary。
var data = {
upload_preset: "019au6h3", // the unsigned image preset within cloudinary
tags: "foo", // any tags you wish to apply
context: "photo=phototitle",
file: encodedImage // the BASE64 encoded image file
}
// standard Jquery ajax post
jQuery.post("https://api.cloudinary.com/v1_1/dn5wucjj2/upload", data).done(function(data) {
// do something here
}).then(function(data) {
addToCart(data.secure_url) // addToCart is the ajax add to cart post function (whatever function your theme uses, modified to accept an the returned image)
});
data.secure_url 是 Cloudinary returns 图片上传后的 url。然后我们可以将其传递给我们的 addToCart 函数 - 它将产品添加到 Shopify 的购物车。
在结帐时,客户会看到 url 他们的图像(不理想)。但是,在后端,在订单中,Shopify 将 url 变成了 link.