如何用替代图像替换HTML图像？

我正在构建一个web应用程序，它是静态船舶信息的目录，我从不同的来源收集数据。其中之一是，我也使用这个源来检索船的图像。检索图像非常简单，如下所示：

<img src="https://photos.marinetraffic.com/ais/showphoto.aspx?mmsi=273914200>

将加载此图像的：

<img src="https://photos.marinetraffic.com/ais/showphoto.aspx?mmsi=273914200">

注意mmsiurl中的一部分这是船舶可能具有的标识符，问题是船舶可能具有多个标识符，因此还有imo编号、呼号和eni编号。在上，可以在imo或mmsi号码上搜索船舶以检索图像

所以这个

返回相同的图像：

对于这艘特殊的飞船，我的数据库中有两个标识符，但也有一些飞船只有一个标识符。例如，我有一艘只有imo编号7361518的船，当我想要检索图像时，我尝试这样做：

但这会返回404错误

目前我通过以下方式解决了它：

<img width="100%" height="100%" src={`https://photos.marinetraffic.com/ais/showphoto.aspx?mmsi={id}`}/>
<img width="100%" height="100%" src=`https://photos.marinetraffic.com/ais/showphoto.aspx?imo={id}`}/>
   



因此，我将两个图像标记放置在彼此上方，将ship id值传递给url，id可以是imo或mmsi号码，这会导致上一个图像无法加载

这会导致如下结果：

注意底部的未加载图标，我正在尝试一些解决方案，但不知道如何进行：

检查HTTP状态代码，然后显示图像
当船舶未装载带有imo回退功能的彩信时，显示备选图像
移除图像未加载图标，使图像在图像无结果时不可见
因此，在对案例研究、真实场景和图像问题进行了完整的解释之后，有人知道我的任何解决方案的实现，或者对这个问题有其他解决方案吗？
我刚刚用
imo
和
mmsi
链接测试了您的id。Imo正常工作，您确定要获取正确的图像吗？使用的示例：是，两者都起作用，当然不起作用。当您尝试通过彩信进行搜索并传递imo号码时。我的问题更多的是关于如何使用javascript作为最佳解决方案的后备方案。对于你的问题，这里有一个很好的答案：我也在使用React，所以我会研究它