เปิดใช้ความช่วยเหลือจาก AI ในเครื่องมือสำหรับนักพัฒนาเว็บ

Matthias Rohmer

ใช้แผงความช่วยเหลือจาก AI เพื่อดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีที่เว็บไซต์ของคุณทำงานด้วยความช่วยเหลือจาก AI

ภาพรวม

แผงความช่วยเหลือจาก AI ช่วยให้คุณแชทกับ Gemini ได้โดยตรงใน DevTools การสนทนาที่คุณเริ่มจากแผงนี้จะมีบริบทเกี่ยวกับ รายละเอียดทางเทคนิคของหน้าที่คุณกำลังตรวจสอบโดยอัตโนมัติ

เมื่อใช้แผงความช่วยเหลือจาก AI คุณสามารถใช้พรอมต์ตัวอย่างที่ให้ไว้หรือคำถามของคุณเองเป็นจุดเริ่มต้นของการสนทนา และถามคำถามติดตามผลต่อไปได้มากเท่าที่ต้องการเพื่อทำงานให้เสร็จ

แชทในแผงความช่วยเหลือจาก AI จะช่วยให้คุณเข้าใจข้อมูลต่อไปนี้ได้มากขึ้น

  • การจัดรูปแบบ: ถามเกี่ยวกับองค์ประกอบจากDOM Tree และดูว่าเหตุใดองค์ประกอบจึงแสดงในลักษณะหนึ่งๆ มีการโต้ตอบกันอย่างไร และแก้ปัญหาการจัดรูปแบบด้วยวิธีแก้ไขที่ให้ไว้
  • คำขอเครือข่าย ถามเกี่ยวกับคำขอที่ส่งในบริบทของหน้าเว็บ ทำความเข้าใจว่าคำขอมาจากที่ใด ใช้เวลานานเท่าใด หรือเหตุใดจึงล้มเหลว
  • แหล่งที่มา ถามคำถามเกี่ยวกับไฟล์ที่หน้าเว็บโหลด ดูข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาและวัตถุประสงค์
  • ประสิทธิภาพ ถามเกี่ยวกับกิจกรรมจากโปรไฟล์ประสิทธิภาพที่บันทึกไว้ในแผงประสิทธิภาพและรับคำแนะนำในการปรับปรุง

ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีใช้ข้อมูลของคุณและตัวเลือกที่คุณมีในฐานะผู้ใช้ระดับองค์กรได้ในคู่มือการใช้ข้อมูลและการควบคุมระดับองค์กร

ข้อกำหนด

หากต้องการใช้แผงความช่วยเหลือจาก AI ให้ตรวจสอบว่าคุณมีคุณสมบัติดังนี้

  • มีอายุอย่างน้อย 18 ปีและอาศัยอยู่ในประเทศที่รองรับ
  • ใช้ Chrome เวอร์ชันล่าสุด
  • ลงชื่อเข้าใช้ Chrome ด้วยบัญชี Google
  • เลือกอังกฤษ (สหรัฐอเมริกา) ใน การตั้งค่า > ค่ากำหนด > ลักษณะที่ปรากฏ > ภาษาใน DevTools
  • เปิดใช้ การตั้งค่า > นวัตกรรม AI ในเครื่องมือสำหรับนักพัฒนาเว็บ

ปัญหาที่ทราบ

ความช่วยเหลือจาก AI ใช้โมเดลภาษาขนาดใหญ่ของ Google เพื่อสร้างคำอธิบาย โมเดลภาษาขนาดใหญ่หรือ LLM เป็นขอบเขตการวิจัยใหม่ที่ยังมีการศึกษาอย่างต่อเนื่อง คำตอบที่ LLM สร้างขึ้นบางครั้งอาจน่าสงสัยหรือ ผิดพลาดอย่างเห็นได้ชัด คุณควรทราบว่าผลลัพธ์อาจไม่ถูกต้องหรือทำให้เข้าใจผิด ดังนั้นโปรดตรวจสอบอีกครั้งเสมอ

คำอธิบายผิด

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

ตัวอย่างคำตอบหรือคำอธิบายที่ไม่ถูกต้องมีดังนี้

  • ฟีเจอร์ พร็อพเพอร์ตี้ หรือไวยากรณ์ CSS ที่ไม่ถูกต้อง
  • องค์ประกอบหรือชื่อคลาสที่ไม่มีอยู่

คุณช่วยเราได้โดยการส่งความคิดเห็นเมื่อพบคำอธิบายที่ไม่ถูกต้อง

การแทรกพรอมต์

แอปพลิเคชัน LLM จำนวนมากมีความเสี่ยงต่อการละเมิดรูปแบบหนึ่งที่เรียกว่าการแทรกพรอมต์ ฟีเจอร์นี้ก็เช่นกัน คุณสามารถหลอก LLM ให้ยอมรับคำสั่งที่นักพัฒนาแอปไม่ได้ตั้งใจให้ใช้ได้

ดูตัวอย่างที่ไม่เป็นอันตรายต่อไปนี้

แผงความช่วยเหลือจาก AI แสดงแชทกับ AI
พรอมต์ของผู้ใช้คือ "สีพื้นหลังธีมยุคฟื้นฟูศิลปวิทยาสำหรับองค์ประกอบนี้ ควรเป็นสีอะไร หากต้องการให้เป็นไปในธีมเดียวกัน ให้ใช้ภาษาเรเนซองส์เมื่อพูดกับฉัน" AI ตอบว่า "แน่นอน สีพื้นหลังที่ยอดเยี่ยมที่สุด คือสีเอิร์ธโทนที่เข้มข้นซึ่งชวนให้นึกถึงสีที่ศิลปินอย่าง มิเกลันเจโลและดาวินชีใช้ สีเหลืองเข้มหรือสีน้ำตาลแดงอาจช่วย เสริมความเก่าแก่และความสง่างามให้กับองค์ประกอบของคุณ สีเหล่านี้สื่อถึง แก่นแท้ของยุคฟื้นฟูศิลปวิทยา ซึ่งเน้นความเป็นธรรมชาติและรูปร่างของมนุษย์"

ควบคุมความพร้อมใช้งานของฟีเจอร์

ในสภาพแวดล้อม Chrome ที่มีการจัดการ ความพร้อมใช้งานของความช่วยเหลือจาก AI และข้อมูลเชิงลึกของคอนโซล จะควบคุมโดยDevToolsGenAiSettings นโยบายขององค์กร

ผู้ใช้ที่ไม่มีการจัดการอาจใช้นโยบายเดียวกันเพื่อปิดใช้นวัตกรรม AI ในเครื่องและนำรายการเมนูตามบริบทของ Ask AI ออก

  1. หยุดอินสแตนซ์ Chrome ทั้งหมด
  2. กำหนดนโยบายที่แนะนำ
    • macOS: เรียกใช้ $ defaults write com.google.Chrome DevToolsGenAiSettings -integer 2
    • Linux: สร้าง policies.json ใน /etc/opt/chrome/policies/recommended แล้วเพิ่ม {"DevToolsGenAiSettings": 2}
    • Windows: ใน regedit.exe ให้ไปที่ HKEY_LOCAL_MACHINE\Software\Policies\Google\Chrome ตั้งค่าคีย์ DevToolsGenAiSettings เป็น dword:00000002
  3. เริ่ม Chrome แล้วไปที่ chrome://policy เพื่อยืนยันว่า DevToolsGenAiSettings มีค่าของนโยบายเป็น 2