ใหม่ใน Chrome 91

Pete LePage

สิ่งที่จำเป็นต้องทราบมีดังนี้

ผมชื่อ Pete LePage ทำงานและถ่ายทำจากที่บ้าน ไปดูกันว่ามีอะไรใหม่สำหรับนักพัฒนาซอฟต์แวร์ใน Chrome 91

ชื่อที่แนะนำสำหรับ File System Access API

API รายการโปรดรายการหนึ่งที่ออกมาจากโปรเจ็กต์ Fugu ในปีนี้ก็คือ File System Access API เมื่อผู้ใช้ให้สิทธิ์แล้ว แอปจะโต้ตอบกับไฟล์ในอุปกรณ์ของผู้ใช้ในลักษณะเดียวกับที่แอปอื่นๆ ที่ติดตั้งไว้ทำ ซึ่งจะช่วยให้คุณสร้างประสบการณ์การใช้งานที่สมจริงยิ่งขึ้นสำหรับผู้ใช้

ตั้งแต่ Chrome 91 เป็นต้นไป คุณสามารถแนะนำชื่อและตำแหน่งของไฟล์หรือไดเรกทอรีที่จะโต้ตอบด้วยได้แล้ว โดยส่งsuggestedName พร็อพเพอร์ตี้เป็นส่วนหนึ่งของตัวเลือก showSaveFilePicker

const fileHandle = await self.showSaveFilePicker({
  suggestedName: 'Untitled Text.txt',
  types: [{
    description: 'Text documents',
    accept: {
      'text/plain': ['.txt'],
    },
  }],
});

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

const fileHandle = await self.showOpenFilePicker({
  startIn: 'documents'
});

ดูรายละเอียดทั้งหมดได้จากโพสต์การเข้าถึงระบบไฟล์ของทอม

กำลังอ่านไฟล์จากคลิปบอร์ด

นอกจากนี้ยังมี API ใหม่ที่น่าสนใจอีก 1 รายการสำหรับโต้ตอบกับไฟล์ที่จะเปิดตัวใน Chrome 91 ตอนนี้เว็บแอปบนเดสก์ท็อปอ่านไฟล์จากคลิปบอร์ดได้แล้ว (การอ่านไฟล์จากคลิปบอร์ดใช้ได้ใน Safari มาตั้งแต่ปี 2018)

แน่นอนว่าคุณไม่มีสิทธิ์เข้าถึงคลิปบอร์ดแบบไม่จํากัด คุณจึงต้องตั้งค่า paste event listener จากนั้นคุณจะเข้าถึงเนื้อหาของไฟล์แต่ละไฟล์ในคลิปบอร์ดได้ในตัวแฮนเดิลเหตุการณ์

window.addEventListener('paste', onPaste);

async function onPaste(e) {
  const file = e.clipboardData.files[0];
  const contents = await file.text();
  ...
}

แชร์ข้อมูลเข้าสู่ระบบในเว็บไซต์ที่เกี่ยวข้อง

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

ซึ่งเหมาะสําหรับกรณีที่เว็บไซต์แสดงจากโดเมนระดับบนสุดที่แตกต่างกัน เช่น google.com และ google.ca หรือคุณอาจมีชื่อโดเมนหลายชื่อ

หากต้องการเชื่อมโยงเว็บไซต์ คุณจะต้องสร้างไฟล์ assetlinks.json ที่กําหนดความสัมพันธ์ระหว่างโดเมน ในตัวอย่างด้านล่าง เราบอกเบราว์เซอร์ว่าทั้งโดเมน .com และ .co.uk เกี่ยวข้องกันและสามารถแชร์ข้อมูลเข้าสู่ระบบได้

[{
  "relation": ["delegate_permission/common.get_login_creds"],
  "target": {
    "namespace": "web",
    "site": "https://www.example.com"
  }
 },
{
  "relation": ["delegate_permission/common.get_login_creds"],
  "target": {
    "namespace": "web",
    "site": "https://www.example.co.uk"
  }
 }]

จากนั้นโฮสต์ไฟล์ assetlinks.json ในโฟลเดอร์ .well-known สำหรับแต่ละโดเมน

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

และอีกมากมาย

แน่นอนว่ายังมีอีกมากมาย

วิดีโอทั้งหมดจาก I/O 2021 พร้อมให้รับชมแล้วในตอนนี้ มีข้อมูลดีๆ รออยู่ ลองไปดูกัน

Web Transport หรือก่อนหน้านี้เรียกว่า Quic Transport ได้ผ่านการเปลี่ยนแปลงหลายอย่างและกำลังเริ่มการทดลองใช้ต้นทางใหม่

Web Assembly SIMD เสร็จสิ้นการทดลองใช้เวอร์ชันต้นทางแล้วและพร้อมให้บริการแก่ผู้ใช้ทุกคน

องค์ประกอบแบบฟอร์มที่ปรับปรุงใหม่พร้อมใช้งานใน Android แล้ว เพื่อปรับปรุงประสบการณ์ของผู้ใช้

และระบบจะใช้แอตทริบิวต์ media ขององค์ประกอบ <link> สำหรับ link rel="icon" ซึ่งหมายความว่าคุณสามารถกำหนดไอคอนต่างๆ ตามการค้นหาสื่อได้ เช่น ไอคอนที่แตกต่างกันสำหรับโหมดมืดและโหมดสว่าง

<link
  rel="icon"
  media="(prefers-color-scheme: dark)"
  href="/icons/dark.png">
<link
  rel="icon"
  media="(prefers-color-scheme: light)"
  href="/icons/light.png">

อ่านเพิ่มเติม

ข้อมูลนี้เป็นเพียงไฮไลต์สำคัญบางส่วนเท่านั้น ดูการเปลี่ยนแปลงเพิ่มเติมใน Chrome 91 ได้ที่ลิงก์ด้านล่าง

สมัครใช้บริการ

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

ผมชื่อ Pete LePage และทันทีที่ Chrome 92 เปิดตัว เราจะมาบอกคุณถึงสิ่งใหม่ๆ ใน Chrome