logo标签列表

从GitHub的README.md文件转换Markdown为HTML

jqueryhtmlmarkdown
8

我的目标是：

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

仅使用客户端技术实现。

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

4个回答
6
  1. 从GitHub仓库中获取README.md文件的原始文件URL。
  2. 按照以下格式格式化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
  3. 现在使用jQuery的load方法使用这个新的URL，并从页面的#md-content id中提取内容。

上述步骤的完整演示在这里 - 非工作链接已被删除

5
我在代码编辑器中遇到了错误，显示为“Blocked content: We're sorry, but we've decided to prevent this content from rendering, Contact us if you think it's a mistake”，如果您认为这是一个错误，请与我们联系。请注意，此信息为英文原文的简单翻译，未进行任何解释或改动。 - eshimoniak
目前，http://markdown.io/ 域名正在出售！ - sanampakuwal
2

您应该查看：

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

它使用GitHub API调用以下内容来检索readme的内容：

GET /repos/:owner/:repo/readme

然后将base64加密的内容进行转换。

接下来，使用marked将markdown内容转换为html。

2
  1. 前往您的GitHub项目页面
  2. 点击您的 README.md 文件
  3. 现在点击 Raw 按钮

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

创建一个PHP文件 (或任何您正在使用的服务器端语言) 并将其命名为load.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格式。

谢谢，我知道jQuery的.load()方法，但我无法进行跨域请求以获取原始文件，因为这是受限制的。 - Pankaj Parashar
好的，我更新了我的答案，展示了如何绕过同源策略。如果这有帮助，请告诉我 :) - Mike McLin
首先，感谢Mike的回答。但我认为你没有正确阅读我的问题。我正在寻找一种“仅使用客户端技术”的方法。 - Pankaj Parashar
然而，我已经找到了一种方法来做这件事，并将很快在这里发布答案。 - Pankaj Parashar
-1

需要了解的是HTML确实可以在ReadMe.md文件中起作用。有了这个清晰的理解，我猜很多这样的问题会自动得到答案，例如如何在ReadMe文件中加粗字体，或者如何插入图像等等。还要注意，这很大程度上取决于您使用的应用程序/文本编辑器以及操作系统。

最近，我在Github的Readme.md文件中插入空行字符遇到了麻烦。我个人更喜欢在那里使用<br/>标签，并且我有一篇完整的文章描述了同样的问题：http://www.w3lc.com/2017/05/new-line-in-readme-file-github-fixing.html

我已经在Github存储库的一个提交中演示了这种变化，该提交在文章中有详细说明。这种理解对于处理问题以及找到许多其他用途的原因都是非常必要的！

此外，为了直接回答您的问题，您需要两个步骤： 1. 找到ReadMe.md文件在Raw版本中的Url。例如：https://raw.githubusercontent.com/Anwar-Faiz/forkrap/master/README.md 2. 现在，如果您要在服务器端使用php的file_gets_content等功能，可以加载该url。或者，如果您想使用jquery，可以使用Load()。
另外，请注意，如果您查看原始URL页面的源代码，只会看到纯文本。所以，您也不需要做太多文本解析的工作：）这是个好消息。
接下来，您可以使用非转义函数或像codebeautify这样的工具来取消转义那些可能影响您HTML外观和感觉的字符，如'<   "等。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接