01 / 這個缺口
agent 看不見自己的成果，只能盲改
ChatGPT 內建的雲端瀏覽器運行在與 agent 隔離的環境中。RenderSight 透過 MCP 補上這個缺口，讓視覺回饋成為工作的一部分。
-
01
補上環境隔離的缺口
agent 在自己的環境中產出的 HTML、CSS 與 JavaScript，終於能被載入、呈現與檢視。
-
02
在頁面所在的地方渲染
Cloudflare Browser Run 在雲端渲染內容，等待 webfont 就緒後再擷取 PNG。
-
03
讓迭代循環保持流暢
截圖、檢視、修正，再次截圖。替 landing page、電子郵件樣板與報告版面做視覺品質檢查。
-
04
分享成果，但不必永久保存
將結果存入 R2，傳送一個有效 24 小時的暫存下載連結。
02 / 運作方式
一個 agent 真正用得上的渲染循環。
Worker 由 Cloudflare Access Managed OAuth 保護。成功呼叫後，可回傳 image content、暫存 URL，或兩者同時回傳。
-
01
送出草稿
ChatGPT 透過 Managed OAuth 連接 MCP server，並將 HTML 傳給
render。 -
02
執行瀏覽器
Browser Run 在雲端渲染頁面，等待內容與 webfont 後擷取 PNG。
-
03
暫存結果
需要 URL 時，R2 會儲存 PNG，並回傳有效 24 小時的 presigned 下載連結。
-
04
檢視並迭代
agent 讀取圖片內容或 URL，將看見的結果轉成下一個有用的修改。
render({ html, output: "both" })
截圖 + metadata
03 / Tool reference
一個 tool，剛好需要的細節。
將 HTML 渲染為 PNG 圖片，以內嵌圖片、暫存下載 URL 或兩者回傳。
render({ html, output: "both" })
Parameters
html必填- 要渲染的 HTML。
width、height- viewport 尺寸。預設為
800 x 800，每個值限制在 1-4096 px。 omitBackground- 使用透明背景，而不是預設的不透明背景。
waitForFonts- 截圖前等待
document.fonts.ready與兩次 repaint，預設為true。 waitForSelector-
可選的 readiness 條件：CSS selector 搭配
attached、visible或hidden狀態，時間上限 30 秒。 waitForTimeout- readiness 後的額外固定等待，範圍為 0-10000 ms，預設為
0。 output- 選擇
inline、url或both，預設為both。 filename- 下載時顯示的檔名；沒有
.png副檔名時會自動補上。
等待條件逾時會回傳 tool error，不會擷取未完成的頁面。為避免超過 Workers 的 128 MB isolate memory limit，inline 編碼上限為 8 MiB。
Output modes
選擇截圖回傳的方式。
-
inline回傳 MCP image content，不會寫入 R2。
-
url將結果串流至 R2，只回傳文字 presigned URL 與 resource metadata。
-
both同時回傳兩者；必要時會自動降級為
inline或url。
每個成功結果都會包含 output、filename、mimeType、width、height
與 byteLength。暫存 URL 有效 24 小時。