查看大图时，同一个图片为什么要请求两次

[jeff-wangzhen]

感觉可以优化一下。 应该不是 navbar，我设为 false依然请求 2 次。

还有，左右切换图片时都会重新请求，这个应该没必要吧。。

[fengyuanchen]

你是不是把控制台/网络/禁用缓存选项给钩上了？

[fengyuanchen]

以目前的架构，即使 navbar 设为 false，也只是将其隐藏，里面的图片列表虽然不可见，但是依然还是存在的。在不禁用缓存的情况下，问题不大；一旦禁用缓存，确实会造成多一次的图片加载，确实还有待优化。

[jeff-wangzhen]

以目前的架构，即使 navbar 设为 false，也只是将其隐藏，里面的图片列表虽然不可见，但是依然还是存在的。在不禁用缓存的情况下，问题不大；一旦禁用缓存，确实会造成多一次的图片加载，确实还有待优化。

的确是的，取消勾选就不会发送请求。那么也就是说，对正常用户而言，是不存在这种问题的？那就好。。

[vinstics]

请求两次还有一些问题：

1. 第一张图片加载时，viewer的加载效果不会出来
2. 第二张图片加载失败时，无法进行提示或其他操作

[fengyuanchen]

@vinstics 同一张图片？第一次加载失败？第二次加载失败？

[vinstics]

@vinstics 同一张图片？第一次加载失败？第二次加载失败？

emm，一些解决方案，有更好的方案请指教：

需求：

1. 用来做文件预览，希望图片只加载一次；
2. 希望网络质量不佳时，图片加载过程使用viewerjs的加载中效果；
3. 加载失败时需要有错误处理

问题：

1. viewerjs需要传入一个现成的img元素，内部好像会再创建一个img元素，禁用缓存时可以看到同一张图片加载了两次；
2. 传入viewerjs的img元素加载时，不会触发viewerjs的加载中效果，只有viewerjs内部的img元素加载时，加载效果才会出来；
3. viewerjs内部创建的img元素加载失败时，外部无法捕获这个错误。

方案：

1. src用一张1x1的占位base64图片，作为element传给viewerjs，在url函数中指向真正的图片地址；（第一张图片瞬间加载，第二张图片加载时会有加载效果，实现了需求1、2）；
2. viewerjs内部的img（即真正要预览的图片）加载失败的错误无法捕获，强行通过viewerjs实例去找这个元素也没成功。好在如果这张图片加载失败，viewerjs会一直显示加载中效果，最后显示一个裂开的图片，勉强也算一种加载失败的提示吧。就这样了。

[fengyuanchen]

@vinstics

• 问题1：可能需要重构 Viewer.js
• 问题2：没有加载效果，可能是因为图片已经加载完成，并在浏览器中缓存，再次加载时是瞬间完成，加载效果就肉眼看不见了。
• 问题3：内部加载失败时确实需要跑出错误。

[wll8]

我这边使用缓存的情况下，不会出现请求两次。