javascript - 模板化时存储和访问图像文件路径(来自 cloudinary 或其他服务)

标签 javascript image path hosting cloudinary

我正在使用 gulp 和 nunjucks 来自动执行一些基本的电子邮件模板任务。

我有一系列任务,当图像添加到图像文件夹时可以触发这些任务,例如:

  1. 图像已压缩
  2. 新图像名称和尺寸记录到 json 文件
  3. 然后在模板任务运行时使用 json 图像数据填充模板

到目前为止一切顺利。

我希望能够为每个模板定义一个通用图像文件路径,然后将其连接到每个图像名称(如存储在 json 文件中)。所以类似:

<img src="{{data.path}}{{data.src}}" >

如果我想指定一个不同的文件夹来包含生成的每个模板的图像,则 cloudinary 需要在文件路径中应用强制的唯一版本组件。因此整个模板中的图像路径永远不可能保持一致。

if your public ID includes folders (elements divided by '/'), the version component is mandatory, (but you can make it shorter. )

例如: http://res.cloudinary.com/demo/image/upload/v1312461204/sample_email/hero_image.jpg

http://res.cloudinary.com/demo/image/upload/v1312461207/sample_email/footer_image.jpg

同一个文件夹。不同的道路。

所以看来我现在需要创建一个脚本/任务,可以在上传或更新图像时记录和存储每个图像的每个不同文件路径(具有由cloudinary生成的唯一ID),然后重新运行模板发布它们的过程。

这似乎是一个相当复杂的过程,所以我想知道是否有更简单的方法?

否则,如果这确实是必需的路线,那么如果有人能给我指出实现类似功能的脚本示例,那就太好了。

大概某些托管服务不会有强制的唯一 key ,这会让生活变得更轻松。我花了一些时间来了解 cloudinary,它是一项免费服务,范围很广,所以我想我不愿意放弃,但愿意接受所有建议。

谢谢

最佳答案

请注意,对于大多数用例来说,版本组件(例如,v1312461204)不再是必需的。该 URL 确实可以在没有它的情况下工作,例如: http://res.cloudinary.com/demo/image/upload/sample_email/hero_image.jpg

话虽如此,如果您想使用新图像更新图像,同时保持完全相同的公共(public) ID,则强烈建议您在 URL 中包含版本组件。在这种情况下,如果您访问完全相同的 URL,您可能会获得该图像的 CDN 缓存版本,该版本可能是旧版本。 因此,当您上传时,您可以从 Cloudinary 的上传响应中获取 version 值,并将其存储在您的数据库中,并且下次更新图像时,也使用新版本值更新 URL。

或者,您也可以要求 Cloudinary 在上传时使图像无效。请注意,虽然包含版本组件会立即“破坏”缓存,但失效可能需要一段时间才能通过 CDN 传播。了解更多信息: http://cloudinary.com/documentation/image_transformations#image_versions

关于javascript - 模板化时存储和访问图像文件路径(来自 cloudinary 或其他服务),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38505892/

相关文章:

javascript - Firebase 2 (firebase.google.com) 推送通知 - 从外部管理

javascript - 如何在 JQuery 中创建一个水平循环的自动收报机

javascript - webgl 中的递归分形二维树绘制

html - 网站设计有很多图像并且正在增加加载时间

asp.net-mvc-3 - 如何在 MVC3 应用程序的 OnApplicationStarted 中获取应用程序根目录(完整物理路径)?

java - 如何将值从 javascript 传递到隐藏字段

python - 有没有办法在现有变量上使用 Pillows "Image.convert()"?

javascript - 在未加载图片时,是否可以使用代码来提醒用户?

python - bash : 'command not found' for python, r 和 nano

algorithm - 遍历具有负节点和循环节点的图的最佳算法是什么