# Discourse 生成缩略图时丢失顶部/底部像素

**URL:** <https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612>\
**Category:** Feature\
**Created:** [2021年一月19日 20:26 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612 "2021-01-19T20:26:27Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![LeoDavidson](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/leodavidson/32/119574_2.png) [@LeoDavidson](https://meta.discourse.org/u/LeoDavidson)\
**Post date:** [2021年一月19日 20:26 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612/1 "2021-01-19T20:26:27Z")

</div>

当您将图片附加到帖子时，Discourse 会调整其大小以生成适合显示的缩略图。

在此过程中似乎存在一个错误，导致缩略图始终丢失顶部和底部的像素行。

这并非什么大问题，但会让带有细边框的内容看起来异常。（例如：大多数 Windows 10 软件截图看起来都不对劲，因为窗口底部边缘缺失了。）

观察结果：

- 这似乎与宽高比无关，因此我认为这不是对极宽或极高图片的有意裁剪；这更像是一个错误。

- 我已确认缩略图图像资源本身确实缺失了像素。因此，问题发生在后端生成缩略图时，而非浏览器显示时。

- 编辑：我刚刚注意到，顶部和底部的像素并非完全消失，而是变得如此模糊或淡化，以至于几乎等同于消失。这可能与调整大小算法如何处理图像边缘有关？它似乎从未出现在左右边缘，例如在竖屏截图的情况下。

- 当您点击查看全尺寸图片时，至少该图片会正确显示。

希望这张示例图片能在此 Discourse 论坛上复现该问题：

 ![1px_red_border](https://global.discourse-cdn.com/meta/original/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289.png)

这应该是一张白色背景、四周带有 1 像素红色边框的图片。如果问题在此出现，您将只能看到左右边框，直到点击查看全尺寸图片。

（编辑：确实在此处发生了该问题。）

如果问题未在此出现，以下是我在自己的论坛上看到的结果：

 ![example](https://global.discourse-cdn.com/meta/original/3X/8/8/882c21b2b495a416c86cb7c1b145167ac89b164a.png)

测试时，您需要在发布后稍等片刻（有时还需刷新帖子）才能看到该现象，因为缩略图需要在发布后几秒钟才能在服务器端生成。

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2021年一月22日 05:02 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612/2 "2021-01-22T05:02:55Z")

</div>

是的，我也注意到这个问题有一段时间了。不确定能采取什么措施来解决。

---

<div class="post-metadata">

**Author:** ![riking](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/riking/32/170938_2.png) [@riking](https://meta.discourse.org/u/riking)\
**Post date:** [2021年一月22日 05:53 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612/3 "2021-01-22T05:53:20Z")

</div>

> [@LeoDavidson](#):
>
> （编辑：确实似乎在这里发生。）

有意思，我看到了顶部、左侧和右侧，但没有看到底部。

| chrome://gpu | |
| --- | --- |
| Chrome 版本 | Chrome/87.0.4280.141 |
| 操作系统 | Windows NT 10.0.19042 |
| GL\_RENDERER | ANGLE (Intel(R) HD Graphics 620 Direct3D11 vs\_5\_0 ps\_5\_0) |

---

<div class="post-metadata">

**Author:** ![LeoDavidson](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/leodavidson/32/119574_2.png) [@LeoDavidson](https://meta.discourse.org/u/LeoDavidson)\
**Post date:** [2021年一月22日 10:38 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612/4 "2021-01-22T10:38:09Z")

</div>

我想知道这是否取决于屏幕尺寸，即为不同客户端提供不同的资源。

通过 F12 快速查看上面的帖子/图片，我发现了两个优化版本以及原始图片：

- 原始图片 (1416 x 946) `/original/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289.png`，未经任何修改。[直接链接](https://global.discourse-cdn.com/meta/original/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289.png)

- 较小版本 (1380 x 920) `optimized/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289_2_1380x920.png`，其顶部和底部边缘几乎不可见。[直接链接](https://global.discourse-cdn.com/meta/optimized/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289_2_1380x920.png)

- 更小的版本 (640x460) `optimized/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289_2_690x460.png`，完全没有底部边框，但保留了左侧、顶部和右侧边框。[直接链接](https://global.discourse-cdn.com/meta/optimized/3X/e/2/e2c5f032e18fa374c0593af71cf25d3499826289_2_690x460.png)

或许可以使用一些 ImageMagick 参数来调整缩放算法及其对边缘像素的处理方式，不过任何改动当然可能在改善当前情况的同时，使其他场景变得更糟。

---

<div class="post-metadata">

**Author:** ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)\
**Post date:** [2021年一月29日 03:23 UTC](https://meta.discourse.org/t/discourse-loses-the-top-bottom-pixels-when-generating-thumbnails/176612/5 "2021-01-29T03:23:13Z")

</div>

> [@LeoDavidson](#):
>
> 或许可以通过调整 ImageMagick 的参数来优化缩放算法及其对边缘像素的处理方式，当然，任何改动都可能在改善当前情况的同时导致其他问题。

是的，我也这么认为。这确实是一个缩放算法的问题。只要原始版本得以保留，我认为这里并不存在严重问题，因此我将此转为功能请求。
