【问题标题】: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

【问题讨论】:

    标签: github markdown gist


    【解决方案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 呈现相同的要点:

    [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 通过以下方式查看:

    【讨论】:

    • 它不是很漂亮,但你总是可以在 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

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2020-09-12
        • 1970-01-01
        • 2023-04-03
        • 2015-05-26
        • 1970-01-01
        • 2021-10-26
        • 2019-10-09
        • 1970-01-01
        相关资源
        最近更新 更多