使用Sink建立自己的短網址系統

      原本我使用 PicSee 搭配我的個人網域,做了一個短網址供自己使用。但因為 PicSee 免費版本的自訂網域是 HTTP,沒有 HTTPS,在近期的瀏覽器安全政策更新後都會出現警告,所以就找到這個開源專案 SinkSink GitHub),那接下來就開始教大家如何設定在自訂網域上~


事前準備

  • 一個自己的網域
  • 將網域託管給 Cloudflare
    備註:Cloudflare 免費方案的 Workers有限制每月要求上限,但個人使用幾乎不會碰到上限的,不用擔心
  • 一個 GitHub 帳號

開始安裝

  1. 先打開並登入 GitHub

  2. Sink Repository 進行 Fork



    點擊 fork 之後,就會進入建立分支頁面。


    依照畫面上進行設定,repository name 可以自行改動,但我習慣用預設的,fork 完成之後,我們就要去 Cloudflare 裡面設定啦。

  3. 登入 Cloudflare 並進入儲存空間和資料庫



    Cloudflare KV 是 Cloudflare 所提供的一項服務,讓使用者可以透過這個 Key-Value 存儲系統(一個 key 對應一個 value)來儲存和讀取資料。

  4. 建立一個 KV 空間並複製 ID


    先建立一個 KV 空間,名字可以取自己方便記憶的就行,像我取的名字就是 Sink。建立好之後點擊三個點,將 KV ID 複製起來,等等會使用到。

  5. 修改 GitHub Repository


    先找到剛剛 fork 後的 repository 中的 wrangler.jsonc,我們要來修改它,讓它可以去存取我們建立的 KV 空間。


    找到
    "kv_namespaces": [
        {
          "binding": "KV",
          "id": "" // IMPORTANT: Change this to your KV namespace ID
        }
    並把 id 修改成你的 KV 空間 ID,就完成設定啦!

  6. 部署到 Cloudflare

    再來我們就要進入最重要的部分,我們要將做好的專案部署到 Cloudflare 上,讓它可以正常運作!



    先進入 Cloudflare Workers,點擊匯入存放庫並連結 GitHub 帳號,再找出前面建立的儲存庫。


    並依照圖片上填入相關的設定,並按下儲存並部署。下一頁會顯示正在部署,但我們可以先離開畫面或者按取消部署也行,因為我們還要去設定其它部分。

  7. 建立API權杖並設定

    我們先從網頁右上角人頭點進去,選擇設定檔 - API權杖 - 建立 Token。


    選擇「查看分析與紀錄」範本建立,裡面的設定都不用更改,直接進行建立。


    建立好之後,請把 Token 複製並保存好,因為這只會出現這一次,之後就無法再重新顯示了。建議可以先開個 Word 文件先暫時存一下,因為我們還要去複製其它東西過去 Workers 設定。
     

    我們要複製的第二樣資訊是這個!複製完自己的帳戶 ID 就可以回去設定了。


    我們回到 Workers 並點擊我們的專案,進入後找到設定 - 組建 - 變數與秘密,我們要在這邊添加 Sink 的一些設定值,根據官方文件,我們可以添加的設定很多,底下將會列出必要的與經常使用的設定。
    NUXT_SITE_TOKEN:此 Token 授予您存取儀表板的權限,必須至少包含 8 個字元,禁止純數字。
    NUXT_CF_ACCOUNT_ID:填入 Cloudflare 帳戶 ID。
    NUXT_CF_API_TOKEN:填入剛剛製作的 API Token。
    NUXT_HOME_URL:(可選)Sink 預設首頁為官方介紹頁面,可以將其替換為您自己的網站。
    NUXT_CASE_SENSITIVE:(可選)設定 URL 是否要區分大小寫。
    在此附上官方設定介紹供大家參考。

  8. 設定繫結並重新部署


    再來就進入繫結頁面,添加 Workers AI、Analytics Engine、KV 命名空間這三樣,名稱和值依照圖片上的設定就可以。

    設定完之後就進入部署頁面,讓他重新部署囉~部署時間需要一下子,給它一點時間跑完。

  9. Sink 使用

    再來就介紹一下 Sink 的介面與使用方法。


    我們要進入儀表板,需要在網址列輸入
    https://你的網域/dashboard
    我們可以在設定中看到 Cloudflare 預設配發給你的子網域,進入網頁後輸入在上面設定的 Token 就可以登入進行設定了。


    在這邊介紹一下創建連結所需的資訊:
    Url:所要導向的網址
    Slug:短網址的後綴(如設定abc123,短網址就會是https://你的網域/abc123)
    Comment:(可選)自己在後臺方便管理與察看的註解
    Expiration:(可選)選擇短網址到期日。

  10. 加入自訂網域

    我們自架短網址系統最希望的就是有屬於自己的網域短網址,所以這時候我們就要來建立自訂網域並綁定到這個服務上!


    進到設定 - 網域與路由 - 右上角新增 - 自訂網域,就可以在此填入你所想要的子網域,通常會是 link.你的網域,但大家還是可以自己選擇。


設定完這步後,整個 Sink 的短網址系統就架設完成啦,開始享受屬於自己的短網址吧~

留言

熱門文章