如何直接从 Github (raw.github.com) 链接文件

Posted 2023-02-16

【中文标题】如何直接从 Github (raw.github.com) 链接文件

【英文标题】：How to link files directly from Github (raw.github.com)

【发布时间】：2012-02-05 10:38:33

【问题描述】：

我们可以直接从 Github 链接文件吗？

<link rel="stylesheet" href="https://raw.github.com/username/project/master/style.css"/>
<script src="https://raw.github.com/username/project/master/script.js"></script>

我知道 Google 代码允许这样做。这样我就不用担心更新本地文件了。

【问题讨论】：

您可以在此处查看具有良好答案的问题模拟：***.com/questions/17341122/…

Link and execute external javascript file hosted on GitHub的可能重复

【参考方案1】：

您可以直接链接到原始文件，但最好不要这样做，因为原始文件总是以纯文本/文本标题发送，并可能导致加载问题。

【讨论】：

阻止在 jsfiddle 中加载

【参考方案2】：

使用名称“gh-pages”为您的项目添加一个分支，然后您将（在分支后不久）能够使用直接 URL，例如 https://username.github.io/project/master/style.css（使用您的 URL，并假设为“style.css”是“项目”存储库根目录中“主”文件夹中的一个文件...并且您的 Github 帐户是“用户名”）。

【参考方案3】：

您可以使用外部服务器rawgithub.com。只需删除单词 'raw' 和 'github' https://raw.github.com/.. => https://rawgithub.com/ 之间的一个点并使用它。 More info you find in this question.

但是，根据 rawgithub 网站，它将在 2019 年 10 月结束时关闭。

【讨论】：

还有rawgit.com 用于提供原始文件。 RawGit 直接从 GitHub 提供带有适当 Content-Type 标头的原始文件。

我相信 rawgithub.coma 和 rawgit.com 是同一个服务，已经改名了:)

看来 rawgit 的 Chrome 有问题？ snag.gy/VknHNQ.jpg

截至 2018 年 10 月 8 日，RawGit（又名 rawgithub）处于日落阶段。看看别处。

【参考方案4】：

您需要执行以下步骤

从 github 获取文件的原始 url。类似于https://raw.githubusercontent.com/username/folder/example.css

访问http://rawgit.com/。将上面的 git url 粘贴到输入框中。它将生成两个 url，一个用于开发，另一个用于生产。

复制其中任何一个即可。

该文件将充当 CDN。您也可以使用 gist url。

【讨论】：

“RawGit 已达到使用寿命” - 2018 年 10 月 8 日

【参考方案5】：

在搜索了相同的功能后，我最终编写了自己的 php 脚本来充当代理。我一直遇到的麻烦是，即使您从Github 获取 RAW 版本/链接并在您自己的页面中链接到它，发送过来的标题是“text/plain”并且Chrome 没有执行我的JavaScript来自Github 的文件。由于可能存在明显的安全/篡改问​​题，我也不喜欢为使用第三方服务而发布的其他链接。

因此，使用此脚本，我可以传递来自 Github 的 RAW 链接，让脚本设置正确的标题，然后输出文件，就好像它来自我自己的服务器一样。此脚本还可以与安全应用程序一起使用，以引入非安全脚本，而不会引发“使用非安全链接”的 SSL 错误警告。

链接：

proxy.php

<?php
###################################################################################################################
# 
# This script can take two URL variables
# 
# "type"
#   OPTIONAL
#   STRING
#   Sets the type of file that is output
# 
# "link"
#   REQUIRED
#   STRING
#   The link to grab and output through this proxy script
# 
###################################################################################################################



# First we need to set the headers for the output file
# So check to see if the type is specified first and if so, then set according to what is being requested
if(isset($_GET['type']) && $_GET['type'] != '')
    switch($_GET['type'])
        case 'css':
            header('Content-Type: text/css');
            break;

        case 'js':
            header('Content-Type: text/javascript');
            break;

        case 'json':
            header('Content-Type: application/json');
            break;

        case 'rss':
            header('Content-Type: application/rss+xml; charset=ISO-8859-1');
            break;

        case 'xml':
            header('Content-Type: text/xml');
            break;

        default:
            header('Content-Type: text/plain');
            break;
    

# Otherwise, try and determine what file type should be output by the file extension from the link
else
    # See if we can find a file type in the link specified and set the headers accordingly

    # If css file extension is found, then set the headers to css format
    if(strstr($_GET['link'], '.css') != FALSE)
        header('Content-Type: text/css');

    # If javascript file extension is found, then set the headers to javascript format
    elseif(strstr($_GET['link'], '.js') != FALSE)
        header('Content-Type: text/javascript');

    # If json file extension is found, then set the headers to json format
    elseif(strstr($_GET['link'], '.json') != FALSE)
        header('Content-Type: application/json');

    # If rss file extension is found, then set the headers to rss format
    elseif(strstr($_GET['link'], '.rss') != FALSE)
        header('Content-Type: application/rss+xml; charset=ISO-8859-1');

    # If css xml extension is found, then set the headers to xml format
    elseif(strstr($_GET['link'], '.xml') != FALSE)
        header('Content-Type: text/xml');

    # If we still haven't found a suitable file extension, then just set the headers to plain text format
    else
        header('Content-Type: text/plain');
    


# Now get the contents of our page we're wanting
$contents = file_get_contents($_GET['link']);

# And finally, spit everything out
echo $contents;
?>

【讨论】：

LOL 有点骇人听闻，但它是我与 LOL 一起使用的解决方案......我想使用 cdn.jsdelivr.net 但是当你因为 CDN 缓存而进行大量更改时，它不适合开发。 .. 无论如何感谢您的快速脚本！

【参考方案6】：

RawGit 已经提到了很棒的服务，但我会再介绍一个：GitCDN.link

好处：

让您链接到特定的提交，以及自动获取最新的（又名主） 不会因高流量造成损坏； RawGit 要求它的 dev.rawgit.com 链接仅在开发过程中使用，因为 GitCDN 让您可以访问最新版本，而没有服务器爆炸的危险 让您可以选择自动缩小 html、CSS 和 JavaScript，或以书面形式提供 (https://min.gitcdn.link)。 添加压缩 (GZip) 添加所有正确的标头（内容类型、缓存控制、电子标签等）

完全披露，我是GitCDN.link的项目维护人员

【讨论】：

这正是我想要的——非常感谢您的服务。建议：不要要求原始 URL，您应该使其与常规 URL 一起使用（类似于 rawgit）。

@10basetom：很好的建议！我会把它添加到路线图中！

@ShaneGadsby 非常感谢。由于设置了正确的标题，它会强制下载我想要的文件。我没有其他机会强制下载，因为 GitHub 甚至在使用 HTML 锚元素时去掉了download 属性。

如果寻找 LAST COMMIT CDN 部署器，这是最好的选择。

我在尝试此操作时遇到内部服务器错误。

【参考方案7】：

GitHub 页面：https://yourusername.github.io/script.js GitHub repo 原始文件：https://github.com/yourusername/yourusername.github.io/blob/master/script.js

使用 GitHub 页面，不要使用原始文件。

原因： GitHub Pages 基于 CDN，原始文件不是。访问原始文件将直接命中 GitHub 服务器并增加服务器负载。

【讨论】：

“原始文件不是”有任何来源吗？

它并不完美，但它就像一个魅力！谢谢！

【参考方案8】：

如果您的网络服务器启用了 allow_url_include，则 GitHub 以原始纯文本/文本形式提供文件不是问题，因为您可以先将文件包含在 PHP 脚本中，然后将其标头修改为正确的 MIME 类型。

【参考方案9】：

使用 jsdelivr.com

直接从https://www.jsdelivr.com/?docs=gh复制：

加载任何 GitHub 版本、提交或分支 注意：我们建议将 npm 用于支持它的项目

https://cdn.jsdelivr.net/gh/user/repo@version/file

加载 jQuery v3.2.1

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/dist/jquery.min.js

使用版本范围而不是特定版本

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js

https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js

完全省略版本以获取最新版本

你不应该在生产中使用它

https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js

将“.min”添加到任何 JS/CSS 文件以获得缩小版本

如果不存在，我们将为您生成它

https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js

在末尾添加 / 以获得目录列表

https://cdn.jsdelivr.net/gh/jquery/jquery/

【参考方案10】：

对于那些在这篇文章中结束并只想从 GitHub 中的图像中获取原始链接的人：

如果是图片，您只需在文件链接末尾添加“?raw=true”即可。 例如。 原文链接： https://github.com/githubusername/repo_name/blob/master/20160309_212617-1.png

原始链接： https://github.com/githubusername/repo_name/blob/master/20160309_212617-1.png?raw=true

【讨论】：

虽然没有 Access-Control-Allow-Origin 标头....所以它不是很有用。