image - React Native - 更快地加载图像而不缓存它的更好方法
问题描述
我正在使用FastImage缓存图像,它在缓存数据后加载图像的速度非常快。但是我的服务器每次都会为同一张图片生成新的 uri(s3 预签名 url)。
因此,FastImage 将其视为新图像并尝试每次下载都会影响我的应用程序性能。
我的问题是,有没有什么乐观的方法可以在不缓存的情况下尽可能快地渲染图像?
解决方案
如果您有机会修改服务器端应用程序,您可以创建授权标头而不是创建预签名的 url。
这个功能应该有帮助。
import aws4 from 'aws4';
export function getURIWithSignedHeaders(imagePath) {
if(!imagePath){
return null;
}
const expires = 86400; // 24 hours
const host = `${process.env.YOUR_S3_BUCKET_NAME}.s3.${process.env.YOUR_S3_REGION}.amazonaws.com`;
// imagePath should be something like images/3_profileImage.jpg
const path = `/${imagePath}?X-Amz-Expires=${expires}`;
const opts = {
host,
path,
headers: {
'Content-Type': 'image/jpeg'
}
};
const { headers } = aws4.sign(opts, {accessKeyId: process.env.YORU_ACCESS_KEY_ID, secretAccessKey: process.env.YOUR_SECRET_ACCESS_KEY});
return {
uri: `https://${host}${path}`,
headers: {
Authorization: headers['Authorization'],
'X-Amz-Content-Sha256': headers['X-Amz-Content-Sha256'],
'X-Amz-Date': headers['X-Amz-Date'],
'Content-Type': 'image/jpeg',
}
}
}
推荐阅读
- dask - 工人无法用 rasterio 反序列化
- inform7 - 如何访问玩家刚刚输入的动词?
- javascript - 在 Expo 项目中从 TextInput 获取文本时未定义不是对象
- java - 具有自动文本定位功能的 Graphic2D 生成图像
- ruby-on-rails - 如何使用 ruby 在两个新行上拆分文本
- python - 页面刷新时取消POST
- python-3.x - 是否可以使用 python pptx 删除形状的线条?
- laravel - 你如何在 Laravel (MPA) 中路由 Vue 布局
- python-3.x - MST 挑战给出“超时”错误
- angular - Angular Dart 组件中的(触发器)和(点击)有什么区别?