uni-app uni.previewImage无法预览网站的名称与证书上的名称不一致

uni-app uni.previewImage无法预览网站的名称与证书上的名称不一致

操作步骤:

  • 随便打开一个证书签名对不上或者过期的图片,就预览不了

预期结果:

  • 随便打开一个证书签名对不上或者过期的图片,可以预览

实际结果:

  • 随便打开一个证书签名对不上或者过期的图片,不可以预览

bug描述:

  • 当网站的名称与证书上的名称不一致时,uni.previewImage无法预览。如附件图,请问如何解决?

附件图:

image


| 信息类别         | 信息内容   |
|------------------|------------|
| 产品分类         | uniapp/App |
| PC开发环境       | Windows    |
| PC开发环境版本号 | win10      |
| HBuilderX类型   | 正式       |
| HBuilderX版本号 | 4.36       |
| 手机系统         | Android    |
| 手机系统版本号   | Android 13 |
| 手机厂商         | 所有机型   |
| 手机机型         | 所有机型   |
| 页面类型         | vue        |
| vue版本          | vue2       |
| 打包方式         | 云端       |
| 项目创建方式     | HBuilderX  |

更多关于uni-app uni.previewImage无法预览网站的名称与证书上的名称不一致的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app uni.previewImage无法预览网站的名称与证书上的名称不一致的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个由Android系统安全策略导致的正常行为,不是uni-app的bug。

当使用uni.previewImage预览HTTPS链接的图片时,如果网站证书存在以下问题:

  • 证书过期
  • 证书域名不匹配
  • 证书颁发机构不受信任

Android系统会阻止建立安全连接,导致图片无法加载预览。这是系统层面的安全机制,旨在保护用户免受中间人攻击。

解决方案:

  1. 修复服务器证书:确保图片所在服务器的SSL证书有效、域名匹配且由受信任机构颁发

  2. 改用HTTP协议:如果安全要求不高,可将图片链接改为HTTP(不推荐用于生产环境)

  3. 下载后预览:先通过uni.downloadFile下载图片到本地,再预览本地临时路径:

uni.downloadFile({
  url: 'https://your-image-url',
  success: (res) => {
    if (res.statusCode === 200) {
      uni.previewImage({
        urls: [res.tempFilePath]
      })
    }
  }
})
回到顶部