Base64编码PNG图片IE正常显示，Chromium浏览器无法加载求助

可能原因及解决办法 #

• 补全Base64填充符
  Chromium对Base64格式的校验比IE严格，要求字符串长度必须是4的倍数，不足的需要用=填充。你当前的Base64末尾没有填充符，IE可能自动容错补全，但Chromium不会。先计算你的Base64字符串长度，若不是4的倍数，在末尾添加1-2个=试试。

• 验证PNG文件合法性
  把Base64解码成本地PNG文件，用图片查看工具打开确认文件是否完好。如果PNG本身存在格式缺陷（比如缺失文件尾、CRC校验错误），IE的解码器容错性更强，能正常显示，而Chromium的解码器会直接拒绝解析。

• 重新生成标准Base64编码
  若原始PNG文件存在，用标准工具重新编码：

  • Python脚本：

    import base64
    with open("original.png", "rb") as f:
        encoded = base64.b64encode(f.read()).decode("utf-8")
    print(encoded)
    

  • 命令行（Linux/macOS）：

    base64 original.png > encoded_base64.txt
    

  用新生成的Base64字符串替换原代码中的对应部分。

• 检查data URI格式
  确认data:image/png;base64,与后续Base64字符串之间没有多余空格、换行或不可见字符，这些细节在IE中可能被忽略，但会导致Chromium解码失败。

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