การแก้ปัญหา

ข้อผิดพลาดเกี่ยวกับคีย์ API และการเรียกเก็บเงิน

ในบางกรณี ระบบอาจแสดงแผนที่ที่มืดลงหรือรูปภาพ Street View "เชิงลบ" ที่มีลายน้ำเป็นข้อความ "สำหรับวัตถุประสงค์ในการพัฒนาเท่านั้น" ลักษณะการทำงานนี้มักบ่งบอกถึงปัญหาเกี่ยวกับคีย์ API หรือการเรียกเก็บเงิน หากต้องการใช้ผลิตภัณฑ์ Google Maps Platform คุณต้องเปิดใช้การเรียกเก็บเงินในบัญชี และคำขอทั้งหมดต้องมีคีย์ API ที่ถูกต้อง ขั้นตอนต่อไปนี้จะช่วยแก้ปัญหานี้

ระบบจะส่งคีย์ API เป็นพารามิเตอร์ key ใน URL ที่ใช้ในการโหลด Maps JavaScript API ตัวเลือกการตรวจสอบว่าคุณใช้คีย์ API อยู่หรือไม่มีดังนี้

  • ใช้ส่วนขยาย Google Maps Platform API Checker ของ Chrome ซึ่งจะช่วยให้คุณทราบว่าเว็บไซต์ของคุณใช้ Maps API ที่ได้รับอนุญาตของ Google อย่างถูกต้องหรือไม่
  • หากคุณใช้ไลบรารีหรือปลั๊กอินเพื่อโหลด Maps JavaScript API ให้ตรวจสอบการตั้งค่าของไลบรารีนั้นและมองหาตัวเลือกคีย์ API
  • ตรวจสอบข้อผิดพลาดในเบราว์เซอร์ หากคุณเห็นข้อความต่อไปนี้ แสดงว่าคุณใช้คีย์ API อย่างไม่ถูกต้อง
    • คําเตือนเกี่ยวกับ Google Maps JavaScript API: NoApiKeys
    • ข้อผิดพลาด Google Maps JavaScript API: MissingKeyMapError

สำหรับนักพัฒนาเว็บ

  • หากมีสิทธิ์เข้าถึงซอร์สโค้ดของแอปพลิเคชัน ให้มองหาแท็ก <script> ที่ใช้โหลด Maps JavaScript API เมื่อโหลด Maps JavaScript API ให้แทนที่ YOUR_API_KEY ในโค้ดด้านล่างด้วยคีย์ API 
      <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
  </script>
  • ตรวจสอบการรับส่งข้อมูลในเครือข่ายที่เกิดจากเว็บไซต์ในเบราว์เซอร์ ใน Chrome คุณสามารถดูข้อมูลนี้ได้โดยใช้แท็บเครือข่ายของ DevTools ในส่วนนี้ คุณจะเห็นคําขอเครือข่ายที่เว็บไซต์ของคุณส่ง คำขอที่ส่งโดยใช้ Maps JavaScript API จะอยู่ในเส้นทาง maps/api/js ในส่วนนี้ คุณสามารถยืนยันได้ว่าคําขอใช้พารามิเตอร์ key หรือไม่ คุณอาจต้อง กรองการเข้าชมเครือข่ายตาม maps/api/js เมื่อดูแท็บเครือข่าย

หากต้องการรับคีย์ API ให้คลิกปุ่มด้านล่าง หากไม่เห็นการตั้งค่าแบบมีคําแนะนํา ให้ทําตามวิธีการทั้งหมดที่หัวข้อเริ่มต้นใช้งาน Google Maps Platform
เริ่มต้นใช้งาน

เยี่ยม! ต่อไปเรามาตรวจสอบว่าบัญชีสำหรับการเรียกเก็บเงินแนบอยู่กับโปรเจ็กต์ของคุณหรือไม่

ไปที่ หน้าการเรียกเก็บเงินในคอนโซล Google Cloud แล้วเลือกโปรเจ็กต์ที่สร้างคีย์ API ของคุณ วิธียืนยันว่าคีย์เชื่อมโยงกับโปรเจ็กต์

  1. ไปที่ส่วนข้อมูลเข้าสู่ระบบ ซึ่งเข้าถึงได้จากแถบด้านข้างซ้ายในส่วน Google Maps Platform > ข้อมูลเข้าสู่ระบบ
  2. ตรวจสอบว่าคีย์ API ที่คุณใช้อยู่ในเว็บไซต์แสดงอยู่ในรายการ หากไม่ใช่กรณีนี้ ให้เปลี่ยนไปใช้โปรเจ็กต์อื่นและตรวจสอบข้อมูลเข้าสู่ระบบในโปรเจ็กต์นั้น
  3. หากไม่พบโปรเจ็กต์สำหรับคีย์ API ของคุณ คุณอาจเสียสิทธิ์เข้าถึงโปรเจ็กต์นี้ ขอความช่วยเหลือจากผู้อื่นในองค์กร หากไม่พบโปรเจ็กต์ต้นฉบับ คุณควรทำดังนี้
    1. สร้างโปรเจ็กต์ใหม่ ซึ่งทําได้โดยเลือกโปรเจ็กต์ใหม่จากรายการโปรเจ็กต์ หรือเลือกสร้างโปรเจ็กต์ผ่านหน้าตัวจัดการทรัพยากร
    2. สร้างคีย์ API ใหม่ ซึ่งทำได้ในหน้าข้อมูลเข้าสู่ระบบ เมื่อเข้าไปแล้ว ให้คลิกสร้างข้อมูลเข้าสู่ระบบ แล้วเลือกคีย์ API

เมื่อพบโปรเจ็กต์ในคอนโซลของ Cloud แล้ว ให้ตรวจสอบว่ามีบัญชีสำหรับการเรียกเก็บเงินแนบอยู่หรือไม่โดยไปที่ส่วนการเรียกเก็บเงินในเมนูด้านซ้าย

ไปที่หน้าเปิดใช้การเรียกเก็บเงินในคอนโซลระบบคลาวด์ แล้วเพิ่มบัญชีสำหรับการเรียกเก็บเงินลงในโปรเจ็กต์ ดูข้อมูลเพิ่มเติมได้ที่หัวข้อเริ่มต้นใช้งาน Google Maps Platform

เยี่ยม! โปรดตรวจสอบว่าวิธีการเรียกเก็บเงินที่ระบุถูกต้อง

คุณ เพิ่ม นำออก หรืออัปเดตวิธีการชำระเงินได้ในคอนโซลของ Cloud

หากคุณได้ตั้งขีดจํากัดประจําวันใน API ใดก็ตาม ซึ่งเป็นสิ่งที่พบได้ทั่วไปเพื่อป้องกันการเพิ่มขึ้นที่ไม่คาดคิด คุณแก้ไขปัญหานี้ได้ด้วยการเพิ่มขีดจํากัดประจําวัน

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

  1. เลือกโปรเจ็กต์หากได้รับข้อความแจ้ง
  2. เลือก API จากรายการ แล้วคลิกแท็บโควต้า

คีย์ API ที่มีข้อจํากัดที่อยู่ IP ใช้ได้กับเว็บเซอร์วิสที่มีไว้สําหรับใช้จากฝั่งเซิร์ฟเวอร์เท่านั้น (เช่น Geocoding API และ Web Service API อื่นๆ) เว็บเซอร์วิสส่วนใหญ่เหล่านี้มีบริการที่เทียบเท่าภายใน Maps JavaScript API (เช่น ดูบริการการเข้ารหัสพิกัดภูมิศาสตร์) หากต้องการใช้บริการฝั่งไคลเอ็นต์ของ Maps JavaScript API คุณจะต้องสร้างคีย์ API แยกต่างหาก ซึ่งสามารถรักษาความปลอดภัยได้ด้วยข้อจำกัดผู้อ้างอิง HTTP (ดูรับ เพิ่ม และจํากัดคีย์ API)

หากรหัสใช้ไม่ได้ ให้ทำดังนี้

Brendan Kenny และ Mano Marks ชี้ให้เห็นข้อผิดพลาดที่พบบ่อยและวิธีแก้ไขในวิดีโอนี้เพื่อช่วยให้คุณใช้งานโค้ดแผนที่ได้

  • ตรวจหาคำที่พิมพ์ผิด โปรดทราบว่า JavaScript เป็นภาษาที่คำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่
  • ตรวจสอบข้อมูลเบื้องต้น - ปัญหาที่พบบ่อยที่สุดบางอย่างเกิดขึ้นกับการสร้างแผนที่ครั้งแรก เช่น
    • ยืนยันว่าคุณได้ระบุพร็อพเพอร์ตี้ zoom และ center ในตัวเลือกแผนที่
    • ตรวจสอบว่าคุณได้ประกาศองค์ประกอบ div ที่แผนที่จะปรากฏบนหน้าจอ
    • ตรวจสอบว่าองค์ประกอบ div สำหรับแผนที่มีความสูง โดยค่าเริ่มต้น ระบบจะสร้างองค์ประกอบ div ที่มีความสูง 0 จึงมองไม่เห็น
    ดูตัวอย่างการติดตั้งใช้งานอ้างอิง
  • ใช้โปรแกรมแก้ไขข้อบกพร่อง JavaScript เพื่อช่วยระบุปัญหา เช่น โปรแกรมที่มีให้ใช้งานในเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ Chrome เริ่มต้นด้วยการมองหาข้อผิดพลาดในคอนโซล JavaScript
  • โพสต์คำถามใน Stack Overflow ดูหลักเกณฑ์เกี่ยวกับวิธีโพสต์คำถามที่ยอดเยี่ยมได้ในหน้าการสนับสนุน