从 GitHub README.md 文件 Markdown 到 HTML答案

【问题标题】：Markdown to HTML from GitHub README.md file从 GitHub README.md 文件 Markdown 到 HTML
【发布时间】：2013-03-27 07:57:00
【问题描述】：

我的目标是，

1) 从我的 GitHub 存储库中的 README.md 文件中读取 Markdown 源代码。
2) 将 Markdown 转换为 HTML 代码。
3) 将输出 HTML 应用到 <div>。

仅使用客户端技术。

我知道如何使用 jQuery 将 Markdown 代码转换为 HTML，但不知道如何从 GitHub 存储库的 README.md 文件中动态读取 MD 源代码。

【问题讨论】：

标签： jquery html markdown

【解决方案1】：

转到您的 GitHub 项目页面
点击您的README.md 文件
现在点击Raw按钮

原始文件是您要加载的实际 URL。

创建一个名为 load.php 的 PHP（或您使用的任何服务器端语言）文件，专门用于加载远程文件（如您的 RAW 文件）。 PHP 脚本将接受$_GET['url'] 变量。将变量传递给file_get_contents()，并输出结果。 请注意，下面的代码是一个非常简单的例子。

echo file_get_contents($_GET['url']);

现在，只需使用 jQuery 中的 load 函数从 PHP 文件中引入数据内容。您的 URL 的格式可能与此类似...

.load("load.php?url=https://raw.github.com/user/project/master/README.md")

最后，使用您已经描述的任何方式转换为 Markdown。

PHP file_get_contents(): http://php.net/manual/en/function.file-get-contents.php
jQuery load(): http://api.jquery.com/load/
有关绕过同源策略的更多信息：http://www.mikazo.com/2010/09/how-to-getting-around-ajax-same-origin.html

【讨论】：

谢谢，我知道 jQuery .load() 方法，但我无法发出跨域请求来获取原始文件，因为这是受限制的。
好的，我更新了我的答案，展示了如何绕过同源策略。让我知道这是否有帮助:)
首先，感谢 Mike 的回答。但我认为您没有正确阅读我的问题。我正在寻找一种“仅使用客户端技术”的方法。
不过，我已经找到了一种方法，很快就会把答案放在这里。

【解决方案2】：

从 GitHub 存储库获取 README.md 文件的原始文件 url。
按以下格式格式化网址， http://markdown.io/<url_readme_file>。假设我的 readme.md 文件的 url 是http://raw.github.com/pankajparashar/nerdy-css/master/README.md。因此，新的 url 变为 http://markdown.io/http://raw.github.com/pankajparashar/nerdy-css/master/README.md
现在使用 jQuery 的加载方法使用这个新的 url 并从页面的#md-content id 中提取内容。

此处提供上述步骤的完整演示 - 已删除无效链接

【讨论】：

仅供参考，我在小提琴上收到一个错误，上面写着Blocked content: We're sorry, but we've decided to prevent this content from rendering, Contact us if you think it's a mistake

【解决方案3】：

你应该检查一下：

https://github.com/zmckinnon/jquery-gh-readme

它使用 GitHub API 通过此调用检索自述文件的内容：

GET /repos/:owner/:repo/readme

然后它转换base64加密的内容。

然后它使用标记将markdown内容转换为html。

【讨论】：

【解决方案4】：

值得注意的是，HTML 确实可以在 ReadMe.md 文件中使用。有了这种清晰的理解，我想很多这样的问题都会被自动回答，比如 - 如何在自述文件中制作粗体字体，或者如何插入图像等。另外请注意，这在很大程度上取决于您使用的应用程序/文本编辑器和在操作系统上也很多。最近在 Github 的 Readme.md 文件中插入空行字符时遇到问题。

我个人更喜欢那里的标签，并且我有一篇完整的帖子描述了相同的内容：http://www.w3lc.com/2017/05/new-line-in-readme-file-github-fixing.html

我已经在博文中解释的 Github 存储库中演示了 git 提交中的更改。这种理解对于处理这个问题以及找到许多其他用途来说明您可能需要这样做的原因非常必要！

此外，要直接回答您的问题，您需要两个步骤： 1. 在 Raw 版本中找到 ReadMe.md 文件的 Url。例如看一个：https://raw.githubusercontent.com/Anwar-Faiz/forkrap/master/README.md 2.现在如果你想使用服务器端的php的使用file_gets_content等，你可以加载url。或者，如果你想使用 jquery，你可以使用 Load()。

请注意，如果您查看原始 URL 页面的源代码，您只会看到纯文本。所以，你也不需要做太多的文本解析工作了 :) 这是个好消息。

接下来，您可以使用 unescape 函数或工具（如 codebeautify）取消转义字符，这些字符可能会随着您的 HTML 的外观而改变，例如“

【讨论】：