React Native react-native-image-crop-picker图片重登后显示空白
问题根源
你存到后端的是react-native-image-crop-picker生成的安卓本地缓存路径,不是可长期访问的资源路径,失效逻辑非常明确:
- 这个路径对应的文件存在于应用的临时缓存目录,系统会在应用退出、后台清理、空间不足时自动删掉这些临时文件
- 仅在你上传图片的那一瞬间、当前设备上,这个路径是可访问的,等你退登重登,这个临时文件早就被清了,自然加载不出来
- 这种本地路径只对当前设备有效,存到后端毫无意义,其他设备拿到这个路径完全访问不了,就算同设备换账号登,缓存清了也会白屏
修复方案
- 先改后端存储逻辑:上传接口不要存前端传的本地路径,要接收前端上传的图片二进制流,后端把文件存到自己的存储/对象服务里,生成
http/https开头的可访问URL,返回给前端存到用户的资源列表里 - 前端加载图片时直接用后端返回的远程URL作为source,别再用之前的本地
file://路径 - 加个容错:给
<ImageBackground>绑定onError事件,加载失败时切默认占位图,别直接露白底
如果要支持离线查看已上传的图片,就在上传成功后用
react-native-fs把临时图从缓存目录复制到应用永久存储目录,用永久目录的路径做本地缓存的加载源,别直接用缓存路径存到本地长期使用。
内容的提问来源于stack exchange,提问作者cukz123
相关产品推荐
相关产品推荐

