是否可以在要点的降价文件中建立与图像的相对链接？

Posted 2023-03-28

【中文标题】是否可以在要点的降价文件中建立与图像的相对链接？

【英文标题】：Is it possible to make relative link to image in a markdown file in a gist?

【发布时间】：2013-03-23 18:07:22

【问题描述】：

我有一个包含降价文件和图像的要点。

有没有办法给这张图片做一个相对链接？ 类似![My image](image.png) 而不是![My image](https://gist.github.com/user/605560c2961cb3025038/raw/b75d2...6e8/img.png)

这里是an example

【参考方案1】：

到目前为止，相对图像链接在存储库和 wiki 中都对我有用。我正在使用这样的语法：

![Kiku](images/Kiku.jpg)

这是一个例子：

https://github.com/mark-anders/relative-image-url

【讨论】：

谢谢！尝试使用本地图像时我很沮丧，但这很有效！

至少对于 Github，我刚刚发现你的文件名中不能有空格，或者 GitHub 无法识别本地图像（虽然我不确定添加引号会解决这个问题）

这可能适用于常规 Github 存储库，但不适用于 Gists (gist.github.com)。

如果您尝试链接的图像的相对路径上有特殊字符，请确保它是 url 编码的。

@XiaoyongZhu，如果您的文件名中有空格，请按照@felixperreault 的建议对文件名进行url-encode - 即用%20 替换空格。

【参考方案2】：

根据http://blog.rodneyrehm.de/archives/35-Including-Data-From-Github.html，使用中的问题 https://gist.github.com/user/605560c2961cb3025038/raw/b75d2...6e8/img.png

是 b75d2...6e8 部分因文件而异（快速实验确认它是 git blob id）。但是，您可以删除该部分，从而生成指向最新版本的 URL：

https://gist.github.com/user/605560c2961cb3025038/raw/img.png

或者举个例子：

https://gist.githubusercontent.com/cben/46d9536baacb7c5d196c/raw/dodgetocat_v2.png

相对路径？

这也可以作为相对路径 raw/dodgetocat_v2.png! 但是（截至 2017 年底）github 可以从 2 个 URL 呈现相同的要点：

从https://gist.github.com/cben/46d9536baacb7c5d196c/（带有斜杠）查看时，附加了相对路径，解析为https://gist.github.com/cben/46d9536baacb7c5d196c/raw/dodgetocat_v2.png — 有效:-)

从https://gist.github.com/cben/46d9536baacb7c5d196c（无尾随斜杠）查看时，相对路径会替换 URL 的最后一部分，解析为 https://gist.github.com/cben/raw/dodgetocat_v2.png — 损坏 :-(

[2017 年 12 月更新。以前的原始文件问题作为 Content-Type: application/octet-stream 和将图像的 src 属性重写为 camo.githubusercontent.com 不再发生，至少对于来自相同 gist 的图像不会发生。]

唉，我们不能只使用第一个 URL 并相信它始终有效。

目前，表单既不返回重定向，也不提供 rel=canonical 链接。我不会打赌 Github 永远不会改变这一点！ 所有内部 gist 链接（例如，来自用户页面 https://gist.github.com/cben/）省略尾部斜杠 :-( Google 搜索结果中的 Gists 省略了尾部斜杠 :-(

（您可以使用相对路径 46d9536baacb7c5d196c/raw/dodgetocat_v2.png，它只能在没有尾部斜杠的情况下工作，但这也是有问题的想法，而且不太值得 - 并不比完整 URL 更灵活。）

使用代理？

两者都可以通过修复 Content-Type 的代理来解决，例如Rawgit 或 Bl.ocks.org（不是 Github，不要滥用它们）。不幸的是，Rawgit 不呈现 Markdown，仅按原样提供文件，而 Bl.ocks.org 确实呈现 Markdown，但 URL 结构使得相对链接不起作用。这意味着您可以在 Markdown 中引用完整的外部 URL，或者在 HTML 中引用相对的 :-(

请参阅 https://gist.github.com/cben/46d9536baacb7c5d196c/ 分叉你的要点， 及其 index.html 通过以下方式查看：

http://rawgit.com/cben/46d9536baacb7c5d196c/raw/index.html http://rawgit.com/cben/46d9536baacb7c5d196c/raw/ http://bl.ocks.org/cben/raw/46d9536baacb7c5d196c http://bl.ocks.org/cben/46d9536baacb7c5d196c

【讨论】：

它不是很漂亮，但你总是可以在 markdown 文档的顶部放置一个硬编码的链接，告诉读者在带有斜杠的链接处查看文档，例如 [view the doc here for working images](https://gist.github.com/user/605560c2961cb3025038/)。

【参考方案3】：

是的，相对链接对我有用。我正在使用 pancake.io 来托管我的页面。 http://pancake.io/2c8aa8/topics/cpp/cpp.md

该页面上的图像位于cpp 文件夹中。

第一张图片使用的markdown代码是

![C++ Var Types](basic_cpp_var_types.png)

第二张图片使用的markdown代码（其实是html）是

<div style='float: center'>
  <img style='width: 600px' src="prefixpostfixincrement.png"></img>
</div>

注意：我错过了要点部分。如果 gist 不支持 markdown 相对图像路径语法，请尝试 html 方式。

【讨论】：

HTML 方式不起作用。与其说是 Markdown，不如说是 Gist 的问题

【参考方案4】：

刚刚测试... 我无法在 github wiki 上使用相对 url。

我必须将图像添加到 wiki 存储库，然后浏览存储库并让 github 显示给我（这样我就可以获取 url）。然后在降价中使用完整的 url。但幸运的是，网址很容易预测：https://github.com/*username*/*reponame*/wiki/*imagename.png*

我将此问题提交给 github 支持。

【参考方案5】：

不，markdown 中图像的相对 URL 不起作用，因此您必须坚持使用长的静态 URL：

https://gist.github.com/mattborn/c346c8689a5eaf86e823

但是，某些文件的相对 URL 可以工作：

http://bl.ocks.org/mattborn/c346c8689a5eaf86e823