過去二十多年,瀏覽器一直都是 Web 開發流程中不可或缺的一環。
從撰寫 HTML、CSS,到 JavaScript 除錯,再到效能分析、Accessibility 檢查,每位開發者幾乎每天都會在瀏覽器與程式編輯器之間反覆切換。即使近年 AI 編碼工具快速崛起,例如 ChatGPT、Claude、Gemini 或 GitHub Copilot,大部分 AI 能夠取得的資訊仍然侷限於程式碼本身,而不是網站真正執行後的結果。
這也讓許多開發者遇到同樣的問題。
AI 可以寫程式,但不知道畫面到底有沒有跑版;AI 可以修改 CSS,卻不知道按鈕是否真的能點擊;AI 可以猜測錯誤原因,但看不到 Console、Network、DOM,也不知道 JavaScript 是否在瀏覽器中正常執行。
因此,真正限制 AI 編碼能力的,不是模型本身,而是它缺少與瀏覽器互動的能力。
近一年來,整個 AI 生態開始圍繞著 Model Context Protocol(MCP) 快速發展。越來越多工具開始透過 MCP,把 GitHub、Slack、Notion、Google Drive、資料庫、終端機甚至瀏覽器,直接變成 AI 可以操作的資源。
Apple 最新推出的 Safari MCP Server,正是這波趨勢的重要代表。
它讓 AI 編碼代理不再只是閱讀程式碼,而是能直接連接 Safari,觀察網站如何渲染、分析錯誤、擷取畫面、查看 Console Log、監控 Network Request,甚至模擬使用者與網頁互動,大幅縮短除錯與修正網站的流程。
這代表瀏覽器不再只是人類操作的工具,而開始成為 AI 的工作環境。

什麼是 Model Context Protocol(MCP)?
很多人第一次看到 MCP,都以為它是一種新的 API。
其實並不是。
MCP(Model Context Protocol)是一套讓大型語言模型能安全存取外部工具與服務的開放協定。
過去,如果希望 ChatGPT 幫忙查看 GitHub Issue、分析 Notion 文件,或讀取本地檔案,通常都必須先複製貼上內容,再交給 AI 分析。
MCP 改變了這種模式。
它建立了一套標準介面,讓 AI 可以直接呼叫外部工具,同時仍然保有權限控制、安全驗證與操作紀錄。
簡單來說:
AI 不再只能聊天,而是開始真正「使用工具」。
目前已經出現大量 MCP Server,例如:
- GitHub MCP
- Slack MCP
- Google Drive MCP
- PostgreSQL MCP
- Filesystem MCP
- Playwright MCP
- Chrome DevTools MCP
- Safari MCP
Safari 的加入,也代表瀏覽器正式成為 MCP 生態的重要一員。
為什麼 Apple 要推出 Safari MCP?
Apple 在 WebKit 官方部落格提到一個很真實的開發情境。
假設網站畫面出現問題。
過去流程通常是:
- 打開 Safari
- 開啟 Developer Tools
- 查看 Console
- 查看 Styles
- 修改程式
- Refresh
- 再檢查一次
- 發現沒修好
- 重複以上流程
如果同時還要請 AI 協助,就變成:
瀏覽器 → ChatGPT → VS Code → 瀏覽器 → ChatGPT → 瀏覽器……
整個開發流程會不停來回切換。
Apple 希望透過 Safari MCP Server,把這些流程整合成一次完成。
AI 可以直接看到:
- 網頁內容
- DOM 結構
- Console Log
- Network Request
- CSS
- JavaScript 執行結果
- Screenshot
- 使用者互動
甚至直接操作頁面。
這就是 Safari MCP 最大的意義。
它不是新增 AI,而是讓 AI 真正理解網站。
Safari MCP Server 可以做到哪些事情?
目前 Safari Technology Preview 247 已經內建 Safari MCP Server。
只要 AI Agent 完成設定,就能直接連接 Safari Browser。
目前官方提供近二十種工具,包括:
- 取得目前頁面內容
- 擷取 Screenshot
- 查看 Console Messages
- 分析 Network Requests
- 模擬 Click
- 模擬 Keyboard
- Scroll
- Hover
- Type
- 查看 DOM
- 驗證 Accessibility
- 分析 Safari 相容性
- 驗證 UI State
- 協助 Debug JavaScript
其中最重要的是:
AI 不再需要靠截圖猜測。
它能直接取得真正的瀏覽器資訊。
Safari MCP 如何改變整個 Web 開發流程?
傳統網站除錯屬於「人找問題」。
Safari MCP 開始變成「AI 找問題」。
例如:
網站跑版。
以前:
開發者需要自己找是哪個 CSS。
現在:
AI 可以直接:
- 擷取畫面
- 找出元素
- 查看 CSS
- 比對 DOM
- 查看 Console
- 分析 Network
- 提出修正建議
- 修改程式碼
- 再重新驗證
整個流程變成閉環。
這就是 Agentic Coding 最大的改變。
AI 不只是回答問題,而是真的完成工作。