React Native — лучший способ очень быстро загрузить изображение без его кэширования

Я использую FastImage для кэширования изображения, и оно очень быстро загружает изображение после кэширования данных, поскольку ожидал. Но мой сервер каждый раз генерирует новый uri (предварительно подписанный URL-адрес s3) для одного и того же изображения.

Таким образом, FastImage рассматривает его как новое изображение и пытается загрузить каждый раз, что влияет на производительность моего приложения.

Мой вопрос: есть ли какой-нибудь оптимистичный способ рендеринга изображений как можно быстрее без их кэширования?


react-native image amazon-s3 pre-signed-url image-caching
person Inaccessible    schedule 04.09.2018    source источник
comment
Как вы это преодолели?   -  person red-devil    schedule 26.11.2019
comment
Я установил срок действия предварительно подписанного URL-адреса на 1 год. Итак, я получаю тот же URL-адрес изображения всякий раз, когда я обращаюсь к нему, что решило мою проблему. Теперь Fast Image показывает кэшированные данные изображения.   -  person Inaccessible    schedule 24.01.2020

Ответы (1)


arrow_upward
1
arrow_downward

Если у вас есть возможность изменить приложение на стороне сервера, вы можете создать заголовки авторизации вместо создания предварительно подписанных 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

person Johnson    schedule 06.04.2020