【问题标题】:Failed to load resource under ChromeChrome下加载资源失败
【发布时间】:2023-03-24 00:20:01
【问题描述】:

网页中有一堆图片。

其他浏览器可以正确下载它们,但 Chrome 不能。

在开发者控制台中,每张图片都会显示以下消息:

加载资源失败

如前所述,问题仅出现在 Chrome 中。

这是什么?

【问题讨论】:

  • 你能展示一些 HTML 吗?我们需要更多信息来帮助您解决问题。
  • 我为这个问题设置赏金的原因是它不时发生,并且与图像无关。我正在开发的网站在 Firefox 中运行良好,但在 chrome 中偶尔会失败。
  • 你是怎么解决这个问题的?
  • 检查谷歌浏览器扩展是否阻止请求。

标签: google-chrome cross-browser


【解决方案1】:

检查网络选项卡以查看 Chrome 是否未能下载任何资源文件。

【讨论】:

  • @Cartman 我为我的无知道歉。网络标签是什么意思?
  • 右击页面任意元素,选择“Inspect Element”会打开“Inspector”,Inspector有很多用于调试网页的选项卡,其中之一是“网络”选项卡,单击它,重新加载页面并检查任何网络错误。
  • @Cartman - 谢谢,我经常使用检查器,但找不到网络选项卡。我有元素、资源、脚本、时间线配置文件、存储、审计和控制台。我将四处搜索并尝试了解为什么我没有网络标签。
  • 我使用的是 Chromium 10.0.xx.xx,请确保您使用的是最近的快照。
  • @Cartman - 感谢铬提示 - 不知道这个项目。已安装版本 10.0.621.0 (70119)。重现了问题。网络选项卡中的消息是 16 个请求 0B 已传输。控制台说: GET localhost:51707/Content/Theme.css undefined (undefined) 甚至认为 20 秒之前它没有任何问题。
【解决方案2】:

万一它对任何人有帮助,我也遇到了同样的问题,发现它是由“Do Not Track Plus”Chrome 扩展程序(2.0.8 版)引起的。当我禁用该扩展程序时,图像加载没有错误。

【讨论】:

  • 感谢您的提示,我也遇到了同样的情况,并且拉扯我的头发是什么原因
  • 发生在我身上的事情,Chrome 没有加载 CSS 文件,因为 AdBlock 扩展,当我取消扩展时一切正常。
【解决方案3】:

我最近遇到了这个问题,发现它是由“Adblock”扩展引起的(我最好的猜测是因为我在文件名中有“banner”和“ad”这两个词)。

作为一个快速测试,看看这是否是您的问题,以隐身模式启动 Chrome 并禁用扩展程序 (ctrl+shift+ n)并查看您的页面现在是否正常工作。请注意,默认情况下,所有扩展程序都将在隐身模式下被禁用,除非您专门将它们设置为运行(通过chrome://extensions)。

【讨论】:

  • 是的,就是这样!我的名称中有“Popup”,这是导致问题的原因。
  • 谢谢。本地主机站点很好,一旦在实时网址上出现问题,我就在想..
  • 谢谢!我花了 30 多分钟试图弄清楚为什么我的代码不能在 Chrome 中运行。
  • 谢谢你救了我。我的网址中有“广告”字样。当我删除时,它起作用了。但是,有什么解决方法吗?我的意思是,我不想更改我的网址。
  • 我也有这个问题,但是我没有安装任何扩展并运行最新版本,怎么办?
【解决方案4】:

我收到此错误,仅在 Chrome(最新版本 24.0.1312.57 m)中,并且仅当图像大于 html img 时。我正在使用 php 脚本来输出这样的图像:

header('Content-Length: '.strlen($data));
header("Content-type: image/{$ext}");
echo base64_decode($data);

我解决了它在图像的长度上加 1:

header('Content-Length: '.strlen($data) + 1);
header("Content-type: image/{$ext}");
echo base64_decode($data);

Chrome 似乎不期望正确的字节数。

在 Chrome 和 IE 9 中测试成功。希望对您有所帮助。

【讨论】:

  • Same here.. 在我的情况下,在序列化对象而不是流或字节数组时添加 Content-Length 的是服务堆栈。
  • 突然,内容长度中的“+1”开始在我与 Tomcat 的通信中导致“Invalid Chunk Header”(我使用 php java bridge 将 apache 与 tomcat 通信)。我删除了这个“+1”,它在 Chrome 中可以正常工作。块的错误也消失了。奇怪的问题...我不知道发生了什么。
【解决方案5】:

卡比尔的解决方案是正确的。我的图片URL 是

/images/ads/homepage/small-banners01.png, 

这让 AdBlock 绊倒了。这对我来说不是跨域问题,它在 localhost 和 web 上都失败了。

我使用 Chrome 的网络选项卡进行调试,发现这些无法加载的特定图像的结果非常令人困惑。第一个请求将不返回任何响应(状态“(待处理)”)。后来,有第二个请求列出了原始 URL,然后“重定向”作为发起者。重定向请求标头都是针对这一相同的 base64 编码数据的短行,并且每个都没有返回响应,尽管状态是“成功”:

GET      data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg== HTTP/1.1

后来我注意到这些内联样式被添加到所有图像元素中:

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;

最后,我在控制台中没有收到任何“加载资源失败”的消息,而是这样的:

Port error: Could not establish connection. Receiving end does not exist.

如果您遇到任何这些事情,可能与 AdBlock 有关。将其关闭和/或重命名您的图像文件。

另外,由于 AdBlock 创建的内联 CSS,我的促销滑块的布局被扔掉了。虽然我能够在找到 Kabir 的解决方案之前使用 CSS 修复布局问题,但 CSS 有点不必要,并且影响了滑块处理多种尺寸图像的灵活性。

我想这个教训是:小心你给你的图片命名。这些图片没有恶意或烦人,因为它们以一种不引人注目的方式提醒访问者注意当前的促销和特价。

【讨论】:

  • adBlock 不应该存在的另一个原因。
  • adBlock 应该存在并且必须存在
【解决方案6】:

如果图像是通过 ASP Response.Write() 生成的,请确保不要调用 Response.Close();。 Chrome 不喜欢它。

【讨论】:

    【解决方案7】:

    Reenable (temporary) showModalDialog support in Chrome (for Windows) 37+ 中有一个临时解决方法。

    基本上,在注册表中创建一个新字符串

    HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Google\Chrome\EnableDeprecatedWebPlatformFeatures
    

    在 EnableDeprecatedWebPlatformFeatures 键下,创建一个名称为 1 且值为 ShowModalDialog_EffectiveUntil20150430 的字符串值。要验证该政策是否已启用,请访问chrome://policy URL。

    【讨论】:

      【解决方案8】:

      在 Chrome (Canary) 中,我未选中“Appspector”扩展程序。这清除了错误。

      【讨论】:

        【解决方案9】:

        事实:

        【讨论】:

          【解决方案10】:

          还有关闭网络资源缓存的选项。这可能最适合开发环境。

          1. 右键单击铬
          2. 转到“检查元素”
          3. 在顶部某处查找“网络”选项卡。点击它。
          4. 选中“禁用缓存”复选框。

          【讨论】:

          • 你能检查一次吗stackoverflow.com/questions/42693371/…@john ktejik
          • 这是为我做的。
          • 这为我解决了一个特定问题。它只为开发人员这样做。我如何获取这些知识并将其发布到生产中,以便用户不再遇到此问题。这是否只是意味着给我这个错误的 onclick 应该每次都清除缓存或类似的东西?
          • 你为我节省了很多时间。我试过你的 1,2 和 4 螺母而不是 4。现在我检查了“禁用缓存”复选框,有很多不同。
          • 感谢这为我解决了上传低于文件大小限制的音频文件失败的问题。在我禁用此缓存设置之前,每次上传都失败。
          【解决方案11】:

          我已将 Chrome 浏览器更新到最新版本,问题已得到解决。

          【讨论】:

            【解决方案12】:

            仅供参考 - 我也遇到了这个问题,结果我的 html 列出了 .jpg 文件,其中 .JPG 大写,但文件本身是小写的 .jpg。这在本地和使用 Codekit 渲染得很好,但是当它被推送到网络时它不会加载。只需将文件名更改为具有小写的 .jpg 扩展名以匹配 html 即可。

            【讨论】:

            • 对我来说这是个问题:)
            【解决方案13】:

            这是由于广告拦截器造成的。当项目文件名包含“ad”之类的词时,广告拦截器也会阻止这些文件加载​​。

            最好的解决方案是永远不要使用这些名称键保存任何文件。

            【讨论】:

              猜你喜欢
              • 2011-06-21
              • 2016-11-10
              • 2014-04-08
              • 1970-01-01
              • 1970-01-01
              • 2012-07-24
              • 2018-01-15
              • 2013-02-26
              • 2019-05-28
              相关资源
              最近更新 更多