问题标签 [imgix]

我开始使用响应式图像，但我有一点疑问。

我有一个图标。我网站上的这个图标总是有两种尺寸：一个小版本，74 像素宽，一个大版本，94 像素宽。

我使用 imgix 为大图标创建了这个 srcset。我检查了图像，它们以正确的方式调整大小，1x 是 94 像素宽，2x 是 188 像素宽。

我固定了 94 的大小，因为在大版本中，图像总是 94px。

现在我的问题是：对于 74 像素版本，所以小图标，我必须使用 74 像素的大小重新创建集合？

我正在使用灯箱插件（https://github.com/imgix/luminous）

我有以下设置（见下文），能够为单个图像的灯箱添加标题，但我不知道如何使其适用于多个图像。我真的不想手动更改插件源代码，但如果这是唯一的方法，那就没问题了。我欢迎任何建议。谢谢。

HTML

JAVASCRIPT

所以我有一个 laravel 项目，该项目快完成了，我们只是将所有图像传输到 S3 存储桶并将 IMGIX 连接到 S3 存储桶，因此所有图像都通过 IMGIX 从 S3 提供，这还可以在航班。

但是，CSS 中的图像具有相对路径，例如

视图中的图像是这样的：

有什么方法可以在网站上的所有图像（视图+ CSS）前面动态添加 IMGIX url（www.domain.imgix.net），以便它们都通过 IMGIX？

我对网络开发很陌生，只是一个自学成才的爱好者，所以请善待:)

现在我正在尝试在 Pythonanywhere 上部署我的网站（使用 Django 构建）。遵循有关静态文件的所有建议，它确实有效。这样基础就做好了。但是图像加载速度非常慢。我知道有一些尺寸和重量优化要做，但我也听说提供大量图像的最佳方式是将它们与代码分开存储（在 Amazon S3、谷歌云存储中）并通过 CDN 提供服务。我还发现了一个名为 IMGIX 的不错的服务，它始终提供最合适的图像版本。

现在是一个难题：它是如何协同工作的？好的，我可以将所有图像上传到存储桶，也可以将 CDN 指向它。但是那么我该如何在 Django 中进行“collectstatic”呢？如何保持这些图像与模型相关联？我是否通过将 STATIC_DIR 和 STATIC_ROOT 指向该存储桶来解决它？我的思想在这里让我失望，谷歌搜索也没有帮助。

任何帮助将不胜感激。

我正在尝试使用 vue.js 和 Laravel 创建照片网站，并在单击时使用发光放大照片。我的照片存储在 AWS S3 存储桶中。

我的 vue.js 结构如下所示。

1.PhotoComponent.vue

• 这个组件实际上是在渲染每张照片。

2.PhotoListComponent.vue

• 这个组件正在制作一个 PhotoComponent.vue 列表。

到目前为止，我尝试了三件事。

1. 将 new Luminous() 放入 PhotoComponent 中，并将函数放入 mount 部分。

在这种情况下，第一张图片有效，但 "" 打开的数量与 PhotoComponent.vue 一样多。例如，如果我在 PhotoListComponent 中列出 9 张图片并单击第一张照片，“”会打开 9 次。但是，其他图片根本不起作用，但会打开新标签。

2. 将 new LuminousGallery() 放入 PhotoListComponent 中，并将函数放入已安装部分。

在这种情况下，每当单击照片时都会打开一个新选项卡，这意味着发光功能不起作用。

3. 未安装，但在这些组件中添加点击事件。

例如...

在这种情况下，结果与模式 1 几乎相同，但第一张图片完全符合我的预期。但是，其他图片即使是新标签也不会打开任何东西。

抱歉吐槽了。我被这个问题困扰了一个星期。我真的需要别人的帮助。谢谢您的合作。

我想从 imgix 缓存中清除图像，他们有一个 API（https://docs.imgix.com/setup/purging-images）

我使用 axios 从我的 nodejs 后端发出请求：

问题是除了状态码 400 之外没有指定其他内容，我检查了图像路径并尝试了不同的Content-Type标题，例如他们的示例，但这也不起作用。

由于我无法从回复中获得更多信息，因此我在这里寻求帮助，因为我不知道如何继续。

我正在使用 next.js 导出来创建托管在谷歌云存储上的静态 html 导出。

我在 next.js 配置中使用了这个解决方法。

我如何需要配置一个外部加载器，例如 imgix 才能正常工作？

我正在寻找一种解决方案来调整、优化和使用 webp 格式来处理我网站上的图像。我已经在使用 AWS，想知道是否需要使用 IMGix 或 ImageKit 来完成此操作，或者是否可以使用 AWS。

提前感谢您查看我的问题！

我需要在我的静态构建的 Next.js 网站上渲染图像，我想按照今天的最佳实践来做。

我已经看到 Next.js 包含了开箱next/Image即用的大部分优化。鉴于我不会以多种尺寸保存图像，我正在寻找 imgix 为我做这件事。

我对这个设置的设想是，我将所有图像转储到一个 S3 存储桶中（我只知道文件名），imgix 将使用它。给定文件名和宽度要求，然后我会next/Image通过它的 imgix 加载器来调整和渲染图像的大小。

我感到困惑的是，Next.js 文档提到宽度和高度都应该事先知道。如果我只向 imgix 提供宽度并让它发挥其调整大小的魔力，我怎么知道高度？

我确信我在这里遗漏了一些明显的东西，但我们将不胜感激。