我正在设计一个列表站点,每个用户都可以上传多个图像(<10),并将它们存储在服务器上的文件中。当UI向后端发送AJAX请求时,我不会在JSON响应中发送任何图像信息。相反,我是从用户ID本身派生图像路径。原因是,为了更快的数据库搜索,不希望在DB (MySQL)中存储图像信息/路径的开销。因此,我使用以下方法显示图像:
<img src="..." onError="defaultImage(this);" />
function defaultImage(source) {
source.src = 'blank.png';
source.onerror = null;
return false;
}
到目前一切尚好。但问题是当我看浏览器控制台时,它是打印的
获取url HTTP/1.1 404未找到5ms
我向每个AJAX请求发送了20个用户/清单,并且在滚动时清单也是自动加载的,所以整个控制台都会被这些错误淹没。现在我的问题是,是否可以有这些错误,还是应该将图像路径信息存储在DB中,只显示具有有效路径的图像。我唯一关心的是添加一个额外的列来存储图像信息可能会对SQL查询的性能产生影响,所以我尝试在主表(作为列表的索引)中存储尽可能少的列/信息,以使搜索尽可能快。或者,有什么方法可以对浏览器控制台隐藏这些错误吗?
发布于 2016-04-09 04:44:44
使用此字符串作为映像的源url,以避免对服务器的请求(以及404错误响应)
data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7
发布于 2016-04-09 05:53:35
与其默认设置src并使用OnError使用函数生成默认图像路径,不如为没有src属性的任何img标记添加一些默认的css。然后为实际无法加载的图像保留OnError。这最终将请求总数减少到最低限度。
img:not([src]) { // Default Image CSS }
https://stackoverflow.com/questions/36516835
复制