聲明：該文章來自（藍(lán)點(diǎn)網(wǎng)）版權(quán)由原作者所有，K2OS渲染引擎提供網(wǎng)頁加速服務(wù)。

谷歌 Chrome 開發(fā)團(tuán)隊(duì)日前面向開發(fā)者們推出 Chrome DevTools 模型上下文協(xié)議 (MCP) 服務(wù)器的公開預(yù)覽版，將 Chrome DevTools 的強(qiáng)大功能開放給人工智能編碼代理 / 智能體。

目前 AI 編碼代理存在的關(guān)鍵問題是模型并不清楚自己生成的代碼在瀏覽器中運(yùn)行時(shí)究竟在做什么，也就是 AI 代理實(shí)際上是在蒙著眼睛編程，因此難以確保正確性。

Chrome DevTools MCP 服務(wù)器將徹底改變這種情況：現(xiàn)在 AI 代理能夠直接在 Chrome 瀏覽器中調(diào)試網(wǎng)頁，并受益于開發(fā)者工具的調(diào)試功能和性能洞察等功能，這可以顯著提高 AI 代理識(shí)別和修復(fù)問題的準(zhǔn)確性并最終提高整體代碼的可用性和準(zhǔn)確性。

什么是 MCP 協(xié)議：

模型上下文協(xié)議可以用于將 AI 模型連接到外部工具和數(shù)據(jù)源，Chrome DevTools MCP 服務(wù)器可以為 AI 代理添加調(diào)試功能。

例如 Chrome DevTools MCP 服務(wù)器提供名為 performace_start_trace 的工具，當(dāng)需要探查網(wǎng)頁性能時(shí)就可以打開網(wǎng)站并使用開發(fā)者工具記錄性能軌跡，AI 代理可以分析性能軌跡提出潛在的改進(jìn)建議。

使用 MCP 服務(wù)器后，Chrome DevTools MCP 服務(wù)器可以開發(fā)者使用的各類 AI 編碼工具帶來新的調(diào)試功能，讓開發(fā)者們可以更好地構(gòu)建網(wǎng)站。

有哪些使用場景：

實(shí)施驗(yàn)證代碼更改：使用 AI 編碼工具生成修復(fù)程序，然后使用 Chrome DevTools MCP 自動(dòng)驗(yàn)證解決方案是否按預(yù)期運(yùn)行。

診斷網(wǎng)絡(luò)和控制臺(tái)錯(cuò)誤：授權(quán) AI 代理分析網(wǎng)絡(luò)請求并發(fā)現(xiàn) CORS 跨站問題或檢查控制臺(tái)日志了解功能沒有按照預(yù)期運(yùn)行的原因。

模擬用戶行為：AI 代理還可以借助 MCP 服務(wù)器模擬用戶行為例如導(dǎo)航、填寫表格、點(diǎn)擊按鈕來重現(xiàn)錯(cuò)誤或測試復(fù)雜的用戶流程。

調(diào)試實(shí)時(shí)樣式和布局問題：讓 AI 代理連接到實(shí)時(shí)頁面檢查 DOM 和 CSS，并根據(jù)來自瀏覽器的實(shí)時(shí)數(shù)據(jù)獲取修復(fù)復(fù)雜問題的建議。

自動(dòng)化績效審計(jì)：開發(fā)者還可以要求 AI 代理運(yùn)行性能跟蹤、分析結(jié)果并調(diào)查特定的性能問題，例如解決 LCP 過高等問題。

有興趣的開發(fā)者可以訪問 Chrome DevTools MCP 服務(wù)器文檔查看具體使用方法：https://github.com/ChromeDevTools/chrome-devtools-mcp/?tab=readme-ov-file#chrome-devtools-mcp

[超站]友情鏈接：

四季很好，只要有你，文娛排行榜：https://www.yaopaiming.com/
關(guān)注數(shù)據(jù)與安全，洞悉企業(yè)級(jí)服務(wù)市場：https://www.ijiandao.com/