以全尺寸查看图像

We’re running a graphics community, and members often post (very) high res images. Currently, when you click on an image it will enlarge it, loading the original image but scaled to the viewport. Clicking the enlarged image will take you to the next image in the post, and users have to “right click -> view image in new tab” to see it at full, original size (or download the image).

Is there a way to either change this behavior so that clicking an enlarged image will open it at full-size? Alternatively (and perhaps nicer), is it feasible to create a theme component that adds a “view full size” option below the enlarged image?

Thanks!

I never understood the difference between this and the download link, aren’t they the same thing? We have an existing discussion on this here on meta already…

You may not want to actually have the file in your downloads folder just to take a quick look at something. Also, it requires at least one additional click to download and then view. ArtStation has an elegant solution for this (example link), and I use it all the time:

I think in most browsers the download icon just opens the raw image URL in a new browser tab and it’s not saved anywhere (outside of your cache) unless you right click… so I guess the labeling might be a bit misleading?

Hmm maybe I’m missing something, but for me, it always actually downloads the file. Is it a configuration thing? Opening image files in a new tab would be :ok_hand:

oh hmm maybe it’s OS level then? Safari/Chrome/Firefox on MacOS open the image URL in the browser whenever I click download

Wow, it does here, but not on my site (example link). I checked in safe mode and it still downloads there, suggesting some site setting. I’ll dig in, if you have any ideas I’d love to hear.

And yes, is opening the file in a new tab is the expected behavior then ‘download’ might not be an accurate label.

Ah I see, so your site isn’t directly linking the image with the extension, the URL is https://blenderartists.org/uploads/default/0dea5b078999bf99ae583dfc353e31dde79bf764

It has the same behavior in safe mode with all themes/plugins disabled… so it must be a difference in the image handling configuration

The difference is in expected behavior. At least to me, “Download” implies saving an asset and is something I reserve for some kind of later usage or project, whereas something like “View Full” implies a quick means to do just that.

They’re different enough that equating them can apparently cause confusion.

It would be ideal to offer both behaviors for a given image, like the ArtStation example. There’s no ambiguity there.

Hmm, I did some digging (warning: I’m a Ruby noob) and from what I see the download URL is taken from the data-download-href on the image. It seems to be defined here:

But this attribute only contains the ‘upload.sha1’, and no file extension. The image a href’s in this topic don’t contain the data-download-href attribute, I wonder if this is because the image I just shared above is too small to be resized and didn’t trigger a rebake. I’ll upload a larger one below for testing (CC0 licensed):

Maybe it’s because BlenderArtists doesn’t use a CDN (!?) so they get the content-disposition from our service that tell the browser to download it, and the Meta CDN is stripping it? :thinking:

We use Cloudflare for images only. I just checked on another Discourse server (one that I know does not use a CDN), and see the same download behavior there - example link.

我们应该把这个帖子移到 bug 吗?

可以确认,如果没有 CDN,确实会出现这种情况。

说实话,我建议您使用 CDN。这不仅能显著提升用户的访问速度,还能大幅减轻您服务器的负载。

我了解这些优势——尤其是当您使用靠近用户的端点时。不过,目前 Cloudflare 的缓存对我们来说已经足够有效了(速度相当快,并且减轻了服务器提供图片的负担),而且我们目前的预算仍然非常紧张。

我们在这里应该保持一致性。

如果 CDN 开启和关闭时,“下载”图片的行为不应该不同。@pmusaraj 你在这个区域投入了不少时间,是否有什么原因导致在定义了 S3 CDN 的情况下没有特殊的 Content-Disposition 设置,而在本地安装时却有?

@codinghorror 我认为我们这里使用的词语和图标有些不当。只需显示 :link: original,并且不要包含任何与“下载”相关的“内容处置”逻辑。用户点击后应无条件跳转到图片所在的 URL。这同时也简化了 CDN 的实现,可谓一举两得。

嗯,不,正确的点击下载处置正是构成此功能的一部分。

好的,那么我们需要在这里将处置流程传递给 AWS CDN @pmusaraj,我猜应用将需要作为下载的前端。(同时也请确认其与标准 CDN 的兼容性)

关于原始发帖人,@bartv,如果你想在灯箱中提供一个 全尺寸:link: 链接,那么你可能需要一个主题组件。

我其实看不出这里有什么行为差异的问题。CDN 可以支持更高级的下载功能,而非 CDN 环境则采用更简单的行为即可。