2

事情是这样的：我正在处理的项目中有一个小型板载服务器，运行速度有点慢，所以我想将包含的小型网站的图像移动到外部资源，如外部 Web 服务器；

问题是，我不确定当我访问它时我是否会一直连接到互联网，也许我只会在局域网中。

所以我的问题是：如何为网页上的图像指定主要（外部）和次要/备份（本地）源？所以如果用户连接到互联网，这会减轻小服务器的负载吗？

提前谢谢各位！

编辑：我在这里找到了答案： jQuery/JavaScript to replace broken images

- 这是错误，带有直接重新分配图像的内联javascript函数！（很棒的东西）

干杯，来自互联网的好人，帮助有需要的人！^^

4

4 回答 4

3

加载失败时可以调用 onerror：

<img onerror="runSomeScriptThatReplacesThisImage()" ...

或者：

<img onerror="this.src='yourOtherImage.jpg" ...

只是要小心，因为如果onerror也失败了，你会得到一个循环。所以一定要避免这种情况。

于 2013-04-19T08:42:34.260 回答
1

这可以在不使用任何 JavaScript 的情况下完成。

该object元素可用于显示图像。如果引用的图像（在data属性中）无法加载，object将使用 的后备内容。现在，如果你包括另一个object，这个将被尝试。最后一个应该包括替代的备用内容，例如描述图像的文本（类似于alt属性 on img）。

<object type="image/png" data="http://foo.example.com/external-image.png">
  <object type="image/png" data="/local-image.png">
    <!-- alternative text for the image (if even the local one cannot be loaded; for accessibility; etc.) -->
  </object>
</object>
于 2013-04-19T09:29:20.790 回答
1

您的图像目录将有两个 URL，例如

  1. //www.remote.com/images/
  2. 〜/图像/

当会话开始时，您可以向远程服务器发出请求，如果请求超时或者您没有收到 200 响应，您可以使用本地 URL 库。我建议将其存储在会话变量中以便于访问。

于 2013-04-19T08:41:54.920 回答
0

我认为您最好的选择是使用 AJAX 检索图像。

然后，如果快速服务器出现故障，您可以回退到从慢速服务器中检索它们。

于 2013-04-19T08:41:32.723 回答