场景描述

在进行产品推广时，因为有不同的推广人员，所以推广用的海报，需根据不同的推广人员，展示不同的二维码。
在controller中动态生成海报，并返回图片流到页面进行展示。
实际操作时，安卓手机中长按海报图片，选择“另存到相册”，提示保存失败；选择转发给朋友，不弹出选择好友列表，转发失败。
但是在苹果手机中可正常保存和转发。

原因

在controller中返回的是一个图片流。
在页面处理图片时，是blob:xxx形式。而安卓微信不支持blob形式的图片进行“另存为”操作。

解决方案

将controller返回的图片流，转为base64形式显示

页面图片展示部分

<van-popup v-model="showSharePic">
  <van-loading v-if="loading" type="spinner" size="24px">正在生成海报</van-loading>
  <img v-else ref="posterImg" :src="posterImg" />
</van-popup>

api接口

使用axios

export default {
  genPic(id) {
    // 返回图片流
    return request.request({
      url: `/genPoster`,
      method: 'get',
      responseType: 'blob',
      headers: {'token': '123456'}
    })
  }
}

页面代码处理图片流blob形式

myApi.genPic(id).then(res => {
    this.loading = false
    // 输出图片流,注意，此方法会在src中生成blob:xxx形式的图片，在安卓手机的微信中，不能另存为，不能发送给朋友
    let src = window.URL.createObjectURL(res)
    this.posterImg = src
})

页面代码处理图片流base64形式

myApi.genPic(id).then(res => {
    this.loading = false
    // 使用下面的方式将图片流转为：data:image/jpeg;base64形式，赋值给图片的src
    const a = new FileReader()
    a.readAsDataURL(res)
    a.onload = e => {
      this.posterImg = e.target.result
    }
})

controller部分代码

BufferedImage bufferedImage = ImageTools.genPoster(......);

//输出图片流
res.setHeader("Pragma", "no-cache");
res.setContentType("image/jpeg");
res.setDateHeader("Expires", 0);
res.setHeader("Cache-Control", "no-store,no-cache,must-revalidate");
res.addHeader("Cache-Control", "post-check=0, pre-check=0");
try (ServletOutputStream outputStream = res.getOutputStream()) {
    //输出流输出图片,在页面为blob形式，注意：安卓手机无法将blob形式的图片保存，需要页面处理
    ImageIO.write(bufferedImage, "jpg", outputStream);
    outputStream.flush();
} catch (IOException e) {
    e.printStackTrace();
}

最后

以上就是鲜艳斑马为你收集整理的在安卓手机中使用微信保存图片提示失败的处理场景描述原因解决方案的全部内容，希望文章能够帮你解决在安卓手机中使用微信保存图片提示失败的处理场景描述原因解决方案所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。