Javascript 如何检测图像加载失败的原因？

我在一个页面上有一个img元素，它的src在页面上被动态设置，为不同的情况加载不同的图像，这些图像由客户端提供

我可以检测图像何时无法加载，并通过报告来处理。在加载失败时，我还设置了一个占位符图像

这很有效。然而，仅仅知道图像加载失败的时间是不够的。我需要找出它发生的原因。该映像托管在我们的服务器上，因此404不太可能，但并非不可能。我无法访问客户的设备，也无法重现他们描述的问题

我试着四处看看，但我找不到我要找的东西

我猜可能是404，CSP配置问题，或者是网络连接问题，等等。我只是想知道它是什么，这样我才能更好地理解它

---

编辑：忘记说代码在Cordova应用程序中，因此没有日志可供检查。

从客户端，您可以尝试通过发出ajax调用然后解析响应来访问图像。使用jQuery可以轻松完成

var call = $.ajax( "image.img" )
  .fail(function( call, textStatus ) {
    alert( "Request failed: " + textStatus );
  });

从服务器端，您可以检查服务器日志，搜索正确的请求并查看发生了什么。如果请求从未到达服务器，则可能是网络/路由/防火墙问题

---

但是，执行此操作的步骤在很大程度上取决于后端使用的内容。

因此，可以在映像失败后对其执行Ajax调用，并以这种方式获取状态代码。也许您应该检查服务器日志，了解映像未正确加载/交付的原因？当然，您可以在客户端执行AJAX请求并检查返回的HTTP状态代码，但它只会告诉您错误的类型，而不是错误失败的原因。src是动态设置的-根据设置方式，您很可能会得到404，因为未正确设置。忘了说代码在Cordova应用程序中，所以没有日志可供检查。至于src设置不正确，它已经运行了好几个月了，但这个客户端的设备只是不想加载他们的图像。忘记说代码在Cordova应用程序中，所以没有要检查的日志。ajax调用是一个聪明的想法，我一定会实现它。然而，这些可能不是影响这一点的唯一问题，对吗？前端实际上是通过浏览器模拟为本机的事实并不意味着后端不记录请求。除非您使用的是来自您不拥有或无法控制的服务器的图像。或者您是想说您将图像本地存储在设备上？因为这可能是一个你在哪里做以及如何做的问题。你是对的，我忘记了服务器访问/错误日志。我看不到任何可能意味着找不到资源或请求被拒绝的内容。我接受这个答案，因为它提供了一个相当聪明的解决方案。希望它能帮助你找到问题的根源。当我调试像这样的问题时，我的逻辑总是有一个清晰的事件线，当你做某事时，这些事件会在内部发生。在哪里会发生什么，然后逐个测试，直到缩小范围。然后专注于这一部分。。