VSCode打开GitHub上的任意一个Repo

收藏于同事分享：
大家介绍一个非常实用的工具，有了它，我们可以在几秒之内用 VS Code 打开 GitHub 上的任意一个 Repo，无需 Clone，速度飞快！用法也十分简单而且好记，下面给大家介绍下。

介绍

比如这里是 vue 的仓库：https://github.com/vuejs/docs-next-zh-cn，用 GitHub 打开是这样的：

看代码的时候我们可能需要一个个点进去，速度慢而且感觉不太方便。为此大家可能安装了一些 Chrome 插件，比如比较火的是Octotree，安装之后效果是这样的：

安装这个插件之后，在网页左侧会出现一个文件树方便我们快速定位文件。然鹅，个人感觉总不是真正想要的那种味道。
现在好了。这时候，我们只需要在网址 github 后面加上 1s，变成：https://github1s.com/vuejs/docs-next-zh-cn
没错，就是这么简单好记。访问之后，就可以看到这样的页面：

是的没错，这就在浏览器中打开了一个在线版的 VS Code，并打开了 Vue 的源代码，看代码就非常方便了。**无需克隆，无需任何配置，打开飞速，代码高亮！**一些快捷键也是和 VS Code 一样的，比如 Cmd/Ctrl + P，就可以快速找到一个文件：Cmd/Ctrl + F 搜索。代码能修改吗？答案是不能，代码都是以只读模式打开的，也就是我们只能看，没法改。不过这也合情合理，毕竟任意 Repo 都能打开，改了又存到哪里呢？

原理

另外有的朋友可能好奇这个的实现原理是怎样的，https://github.com/conwnet/github1s 去项目源码查看，可以看到作者是这么介绍的：
“Github1s is based on VS Code 1.52.1 now. VS Code can be built for a browser version officially. I also used the code and got inspired by Code Server.Thanks to the very powerful and flexible extensibility of VS Code, we can easily implement a VS Code extension that provides the custom File IO ability using FileSystemProvider API. There is an official demo named vscode-web-playground which shows how it is used.On the other hand, GitHub provides the powerful REST API that can be used for a variety of tasks which includes reading directories and files for sure.According to the above, obviously, the core concept of GitHub1s is to implement a VS Code Extension (includes FileSystemProvider) using GitHub REST API.We may switch to the GitHub GraphQL API for more friendly user experience in the future, thanks to @xcv58 and @kanhegaonkarsaurabh. See details at Issue 12.GitHub1s is a purely static web app (because it really doesn’t need a backend service, does it?). So we just deploy it on GitHub Pages now (the gh-pages branch of this repository), and it is free. The service of GitHub1s could be reliable (GitHub is very reliable) because nobody needs to pay the web hosting bills.”
总的来说，GitHub1s 这个仓库是基于 VS Code 构建的，灵感来源于 Code Server 这个 Repo，地址为：https://github.com/cdr/code-server，这个就是一个 Online 版的 VS Code。那作者基于这个做了什么事呢？他基于 VS Code 提供的 FileSystemProvider API 对接了 GitHub 的 REST API 实现了这些功能。其中前者是 VS Code 提供的；而后者是 GitHub 提供的，通过 REST API 可以获取 Repo 的文件夹或者某个文件。如此，GitHub1s 就诞生了。

访问频率限制

另外作者也提到了一点：
“For unauthenticated requests, the rate limit allows for up to 60 requests per hour. Unauthenticated requests are associated with the originating IP address, and not the user making requests.”
对于未授权的请求，API 的请求频率是有限制的，每个 IP 每个小时访问限制是 60 次，所以用着用着就容易超限制了，可能就打不开文件了。
关于这个问题，作者也给出了解答：
“For API requests using Basic Authentication or OAuth, you can make up to 5,000 requests per hour.”
这里说如果登录了，每小时就可以提高到 5000 次请求了。怎么设置呢？可以在 github1s.com 打开侧栏的 OAuth 设置，如图所示：

然后点击 Generate New OAuth Token，跳到自己的 GitHub Setting 页面，生成一个 Token 就好了，好了之后贴回来就 OK 了，这样频率限制就解除了，爽歪歪。

或者下载一个Github1s小插件