การกำหนดค่า

Matthias Rohmer
José Luis Zapata

คุณสามารถกำหนดค่าเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent เพื่อปรับแต่งวิธีที่เครื่องมือโต้ตอบกับเบราว์เซอร์ เครื่องมือที่เปิดใช้ และวิธีจัดการข้อมูล

กำหนดค่าเซิร์ฟเวอร์โดยส่งแฟล็กบรรทัดคำสั่งในอาร์เรย์ args ของไฟล์การกำหนดค่าไคลเอ็นต์ Model Context Protocol (MCP) ซึ่งโดยปกติแล้วจะเป็นไฟล์ config.json

เช่น หากต้องการเรียกใช้ Chrome ในโหมด Headless และใช้ช่องทาง Canary ให้ใช้การกำหนดค่าต่อไปนี้

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp@latest",
        "--headless",
        "--channel=canary"
      ]
    }
  }
}

สถานการณ์การกำหนดค่าที่พบบ่อย

สถานการณ์ต่อไปนี้อธิบายวิธีทั่วไปในการกำหนดค่าเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent

เรียกใช้ในโหมด Headless

หากต้องการเรียกใช้งานในเบื้องหลังโดยไม่มีหน้าต่างเบราว์เซอร์ที่มองเห็นได้ ให้เรียกใช้ Chrome ในโหมด Headless (ไม่มี UI) เพิ่มแฟล็ก --headless ลงในอาร์กิวเมนต์ของเซิร์ฟเวอร์

เชื่อมต่อกับเซสชันเบราว์เซอร์ที่มีอยู่

โดยค่าเริ่มต้น เครื่องมือสำหรับนักพัฒนาเว็บใน Chrome สำหรับ Agent จะเริ่มอินสแตนซ์ Chrome ใหม่ อย่างไรก็ตาม คุณ เชื่อมต่อตัวแทนกับเซสชันเบราว์เซอร์ที่มีอยู่ได้ ซึ่งจะมีประโยชน์หากตัวแทนต้องตรวจสอบปัญหาในเซสชันที่คุณเริ่มไว้แล้ว (เช่น หากคุณลงชื่อเข้าใช้แล้ว)

คุณเชื่อมต่อกับเซสชันที่มีอยู่ได้ 2 วิธี ดังนี้

การเชื่อมต่ออัตโนมัติ (Chrome 144 ขึ้นไป)

หากใช้แฟล็ก --autoConnect เซิร์ฟเวอร์ MCP จะเชื่อมต่อกับอินสแตนซ์ Chrome ที่ใช้งานอยู่โดยอัตโนมัติ

  1. ในเบราว์เซอร์ Chrome ที่ทำงานอยู่ ให้ไปที่ chrome://inspect/#remote-debugging แล้วเปิดใช้การแก้ไขข้อบกพร่องจากระยะไกล
  2. เพิ่ม --autoConnect ลงในการกำหนดค่า MCP โดยทำดังนี้ json "args": ["chrome-devtools-mcp@latest", "--autoConnect"]
  3. เมื่อ Agent พยายามเชื่อมต่อ Chrome จะแสดงกล่องโต้ตอบเพื่อขอสิทธิ์ คลิกอนุญาต

การเชื่อมต่อด้วยตนเอง

หากใช้ --autoConnect ไม่ได้ (เช่น ในสภาพแวดล้อมแซนด์บ็อกซ์) คุณสามารถเริ่ม Chrome ด้วยตนเองโดยใช้พอร์ตการแก้ไขข้อบกพร่องและเชื่อมต่อโดยใช้ --browser-url

  1. เริ่ม Chrome จากเทอร์มินัลโดยเปิดใช้การแก้ไขข้อบกพร่องระยะไกลและมี ไดเรกทอรีข้อมูลผู้ใช้ที่กำหนดเอง
    • macOS shell /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
    • Windows: shell start chrome --remote-debugging-port=9222 --user-data-dir=%TEMP%\chrome-profile-stable
    • Linux: shell google-chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stable
  2. กำหนดค่า Agent ให้เชื่อมต่อกับพอร์ตนี้ json "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222"]

อนุญาตให้เข้าถึงไฟล์นอกไดเรกทอรีชั่วคราว

เครื่องมือที่อ่านหรือเขียนไฟล์ (เช่น การบันทึกภาพหน้าจอ การติดตาม หรือการโหลดส่วนขยาย) จะเข้าถึงได้เฉพาะเส้นทางภายในรูทของพื้นที่ทำงานที่กำหนดค่าไว้เท่านั้น เซิร์ฟเวอร์จะใช้รูทที่ไคลเอ็นต์ MCP ของคุณระบุผ่านความสามารถของรูท MCP รวมถึงไดเรกทอรีที่คุณส่งด้วย --filesystemRoot (ชื่อแทน --workspace) หากไคลเอ็นต์ของคุณไม่ได้ระบุรูทและคุณไม่ได้ตั้งค่า --filesystemRoot การเข้าถึงไฟล์จะจำกัดอยู่ที่ไดเรกทอรีชั่วคราวของระบบปฏิบัติการ คำขอสำหรับเส้นทางอื่นๆ จะไม่สำเร็จและแสดงข้อผิดพลาด Access denied: ... is not within any of the configured workspace roots

หากต้องการอนุญาตให้เข้าถึงไดเรกทอรีโปรเจ็กต์ ให้เพิ่ม --filesystemRoot ลงในอาร์กิวเมนต์ของเซิร์ฟเวอร์ คุณสามารถใช้แฟล็กซ้ำเพื่ออนุญาตหลายไดเรกทอรีได้ ดังนี้

"args": ["chrome-devtools-mcp@latest", "--filesystemRoot=/path/to/project"]

ข้อมูลอ้างอิงตัวเลือกการกำหนดค่า

ส่วนต่อไปนี้จะแสดงรายการแฟล็กการกำหนดค่าที่ใช้ได้ ดูตัวเลือกและการอัปเดตล่าสุดได้ที่ที่เก็บ MCP GitHub ของเครื่องมือสำหรับนักพัฒนาเว็บใน Chrome

ตัวเลือกการเชื่อมต่อ

ใช้ตัวเลือกเหล่านี้เพื่อกำหนดค่าวิธีที่เซิร์ฟเวอร์เชื่อมต่อกับ Chrome

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--autoConnect หรือ --auto-connect บูลีน false เชื่อมต่อกับอินสแตนซ์ Chrome (144+) ที่ทำงานในเครื่องโดยอัตโนมัติ ต้องเปิดใช้การแก้ไขข้อบกพร่องจากระยะไกลโดยใช้ chrome://inspect/#remote-debugging
--browserUrl หรือ --browser-url
-u		 สตริง false เชื่อมต่อกับอินสแตนซ์ Chrome ที่กำลังทำงานและแก้ไขข้อบกพร่องได้ (เช่น http://127.0.0.1:9222)
--wsEndpoint หรือ --ws-endpoint
-w		 สตริง false ปลายทาง WebSocket เพื่อเชื่อมต่อกับอินสแตนซ์ Chrome ที่ทำงานอยู่ (เช่น ws://127.0.0.1:9222/devtools/browser/<id>) ทางเลือกแทน --browserUrl
--wsHeaders หรือ --ws-headers สตริง false ส่วนหัวที่กำหนดเองสำหรับการเชื่อมต่อ WebSocket ในรูปแบบ JSON (เช่น '{"Authorization":"Bearer token"}') ใช้ได้กับ --wsEndpoint เท่านั้น

ตัวเลือกการเปิดเบราว์เซอร์

ตัวเลือกเหล่านี้จะมีผลเมื่อเซิร์ฟเวอร์ MCP เริ่ม Chrome

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--headless บูลีน false เรียกใช้ Chrome ในโหมด Headless (ไม่มี UI)
--channel สตริง stable ระบุเวอร์ชัน Chrome ที่จะใช้ ตัวเลือก: canary, dev, beta และ stable
--executablePath หรือ --executable-path
-e		 สตริง false เส้นทางไปยังไฟล์ปฏิบัติการของ Chrome ที่กำหนดเอง
--userDataDir หรือ --user-data-dir สตริง ดูคำอธิบาย เส้นทางไปยังไดเรกทอรีข้อมูลผู้ใช้ ค่าเริ่มต้นคือ $HOME/.cache/chrome-devtools-mcp/chrome-profile$CHANNEL_SUFFIX_IF_NON_STABLE
--isolated บูลีน false สร้างไดเรกทอรีข้อมูลผู้ใช้ชั่วคราวที่จะล้างข้อมูลโดยอัตโนมัติเมื่อปิดเบราว์เซอร์
--viewport สตริง false ขนาดวิวพอร์ตเริ่มต้น (เช่น 1280x720) ในโหมด Headless ขนาดสูงสุดคือ 3840x2160
--proxyServer หรือ --proxy-server สตริง false การกำหนดค่าพร็อกซีเซิร์ฟเวอร์ที่ส่งไปยัง Chrome
--chromeArg หรือ --chrome-arg อาร์เรย์ false อาร์กิวเมนต์เพิ่มเติมที่จะส่งไปยัง Chrome
--ignoreDefaultChromeArg หรือ --ignore-default-chrome-arg อาร์เรย์ false ปิดใช้อาร์กิวเมนต์เริ่มต้นสำหรับ Chrome อย่างชัดเจน

ตัวเลือกความปลอดภัยและความเป็นส่วนตัว

ใช้ตัวเลือกเหล่านี้เพื่อจัดการการตั้งค่าความปลอดภัยและความเป็นส่วนตัวของข้อมูล

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--acceptInsecureCerts หรือ --accept-insecure-certs บูลีน false ไม่สนใจข้อผิดพลาดที่เกี่ยวข้องกับใบรับรองที่หมดอายุและใบรับรองที่ลงนามด้วยตนเอง โปรดใช้ด้วยความระมัดระวัง
--blockedUrlPattern หรือ --blocked-url-pattern อาร์เรย์ false จำกัดการเข้าถึงเครือข่ายโดยการบล็อกรูปแบบ URL ที่ระบุ (ใช้ URLPattern) บล็อกการนำทางและทรัพยากรย่อย
--allowedUrlPattern หรือ --allowed-url-pattern อาร์เรย์ false จำกัดการเข้าถึงเครือข่ายโดยอนุญาตเฉพาะรูปแบบ URL ที่ระบุ ต้องใช้ Chrome 149 ขึ้นไป
--redactNetworkHeaders หรือ --redact-network-headers บูลีน false ปกปิดส่วนหัวของเครือข่ายที่ละเอียดอ่อนก่อนที่จะส่งกลับไปยังไคลเอ็นต์
--usageStatistics หรือ --usage-statistics บูลีน true เปิดใช้การเก็บรวบรวมสถิติการใช้งานเพื่อปรับปรุงเครื่องมือ นอกจากนี้ยังปิดใช้ได้โดยใช้ตัวแปรสภาพแวดล้อม CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS หรือ CI
--performanceCrux หรือ --performance-crux บูลีน true ส่ง URL จากการติดตามประสิทธิภาพไปยัง Google CrUX API เพื่อดึงข้อมูลประสบการณ์ของผู้ใช้จริง
--javascriptEvaluation หรือ --javascript-evaluation บูลีน true ตั้งค่าเป็น false เพื่อปิดใช้การเรียกใช้ JavaScript เมื่อปิดใช้ เครื่องมือประเมินสคริปต์จะถูกปิดใช้ พารามิเตอร์ initScript ของ navigate_page จะปิดอยู่ และระบบจะไม่อนุญาตให้ไปยัง URL ของ javascript:, data: หรือ vbscript:
--filesystemRoot หรือ --filesystem-root
--workspace		 อาร์เรย์ ไดเรกทอรีชั่วคราวของระบบปฏิบัติการ ไดเรกทอรีที่เครื่องมือเข้าถึงไฟล์ได้รับอนุญาตให้ใช้ นอกเหนือจากรูทที่ไคลเอ็นต์ MCP มีให้ ระบุได้มากกว่า 1 ครั้ง โปรดดูหัวข้ออนุญาตให้เข้าถึงไฟล์นอกไดเรกทอรีชั่วคราว
--allowUnrestrictedPaths หรือ --allow-unrestricted-paths บูลีน false เลิกใช้งานแล้ว: โปรดใช้ --workspace=/ แทน ปิดใช้ข้อจำกัดเส้นทางที่มีผลเมื่อไคลเอ็นต์ MCP ไม่ได้ระบุรูท

หมวดหมู่ฟีเจอร์

คุณเปิดหรือปิดใช้กลุ่มเครื่องมือได้โดยใช้ฟีเจอร์นี้

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--categoryInput หรือ --category-input บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับการป้อนข้อมูล
--categoryNavigation หรือ --category-navigation บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับการนำทาง
--categoryEmulation หรือ --category-emulation บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับการจำลอง
--categoryNetwork หรือ --category-network บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับเครือข่าย
--categoryPerformance หรือ --category-performance บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับประสิทธิภาพ
--categoryDebugging หรือ --category-debugging บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับการแก้ไขข้อบกพร่อง
--categoryMemory หรือ --category-memory บูลีน true เปิดใช้เครื่องมือที่เกี่ยวข้องกับหน่วยความจำ
--categoryExtensions หรือ --category-extensions บูลีน false เปิดใช้เครื่องมือที่เกี่ยวข้องกับส่วนขยาย รองรับเฉพาะการเชื่อมต่อแบบไปป์เท่านั้น
--categoryPwa หรือ --category-pwa บูลีน false เปิดใช้เครื่องมือสำหรับการทำให้ Progressive Web App ทำงานอัตโนมัติ (ติดตั้ง เปิด ถอนการติดตั้ง และสถานะระบบปฏิบัติการ) โดยรองรับเฉพาะการเชื่อมต่อท่อ
--categoryExperimentalThirdParty หรือ --category-experimental-third-party บูลีน false เปิดใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ของบุคคลที่สามที่แสดงโดยหน้าที่ตรวจสอบ
--categoryExperimentalWebmcp หรือ --category-experimental-webmcp บูลีน false เปิดใช้การแก้ไขข้อบกพร่องของเครื่องมือ WebMCP ต้องใช้ Chrome 149 ขึ้นไปที่เปิดใช้ฟีเจอร์ WebMCP
--memoryDebugging หรือ --memory-debugging บูลีน false เปิดใช้เครื่องมือแก้ไขข้อบกพร่องเกี่ยวกับหน่วยความจำ

ตัวเลือกภาพหน้าจอ

ใช้ตัวเลือกเหล่านี้เพื่อปรับแต่งวิธีที่ Agent จับภาพหน้าจอ

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--screenshotFormat หรือ --screenshot-format สตริง false ลบล้างรูปแบบเอาต์พุตเริ่มต้น (png) ตัวเลือก: jpeg, png และ webp รูปแบบ jpeg และ webp มีขนาดเล็กกว่า ซึ่งช่วยลดขนาดบริบทในการสนทนากับ AI
--screenshotQuality หรือ --screenshot-quality ตัวเลข false ลบล้างคุณภาพการบีบอัด (0-100) สำหรับ jpeg และ webp
--screenshotMaxWidth หรือ --screenshot-max-width ตัวเลข false ความกว้างสูงสุดเป็นพิกเซล ระบบจะลดขนาดภาพหน้าจอที่ใหญ่ขึ้น
--screenshotMaxHeight หรือ --screenshot-max-height ตัวเลข false ความสูงสูงสุดเป็นพิกเซล ระบบจะลดขนาดภาพหน้าจอที่ใหญ่ขึ้น

ตัวเลือกทดลอง

ใช้ตัวเลือกเหล่านี้เพื่อเปิดใช้ฟีเจอร์เวอร์ชันทดลองที่อยู่ระหว่างการพัฒนา

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--experimentalDevtools หรือ --experimental-devtools บูลีน false เปิดใช้การทำงานอัตโนมัติเหนือเป้าหมายเครื่องมือสำหรับนักพัฒนาเว็บ
--experimentalVision หรือ --experimental-vision บูลีน false เปิดใช้เครื่องมือที่อิงตามพิกัด (เช่น click_at) โดยปกติแล้วจะต้องใช้โมเดลการใช้คอมพิวเตอร์ที่สามารถสร้างพิกัดที่แม่นยำได้โดยการดูภาพหน้าจอ
--experimentalStructuredContent หรือ --experimental-structured-content บูลีน false แสดงผลเนื้อหาที่มีการจัดรูปแบบโครงสร้าง
--experimentalIncludeAllPages หรือ --experimental-include-all-pages บูลีน false รวมหน้าทุกประเภท (เช่น หน้า WebView และหน้าเบื้องหลัง)
--experimentalScreencast หรือ --experimental-screencast บูลีน false แสดงเครื่องมือ Screencast (ต้องมี ffmpeg ใน PATH)
--experimentalFfmpegPath หรือ --experimental-ffmpeg-path สตริง false เส้นทางไปยังไฟล์ปฏิบัติการ ffmpeg
--experimentalScreencastFps หรือ --experimental-screencast-fps ตัวเลข false เฟรมต่อวินาทีสำหรับการบันทึก Screencast ค่าที่ต่ำลงจะช่วยลดการใช้หน่วยความจำในหน้าเว็บที่สร้างเฟรมได้เร็วกว่าที่ ffmpeg จะเข้ารหัสได้

ตัวเลือกอื่นๆ

ใช้ตัวเลือกเหล่านี้เพื่อกำหนดค่าการบันทึก การกำหนดเส้นทางหน้าเว็บ และซอร์สแมป หรือเพื่อเปิดใช้ชุดเครื่องมือที่เรียบง่าย

ธง ประเภท ค่าเริ่มต้น คำอธิบาย
--slim บูลีน false แสดงชุดเครื่องมือขนาดเล็ก 3 รายการ (การนำทาง การเรียกใช้สคริปต์ และภาพหน้าจอ) มีประโยชน์สำหรับงานพื้นฐานในเบราว์เซอร์
--pageIdRouting หรือ --page-id-routing บูลีน true ต้องใช้ pageId ในเครื่องมือระดับหน้าเว็บและกำหนดเส้นทางคำขอตามรหัสหน้าเว็บ ซึ่งมีประโยชน์สำหรับเซสชันของตัวแทนพร้อมกัน ใช้ --no-page-id-routing เพื่อปิดใช้
--sourceMaps หรือ --source-maps บูลีน true เปิดใช้การแมปแหล่งที่มาในเครื่องมือสำหรับนักพัฒนาเว็บ ใช้ --no-source-maps เพื่อปิดใช้
--logFile หรือ --log-file สตริง false เส้นทางไปยังไฟล์ที่จะเขียนบันทึกแก้ไขข้อบกพร่อง ตั้งค่าตัวแปรสภาพแวดล้อม NODE_DEBUG เป็น * เพื่อเปิดใช้บันทึกแบบละเอียด
--config สตริง false เส้นทางไปยังไฟล์การกำหนดค่า JSON

ตัวแปรสภาพแวดล้อม

นอกจากนี้ คุณยังใช้ตัวแปรสภาพแวดล้อมต่อไปนี้เพื่อกำหนดค่าเซิร์ฟเวอร์ได้ด้วย

  • CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS: หากตั้งค่าไว้ จะปิดใช้การรวบรวมสถิติการใช้งาน (เทียบเท่ากับ --no-usage-statistics)
  • CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS: หากตั้งค่าไว้ จะปิดใช้การตรวจสอบการอัปเดตเป็นระยะ
  • CI: หากตั้งค่าไว้ จะปิดใช้การเก็บรวบรวมสถิติการใช้งาน
  • NODE_DEBUG: ตั้งค่าเป็น * เพื่อเปิดใช้การบันทึกแก้ไขข้อบกพร่องแบบละเอียด (ใช้ร่วมกับ --logFile)