跳到主要內容

API 呼叫器 — 瀏覽器端的 HTTPS 請求

填入網址、header 與認證資訊,直接從瀏覽器送出 HTTPS 請求,看排版過的 JSON 回應。全程在你的瀏覽器內完成,請求不經過我們的伺服器。

四個步驟送出第一個請求

  1. 選一個 HTTP method,把完整網址貼進網址列。
  2. 如果 API 需要認證,展開 Authentication,選 Bearer token、Basic 或 API key。
  3. 如果要送資料,展開 JSON Body,把 JSON 貼進去。
  4. 按送出。右邊會出現狀態碼、耗時、大小與排版好的回應。

想先看它動起來,按「載入範例請求」。它會替你填好一個對公開測試 API 的 GET, 直接按送出就有結果。

每個欄位要填什麼

  • Method 依你要做的事情選:讀資料用 GET,新增用 POST,修改用 PUT 或 PATCH,刪除用 DELETE。
  • 網址要完整,包含開頭的 https。網址後面已經帶問號參數也沒關係,可以整串貼進來。
  • Query Parameters 一列填一組。中文、空白與符號的編碼由工具處理,你照原樣打就好。
  • Header 一列填一組。左邊的勾選框可以暫時關掉某一列,比較兩種結果時不用刪掉再重打。
  • Authentication 選一種填完即可,工具會替你組成正確的 header 或接到網址後面。
  • JSON Body 只有 POST、PUT、PATCH 與 DELETE 用得到。貼上之後可以按格式化整理縮排。
  • Body 格式有錯會在按下送出時就告訴你,不會等到伺服器回一個看不懂的錯誤。

怎麼看回應

  • 最上面一列是狀態碼、耗時與大小。綠色的 2xx 代表成功,紅色的 4xx 與 5xx 代表失敗。
  • Body 分頁預設把 JSON 排版好,按「排版」可以切回伺服器原本吐出來的樣子。
  • 回應不是 JSON 也會完整顯示,只是多一行提醒。
  • 右上角的複製鈕會把目前看到的內容整份複製起來。
  • Headers 分頁列出這次回應的 header。

Headers 那一頁通常比伺服器實際送出的少。瀏覽器只會把對方明確公開的 header 交給網頁, 這是瀏覽器的安全限制,不是這次請求出了問題。

送不出去的時候先檢查這三件事

如果紅色訊息說瀏覽器無法完成請求,多半不是你填錯,而是下面三種情況之一。

  1. 網址不是 https 開頭。本站走 https,瀏覽器不允許從這裡呼叫 http 網址。
  2. 對方 API 不接受從別的網站呼叫,也就是下一段講的 CORS。
  3. 網址打錯、網域不存在,或是網路本身不通。

瀏覽器基於安全考量不會告訴網頁是哪一種,所以訊息只能列出可能性。 想知道確切原因,按 F12 打開開發者工具,看 Console 那一頁,瀏覽器會在那裡寫明。

哪些 API 打得通

請求是從你自己的瀏覽器發出去的,所以能不能通,取決於對方有沒有開放讓其他網站呼叫。 這個機制叫 CORS。

  • 開放資料、天氣、匯率這類公開 API 多半可以直接用。
  • 公司內部的 API 通常只允許自家前端的網域,會被擋下來。
  • 你自己維護的 API,在伺服器加上允許來源的設定就會通。
  • 帶 token 或自訂 header 時,瀏覽器會先送一個 OPTIONS 去問對方,對方沒回應就會失敗。
  • 本機服務不受這條限制影響,直接填 http://localhost:3000/… 就能測。

如果對方就是不開放,換哪一個瀏覽器端的工具結果都一樣,那時要用的是桌面版的 API 用戶端。

把常用的請求存起來

  • 按儲存圖示取個名字,下次從下拉選單就能叫回來,最多三十份。
  • Method、網址、query parameter、header 與 body 都會一起存。
  • Token、密碼與 API key 的值不會存,載入後補打一次就好。
  • 認證方式與欄位名稱會留著,所以其他設定不用重來一遍。
  • 存檔只留在這台電腦的這個瀏覽器裡,換裝置或清瀏覽資料就會不見。

密鑰不存進去,是為了不讓正式環境的 token 留在這台電腦上。 瀏覽器的儲存空間沒有到期時間,也不會自己清掉。

你的網址與 token 會不會經過我們

不會。請求是你的瀏覽器直接發給你填的那個網址,我們沒有後端,也不做任何轉送。 認證資訊只存在這個分頁的記憶體裡,關掉分頁就沒了,而且跨網域的請求一律不夾帶 cookie, 你在別的網站已經登入的身分不會被順手送出去。所以貼上內部網址與正式環境的 token 都是安全的。 細節見隱私權政策