Как исправить подмену картинки?

Question

[Savelac]

Пользователь загружает фотографию, мы выводим её на экран пользователя следующим кодом:

<Div style={{ textAlign: 'center' }}>
          <img src={ image } alt="remote file" />
</Div>

где image — ссылка на картинку пользователя

У некоторых пользователей битая ссылка (не могу по другому выразится), и в итоге на экран ничего не выводится или же выводится, но другое фото (можно сказать, что двойная картинка), как это можно исправить? То есть, сделать нормальный вывод картинки, которую мы видим при переходе по ссылке.

Answer 1

[hzzzzl]

обернуть img src в компонент, который будет следить за img.onerror
https://www.w3schools.com/jsref/event_onerror.asp
и, если ошибка, то пусть выводит какую нибудь стандартную картинку

Comments

[Savelac]

а есть ли вариант без поиска ошибка, а сразу вывода нормальной картинки пользователя (если у пользователя она "двойная")?

[hello_world3123123]

Ты вообще не туда копаешь(автор)) В задании же сказано, что сервер получает параметры запуска, "двойная" картинка тут не причем

[viiprogrammer]

человек хочет чтобы за него решили задание с Хакатона VK, причем элементарное....

[SmartProffesorCi]

Savelac, Нужно использовать пастеризацию данных, очень долгий процессор. Используйте тройную обертку картинка это поможет избежать пост помех, и вам выведется картинка в зеленом градиенте! так же почитайте вот тут инфу https://www.bbc.com/russian/vert-fut-50223070