除了Gists，我能在我的网页上嵌入来自GitHub的源文件吗？

Question

背景

您可以在GitHub上创建一个Gist并将其嵌入到您的网页中：嵌入Gists。

这是一个随机选择的Gist示例：tap.groovy。

问题

是否也可以将来自GitHub的其他代码文件嵌入其中，例如这个随机选择的C#文件ICommand.cs，它不是一个 Gist？

- Lernkurve

Answer 1

您可以尝试使用https://emgithub.com，它可以完全满足您的需求。

要在问题中嵌入示例文件ICommand.cs，只需在地址栏中的“github.com”之前添加“em”，然后按Enter键即可。

然后，您可以获得如下的脚本标签：

<script src="https://emgithub.com/embed-v2.js?target=https%3A%2F%2Fgithub.com%2Fdotnet%2Fcorefx%2Fblob%2Fmaster%2Fsrc%2FSystem.ObjectModel%2Fsrc%2FSystem%2FWindows%2FInput%2FICommand.cs&style=default&type=code&showBorder=on&showLineNumbers=on&showFileMeta=on&showCopy=on"></script>

请注意，如果您在StackOverflow中仅单击运行代码段，则右上角的复制按钮可能无法正常工作。在SO之外运行它将正常工作。

与其他执行类似工作的网站不同，EmGithub.com是托管在Github Pages上的静态网站。获取目标文件和突出显示是在您的浏览器上完成的。

---

声明：我是它的开发者 :)

- yusanshi

Answer 2

您可以使用https://gist-it.appspot.com/：

<script src="http://gist-it.appspot.com/https://github.com/dotnet/corefx/blob/master/src/System.ObjectModel/src/System/Windows/Input/ICommand.cs"></script>

- m.s.

---

这看起来像是HTML。你能详细说明一下这会如何导致将Gist添加到C#代码中吗？也就是说，一旦我复制了那个<script>，我应该把它粘贴到哪里？ - philologon

你可以将它粘贴到iframe的头部或正文中。 - Sentient

不再了 :( https://github.com/robertkrimen/gist-it/issues/20 - Limon Monte

Answer 3

有一种通过URL将一个网站的内容嵌入到另一个网站的标准，称为oEmbed。不幸的是，GitHub不是oEmbed提供者，也就是说它不支持其URL的oEmbed。

我找到了一个代理服务，GitHub的Oembed代理, 可以为GitHub的代码URL添加oEmbed支持。你可以将GitHub URL作为参数传递给代理的URL，并在另一个支持嵌入oEmbed链接的网站上粘贴生成的URL。

另一个障碍是并不是每个网站都支持嵌入oEmbed URL。根据代理的文档，notion是支持它们的一个网站。我进行了一些研究，看起来应该可以向wordpress或jekyll添加oEmbed支持。

这个答案提供了一个非常有限的解决方案，因为oEmbed的采用率很低。尽管如此，我认为它值得传播。

- Jakub Kukul

Answer 4

另一个可能的服务是https://github.com/finom/github-embed。它似乎已经有两年没有维护了，但gist-it甚至已经有6年没有维护了。我都没有尝试过。

- sschuberth

Answer 5

你可以使用 gistYard。

<iframe src="https://gistyard.piyushdev.xyz/emd.html?lang=&from=0&to=&code=https://raw.githubusercontent.com/dotnet/corefx/master/src/System.ObjectModel/src/System/Windows/Input/ICommand.cs&edit=true&dm=off" width="100%" height="330" frameborder="0"></iframe>

它提供了许多功能，如更改主题，直接从原始代码中剪切代码，编辑模式，自定义样式等。

- PIYUSH PUNIYA

Answer 6

一个人可以直接将文件fetch到自己的网站上嵌入使用。

fetch("https://raw.githubusercontent.com/Ayanmullick/test/master/AutomationAcc/test1.ps1")
      .then(response => response.text())
      .then(data => document.getElementById('code').textContent = data)

<pre id="code"></pre>

- Ayan Mullick