PHP+MySQL读取数据库图片渲染页面无法正常显示问题

• 核心错误：图片Data URI的MIME类型写法完全非法。你代码里写的data:img/cat;base64,不符合标准格式，img/cat是本地文件夹路径，不是浏览器可识别的图片MIME类型（合法类型为image/jpeg、image/png、image/gif等），浏览器无法解析该地址自然加载失败。
• 存储逻辑混淆：大概率你是把图片文件存在服务器本地img/cat目录下，数据库picture字段仅存储图片文件名，这种场景根本不需要使用base64编码输出，你错误套用了二进制图片输出的写法。
• 潜在数据损坏问题：如果确实是把图片二进制直接存在数据库中，可能存在字段类型过短（比如用VARCHAR/TEXT存二进制）、入库时未正确读取图片二进制流导致存进去的内容本身损坏，也会导致图片无法加载。
• 附带代码bug：表格循环内多写了一个空的<th scope="row"></th>标签，会导致表格列数和表头不匹配，出现样式错位。

根据你实际的图片存储方式二选一即可：

场景1：图片二进制存在MySQL BLOB字段中 #

修正MIME类型即可，根据你存储的图片格式替换对应MIME值，示例代码如下（以jpeg格式为例）：

<td>
    <img src="data:image/jpeg;base64,<?php echo base64_encode($row['picture']); ?>" style="width:100px; height:100px;">
</td>

如果是png格式图片，把image/jpeg替换为image/png即可。建议入库时额外新增字段存储图片的真实MIME类型，渲染时动态拼接，避免多格式图片显示异常。
同时检查数据库picture字段类型，必须使用MEDIUMBLOB或LONGBLOB类型，禁止使用字符串类型存储二进制数据，避免内容截断损坏。

场景2：图片存在本地img/cat目录，数据库仅存文件名 #

这是更常见的存储方案，直接拼接文件路径即可，不需要base64编码，代码如下：

<td>
    <img src="img/cat/<?php echo $row['picture']; ?>" style="width:100px; height:100px;">
</td>

注意检查img/cat目录的读取权限，确保PHP进程有该目录的访问权限。

额外修复 #

删掉循环内多余的空<th scope="row"></th>标签，修正表格列错位问题。

如果修改后图片仍无法加载，右键点击页面上的破损图片，选择「在新标签页打开图片」，查看地址栏的图片地址：

• 如果是base64格式，复制base64内容尝试转成图片，若转换失败说明数据库里存储的图片数据本身损坏，需要排查图片入库的上传逻辑，和前端渲染无关。
• 如果是路径格式，检查路径拼写是否正确、文件是否真实存在、目录权限是否正常。

内容的提问来源于stack exchange，提问作者Ninja Muffin