介紹

比如這裡是 Scrapy 的倉庫：，用 GitHub 開啟是這樣的：

看程式碼的時候我們可能需要一個個點進去，速度慢而且感覺不太方便。

為此大家可能安裝了一些 Chrome 外掛，比如比較火的是 Octotree，安裝之後效果是這樣的：

安裝這個外掛之後，在網頁左側會出現一個檔案樹方便我們快速定位檔案。然鵝，個人感覺總不是真正想要的那種味道。

現在好了。

這時候，我們只需要在網址 github 後面加上 1s，變成：1s.com/scrapy/scrapy

沒錯，就是這麼簡單好記。

訪問之後，就可以看到這樣的頁面：

是的沒錯，這就在瀏覽器中開啟了一個線上版的 VS Code，並開啟了 Scrapy 的原始碼，看程式碼就非常方便了。

無需克隆，無需任何配置，開啟飛速，程式碼高亮！

一些快捷鍵也是和 VS Code 一樣的，比如 Cmd/Ctrl + P，就可以快速找到一個檔案：

Cmd/Ctrl + F 搜尋：

不過我試了一下全域性搜尋貌似只能限制在一個檔案內，不知道是哪裡設定的問題。

有的朋友可能會問，程式碼能修改嗎？

答案是不能，程式碼都是以只讀模式開啟的，也就是我們只能看，沒法改。不過這也合情合理，畢竟任意 Repo 都能開啟，改了又存到哪裡呢？

原理

另外有的朋友可能好奇這個的實現原理是怎樣的，我扒了一下原始碼，看到作者是這麼介紹的：

“
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，地址為：.com/cdr/code-server，這個就是一個 Online 版的 VS Code。

那作者基於這個做了什麼事呢？

他基於 VS Code 提供的 FileSystemProvider API 對接了 GitHub 的 REST API 實現了這些功能。其中前者是 VS Code 提供的，可以提供檔案讀寫操作，當然讀寫線上檔案也是沒問題的了；而後者是 GitHub 提供的，透過 REST API 可以獲取 Repo 的資料夾或者某個檔案。

如此，GitHub1s 就誕生了。

知道了原理之後，我們也可以自己把 GitHub1s 程式碼下載下來，改寫一下，擴充套件一些功能：比如解除只讀限制，儲存的時候直接儲存到自己的 Repo 等。

具體的修改和開發流程可以參見：.com/conwnet/github1s/blob/master/docs/guide.md#development

訪問頻率限制

另外作者也提到了一點：

“
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 次，所以用著用著就容易超限制了，可能就打不開檔案了。

這裡的頻率限制我解讀下，有朋友可能好奇，因為這個網站是 github1s.com 來 serve 的，所以請求是不是都是 github1s.com 這個伺服器發出來的呢？所以不同的人其實都是用的一個 IP？

其實不是的，我觀察了一下網路請求，是當前網頁直接請求了 GitHub 的 API 實現的，所以 IP 就是我們自己客戶端的真實 IP，網路請求如下所示：