为什么使用github页面时无法显示图片？答案

【问题标题】：Why can't I display images when using github pages?为什么使用github页面时无法显示图片？
【发布时间】：2019-10-12 01:38:52
【问题描述】：

我在这里有一个测试站点，它只有一个无法加载的图像标签：

https://jamie-siminoff-007.github.io/

索引文件是：

<!DOCTYPE html>
<html>
  <body>
    <img src="_heart.png" alt="foo">
  </body>
</html>

这是一个 git 页面，所以它完全托管在 GitHub 上，并且 repo 在这里：

https://github.com/jamie-siminoff-007/jamie-siminoff-007.github.io

我错过了什么？

仅供参考，我可以输入我称之为原始链接的内容，如下所示的 src 并且它可以工作：

https://raw.githubusercontent.com/jamie-siminoff-007/jamie-siminoff-6.github.io/master/_heart.png

但这似乎不是正确的方法。当然，当 GitHub 制作页面时，它们可以让您使用相对路径。

研究

Images in github pages and relative links ...不相关

https://pages.github.com ...没有什么相关的

https://help.github.com/en/categories/github-pages-basics ...图像上没有任何内容

更多信息。

我发现 google dev tools 有一个简洁的功能，您可以更改图像的 src 属性，它会实时更新页面。

这就是我发现原始链接有效的方式。

更多详情。

我开始认为我的 GitHub 页面需要进一步配置，但我不确定。

我检查了我的配置，我被配置为在 master 分支上发布，这很好。这是我唯一的分支。

【问题讨论】：

这很奇怪......你试过联系 github 支持吗？
Names starting with underscore shows errors Page doesnot exists for gh-pages branch的可能重复
在页面存储库的根目录中创建一个名为 .nojekyll 的空文件。没有它，以下划线开头的文件/目录将被忽略。或者只是重命名所有文件，不带下划线。
我猜underscores 需要火箭科学学位才能使用。
我不确定。当我需要发布由 Sphinx 生成的Cheetah docs 时，我了解了.nojekyll，所以我根本没有选择重命名其内部文件和目录的选择。我通过搜索找到了解决方案。

标签： html git url github github-pages

【解决方案1】：

您的 src 似乎出现 404 错误（未找到文件）。对我来说，这个 src 有效：“https://raw.githubusercontent.com/jamie-siminoff-007/jamie-siminoff-007.github.io/master/_heart.png”

<html class="gr__jamie-siminoff-007_github_io"><head></head><body data-gr-c-s-loaded="true">
    <img src="https://raw.githubusercontent.com/jamie-siminoff-007/jamie-siminoff-007.github.io/master/_heart.png" alt="foo">
  


</body></html>

【讨论】：

对...我记下了这在我的问题中有效。
你到底在哪里找？
在您的索引文件中，您只需使用路径 _.heart.png 这与“jamie-siminoff-007.github.io/_heart.png”相同但您的图像位于此处“raw.githubusercontent.com/jamie-siminoff-007/…”所以您必须使用它来源。
在“普通”服务器上使用如此凌乱的 URL 很麻烦……您只需为 src 执行 _heart.png……我认为这是一个配置问题。
如果您在本地或使用服务器托管此内容，您可以通过这种方式执行此操作，但如果我没有误会，这是在 GitHub 的服务器上，因此您必须使用图像的链接在他们的服务器上，因为图像和索引文件不在同一个文件夹中