缩略图图像不显示在 iPhone 或 iPad 上，但在 Android 上显示

Posted 2023-03-29

【中文标题】缩略图图像不显示在 iPhone 或 iPad 上，但在 Android 上显示

【英文标题】：thumbnail images do not display on iphone or iPad but do on Android

【发布时间】：2020-03-24 12:19:05

【问题描述】：

AJAX 请求从网站下载文本和 jpg 缩略图，然后显示在表格中的单独单元格中，所有这些都是使用 jQuery 动态创建的。这一切在 android 上都可以正常工作，但缩略图不会显示在 iPhone 或 iPad 上（我还没有测试过其他 Apple 设备）。文本在 iPhone 和 iPad 上正确显示。每个缩略图大约 40Kb。这不是一个移动应用程序。 这是我的javascript：

var newCell = $('<td>').addClass('photoCell textCell');
$(newRow).append(newCell);
$('<img />').prop(
    'src': "data:image/jpeg;base64;charset=utf-8,"+obj_elem,
    'className': 'buyPhotoThumb'
    ).appendTo(newCell); 

如何让缩略图显示在 iPhone 和 iPad 上？

【问题讨论】：

问题是由于数据方案的元素排序不正确造成的。我有“数据：图像/jpeg；base64；charset=utf-8”。交换 'base64' 和 'charset=utf-8' 的位置解决了这个问题。数据方案的正确说法是：“data:image/jpeg;charset=utf-8;base64”。这在en.wikipedia.org/wiki/Data_URI_scheme#Syntax 中并没有那么简单地说明，但信息仍然存在。

我刚刚注意到 Hemant Metalia 在***.com/questions/8499633/…

中已经回答了这个以更一般的方式提出的问题

【参考方案1】：

问题是由数据方案的元素顺序不正确引起的。我有“数据：图像/jpeg；base64；charset=utf-8”。交换 'base64' 和 'charset=utf-8' 的位置解决了这个问题。数据方案的正确说法是：“data:image/jpeg;charset=utf-8;base64”。这在 en.wikipedia.org/wiki/Data_URI_scheme#Syntax 中并没有那么简单地说明，但信息仍然存在。