เปิดใช้ Handler API

ควบคุมวิธีเปิดแอป

Launch Handler API ช่วยให้คุณควบคุมวิธีเปิดแอปได้ เช่น จะใช้หน้าต่างที่มีอยู่หรือหน้าต่างใหม่ และระบบจะไปยัง URL การเปิดหรือไม่ เช่นเดียวกับ File Handing API การดำเนินการนี้จะจัดคิวออบเจ็กต์ LaunchParams ใน window.launchQueue ของหน้าที่เปิด

สถานะปัจจุบัน

ขั้นตอน สถานะ
1. สร้างคำอธิบาย เสร็จสมบูรณ์
2. สร้างฉบับร่างแรกของข้อกําหนด เสร็จสมบูรณ์
3. รวบรวมความคิดเห็นและปรับปรุงการออกแบบ เสร็จสมบูรณ์
4. ช่วงทดลองใช้จากต้นทาง เสร็จสมบูรณ์
5. เปิดตัว เสร็จสมบูรณ์

ใช้ Launch Handler API

การสนับสนุนเบราว์เซอร์

การรองรับเบราว์เซอร์

  • Chrome: 110
  • Edge: 110
  • Firefox: ไม่รองรับ
  • Safari: ไม่รองรับ

แหล่งที่มา

อินเทอร์เฟซ

Launch Handler API จะกำหนดอินเทอร์เฟซใหม่ 2 รายการ

LaunchParams : ออบเจ็กต์ที่มี targetURL ที่จะจัดการโดยผู้บริโภค LaunchQueue : คิวจะเปิดขึ้นจนกว่าผู้บริโภคที่ระบุจะจัดการคิว

สมาชิกไฟล์ Manifest ของ launch_handler

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

{
  "launch_handler": {
    "client_mode": "navigate-new"
  }
}

หากไม่ได้ระบุ launch_handler จะมีค่าเริ่มต้นเป็น {"client_mode": "auto"} ค่าที่ใช้ได้สำหรับช่องย่อยมีดังนี้

  • client_mode:
    • navigate-new: ระบบจะสร้างบริบทการท่องเว็บใหม่ในหน้าต่างเว็บแอปเพื่อโหลด URL เป้าหมายของการเปิดตัว
    • navigate-existing: ระบบจะนำการโต้ตอบล่าสุดกับบริบทการท่องเว็บในหน้าต่างเว็บแอป ไปยัง URL เป้าหมายของการเปิดตัว
    • focus-existing: เลือกบริบทการท่องเว็บที่มีการโต้ตอบล่าสุดในหน้าต่างเว็บแอปเพื่อจัดการการเปิดตัว ระบบจะจัดคิวออบเจ็กต์ LaunchParams ใหม่ที่มีการตั้งค่า targetURL เป็น URL ของการเปิดใช้งานใน window.launchQueue ของเอกสาร
    • auto: พฤติกรรมนี้ขึ้นอยู่กับ User Agent ที่จะตัดสินใจว่าวิธีใดเหมาะกับแพลตฟอร์มที่สุด เช่น อุปกรณ์เคลื่อนที่รองรับเฉพาะไคลเอ็นต์เดียวและจะใช้ existing-client ส่วนอุปกรณ์เดสก์ท็อปรองรับหลายหน้าต่างและจะใช้ navigate-new เพื่อหลีกเลี่ยงการสูญเสียข้อมูล

พร็อพเพอร์ตี้ client_mode ยังยอมรับรายการ (อาร์เรย์) ของค่าด้วย โดยระบบจะใช้ค่าแรกที่ถูกต้อง วิธีนี้ช่วยให้เพิ่มค่าใหม่ลงในข้อกําหนดได้โดยไม่ทําให้ใช้งานร่วมกับการใช้งานที่มีอยู่ได้

ตัวอย่างเช่น หากมีการเพิ่มค่าสมมติ "focus-matching-url" เว็บไซต์จะระบุ "client_mode": ["focus-matching-url", "navigate-existing"] เพื่อควบคุมลักษณะการทํางานของเบราว์เซอร์รุ่นเก่าที่ไม่รองรับ "focus-matching-url" ต่อไป

ใช้ window.launchQueue

ในโค้ดต่อไปนี้ ฟังก์ชัน extractSongID() จะดึง songID จาก URL ที่ส่งเมื่อเปิด ใช้เล่นเพลงใน PWA ของโปรแกรมเล่นเพลง

if ('launchQueue' in window) {
  launchQueue.setConsumer((launchParams) => {
    if (launchParams.targetURL) {
      const songID = extractSongId(launchParams.targetURL);
      if (songID) {
        playSong(songID);
      }
    }
  });
}

สาธิต

คุณดูการสาธิตการทำงานของ Launch Handler API ได้ในการสาธิต Launch Handler ของ PWA อย่าลืมตรวจสอบซอร์สโค้ดของแอปพลิเคชันเพื่อดูว่าแอปพลิเคชันใช้ Launch Handler API อย่างไร

  1. ติดตั้งแอป Musicr 2.0
  2. ส่งลิงก์ให้คุณเองในแอปพลิเคชันแชทของแบบฟอร์ม https://launch-handler.glitch.me?track=https://example.com/music.mp3 (คุณสามารถปรับแต่ง https://example.com/music.mp3 สำหรับ URL ที่ชี้ไปยังไฟล์เสียง เช่น https://launch-handler.glitch.me?track=https://cdn.glitch.me/3e952c9c-4d6d-4de4-9873-23cf976b422e%2Ffile_example_MP3_700KB.mp3?v=1638795977190)
  3. คลิกลิงก์ในแอปแชทและดูว่า Musicr 2.0 เปิดและเล่นแทร็กอย่างไร
  4. คลิกลิงก์ในแอปแชทอีกครั้งและสังเกตเห็นว่าคุณจะไม่ได้รับอินสแตนซ์ที่สองของ Musicr 2.0

ความคิดเห็น

ทีม Chromium อยากทราบความคิดเห็นของคุณเกี่ยวกับประสบการณ์การใช้งาน Launch Handler API

บอกเราเกี่ยวกับการออกแบบ API

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

รายงานปัญหาเกี่ยวกับการติดตั้งใช้งาน

หากพบข้อบกพร่องในการใช้งาน Chromium หรือการติดตั้งใช้งานแตกต่างจากข้อกําหนดหรือไม่ รายงานข้อบกพร่องที่ new.crbug.com โปรดระบุรายละเอียดให้มากที่สุดเท่าที่จะเป็นไปได้ รวมถึงวิธีการจำลองข้อบกพร่อง และป้อน Blink>AppManifest ในช่องคอมโพเนนต์ Glitch เหมาะอย่างยิ่งสำหรับการแชร์การจำลองอย่างรวดเร็ว

แสดงการสนับสนุน API

คุณวางแผนที่จะใช้ Launch Handler API ใช่ไหม การสนับสนุนแบบสาธารณะของคุณจะช่วยให้ทีม Chromium จัดลําดับความสําคัญของฟีเจอร์ต่างๆ และแสดงให้เห็นว่าการสนับสนุนฟีเจอร์เหล่านี้สำคัญเพียงใดต่อผู้ให้บริการเบราว์เซอร์รายอื่นๆ

ส่งทวีตถึง @ChromiumDev โดยใช้แฮชแท็ก #LaunchHandler และบอกเราว่าคุณกำลังใช้ฟีเจอร์นี้ที่ไหนและอย่างไร

ลิงก์ที่มีประโยชน์