React Native - 加载图片的更好方式,无需缓存即可快速加载

8
我正在使用FastImage来缓存图像,而且在缓存数据后加载图像非常快。但是,我的服务器每次为相同的图像生成新的uri(s3预签名url)。

因此,FastImage将其视为新图像,并尝试每次下载,这会影响我的应用性能。

我的问题是,有没有一种乐观的方法可以尽可能快地渲染图像而无需缓存它?


你是如何克服这个问题的? - red-devil
我已将预签名URL的过期时间设置为1年。这样,每当我访问它时,都会获得相同的图像URL,这解决了我的问题。现在,Fast Image显示缓存的图像数据。 - Inaccessible
1个回答

1
如果您有机会修改服务器端应用程序,可以创建授权标头而不是创建预签名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',
        }
    }
}

请看:

见:609974221


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接