ตัวอย่างโค้ด JavaScript

ตัวอย่างโค้ดด้านล่างใช้ไลบรารีของไคลเอ็นต์ Google API สําหรับ JavaScript คุณดาวน์โหลดตัวอย่างนี้ได้จากโฟลเดอร์ javascript ของที่เก็บตัวอย่างโค้ด API ของ YouTube ใน GitHub

รหัสขอสิทธิ์จากผู้ใช้ในการเข้าถึงขอบเขต https://www.googleapis.com/auth/yt-analytics.readonly

return gapi.auth2.getAuthInstance()
    .signIn({scope: "https://www.googleapis.com/auth/yt-analytics.readonly"})
    ...

แอปพลิเคชันของคุณอาจจําเป็นต้องขอสิทธิ์เข้าถึงขอบเขตอื่นๆ ด้วย ตัวอย่างเช่น แอปพลิเคชันที่เรียกใช้ YouTube Analytics API และ YouTube Data API อาจต้องให้ผู้ใช้ให้สิทธิ์เข้าถึงบัญชี YouTube ของตนด้วย ภาพรวมการให้สิทธิ์จะระบุขอบเขตที่มักจะใช้ในแอปพลิเคชันที่เรียกใช้ YouTube Analytics API

รับสถิติรายวันของช่อง

ตัวอย่างนี้เรียก YouTube Analytics API เพื่อเรียกดูยอดดูรายวันและเมตริกอื่นๆ สําหรับช่องทางของผู้ใช้ที่ได้รับอนุญาตในปี 2017 ตัวอย่างนี้ใช้ไลบรารีของไคลเอ็นต์ JavaScript ของ Google APIs

ตั้งค่าข้อมูลเข้าสู่ระบบการให้สิทธิ์

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

1. สร้างหรือเลือกโปรเจ็กต์ในคอนโซล Google API
2. เปิดใช้ YouTube Analytics API สําหรับโปรเจ็กต์
3. เลือกแท็บหน้าจอขอค��ามยินยอม OAuth ที่ด้านบนของหน้าข้อมูลเข้าสู่ระบบ เลือกอีเมล ป้อนชื่อผลิตภัณฑ์หากยังไม่ได้ตั��งค่าไว้ แล้วคลิกปุ่มบันทึก
4. ในหน้าข้อมูลเข้าสู่ระบบ ให้คลิกปุ่มสร้างข้อมูลเข้าสู่ระบบ แล้วเลือกรหัสไคลเอ็นต์ OAuth
5. เลือกประเภทเว็บแอปพลิเคชันสําหรับแอปพลิเคชัน
6. ในช่องต้นทาง JavaScript ที่ได้รับอนุญาต ให้ป้อน URL ที่จะใช้แสดงตัวอย่างโค้ด ตัวอย่างเช่น คุณอาจใช้อะไรก็ได้อย่าง http://localhost:8000 หรือ http://yourserver.example.com เว้นช่อง URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตว่างไว้ได้
7. คลิกปุ่มสร้างเพื่อสร้างข้อมูลเข้าสู่ระบบให้เสร็จสิ้น
8. ก่อนปิดกล่องโต้ตอบ ให้คัดลอกรหัสไคลเอ็นต์ซึ่งคุณจะต้องใส่ไว้ในตัวอย่างโค้ด

ทําสําเนาตัวอย่างในเครื่อง

จากนั้นบันทึกตัวอย่างเป็นไฟล์ในเครื่อง ในตัวอย่าง ให้หาบรรทัดต่อไปนี้และแทนที่ YOUR_CLIENT_ID ด้วยรหัสไคลเอ็นต์ที่คุณได้รับเมื่อตั้งค่าข้อมูลเข้าสู่ระบบการให้สิทธิ์

gapi.auth2.init({client_id: 'YOUR_CLIENT_ID'});

เรียกใช้โค้ด

ตอนนี้คุณพร้อมแล้วที่จะทดสอบตัวอย่าง

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

   Sign-in successful
   GAPI client loaded for API

3. หากคุณเห็นข้อความแสดงข้อผิดพลาดแทนบรรทัดด้านบน ให้ยืนยันว่าคุณโหลดสคริปต์จาก URI การเปลี่ยนเส้นทางที่ได้รับอนุญาตซึ่งตั้งค่าไว้สําหรับโปรเจ็กต์และคุณป้อนรหัสไคลเอ็นต์ลงในโค้ดตามที่อธิบายไว้ข้างต้น
4. คลิกปุ่มเรียกใช้เพื่อเรียกใช้ API ��ุณจะเห็นการพิมพ์ออบเจ็กต์ response ไปยังคอนโซลในเบราว์เซอร์ ในออบเจ็กต์นั้น พร็อพเพอร์ตี้ result จะแมปกับออบเจ็กต์ที่มีข้อมูล API

รหัสตัวอย่าง

<script src="https://apis.google.com/js/api.js"></script>
<script>
  function authenticate() {
    return gapi.auth2.getAuthInstance()
        .signIn({scope: "https://www.googleapis.com/auth/yt-analytics.readonly"})
        .then(function() { console.log("Sign-in successful"); },
              function(err) { console.error("Error signing in", err); });
  }
  function loadClient() {
    return gapi.client.load("https://youtubeanalytics.googleapis.com/$discovery/rest?version=v2")
        .then(function() { console.log("GAPI client loaded for API"); },
              function(err) { console.error("Error loading GAPI client for API", err); });
  }
  // Make sure the client is loaded and sign-in is complete before calling this method.
  function execute() {
    return gapi.client.youtubeAnalytics.reports.query({
      "ids": "channel==MINE",
      "startDate": "2017-01-01",
      "endDate": "2017-12-31",
      "metrics": "views,estimatedMinutesWatched,averageViewDuration,averageViewPercentage,subscribersGained",
      "dimensions": "day",
      "sort": "day"
    })
        .then(function(response) {
                // Handle the results here (response.result has the parsed body).
                console.log("Response", response);
              },
              function(err) { console.error("Execute error", err); });
  }
  gapi.load("client:auth2", function() {
    gapi.auth2.init({client_id: 'YOUR_CLIENT_ID'});
  });
</script>
<button onclick="authenticate().then(loadClient)">authorize and load</button>
<button onclick="execute()">execute</button>
yt_analytics_v2.html