Chrome 59부터 Notifications API 또는 chrome.notifications 확장 프로그램 API를 통해 전송된 알림은 Chrome 자체 시스템이 아닌 macOS 네이티브 알림 시스템에 의해 직접 표시됩니다.
이 변경사항으로 macOS용 Chrome이 플랫폼에 훨씬 더 잘 통합되는 느낌을 줄 뿐만 아니라 Chrome에서 시스템의 방해 금지 모드 설정을 준수하지 않는 등 오랫동안 지속된 여러 버그를 수정합니다.
아래에서는 이번 변경사항으로 인해 기존 API와 어떤 점이 다른지 살펴보겠습니다.
알림 센터
이 변경사항의 이점 중 하나는 알림이 macOS의 알림 센터에 표시된다는 점입니다.
![Chrome 알림이 macOS 알림 센터에 표시됩니다.](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/google-chrome-notificatio-0dd272728498d.png?authuser=3&hl=ko)
차이점
아이콘 크기 및 위치
아이콘의 모양이 변경됩니다. 크기가 작아지고 패딩이 적용됩니다. 미적으로 보기 좋도록 단색 대신 투명한 배경 아이콘으로 전환하는 것이 좋습니다.
![Mac용 Chrome 알림 아이콘(Chrome에서 표시하는 경우와 macOS에 표시됨)의 전후 비교](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-chrome-ma-8f7a9faf4b135.png?authuser=3&hl=ko)
작업 아이콘
이 변경 전에는 작업 버튼과 아이콘이 알림에 표시되었습니다. 네이티브 알림을 사용하면 작업 버튼 아이콘이 사용되지 않으며, 사용자는 알림 위로 마우스를 가져간 다음 '더보기' 버튼을 선택하여 사용 가능한 작업을 확인해야 합니다.
![Chrome에서 표시하는 아이콘과 macOS에서 표시되는 아이콘이 있는 알림 작업 버튼의 전후 비교](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-notificati-acefa2d32d351.png?authuser=3&hl=ko)
Chrome 로고
Chrome 로고는 항상 표시되며 교체하거나 변경할 수 없습니다. 이는 macOS의 서드 파티 애플리케이션의 요구사항입니다.
이미지
macOS에서 image
옵션이 더 이상 지원되지 않습니다. 이미지 속성을 정의하면 알림은 계속 표시되지만 이미지 매개변수는 무시됩니다 (아래 예 참고).
![macOS용 Chrome 알림 이미지의 전후 비교](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-notificati-35cb1f20a7481.png?authuser=3&hl=ko)
다음 코드를 사용하여 이미지 지원 기능을 감지할 수 있습니다.
if ('image' in Notification.prototype) {
// Image is supported.
} else {
// Image is NOT supported.
}
Chrome 확장 프로그램 변경사항
Chrome 확장 프로그램에는 알림 템플릿 개념이 있으며, 알림은 이러한 변경사항에 따라 다르게 작동합니다.
이미지 알림 템플릿에 이미지가 더 이상 표시되지 않습니다. 이미지는 보충 기능이며 사용자에게 유용할 필요가 없도록 해야 합니다.
![chrome.notification API의 이미지 템플릿 전과 후](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-image-temp-ea8d68fe9acc.png?authuser=3&hl=ko)
목록 알림 템플릿은 목록의 첫 번째 항목만 표시합니다. 기본 알림 스타일로 돌아가서 본문 텍스트를 사용하여 변경사항 세트를 요약하는 것이 좋습니다.
![chrome.notification API의 목록 템플릿 전후](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-list-templ-58a8124f4c8f9.png?authuser=3&hl=ko)
진행률 알림은 알림 제목에 백분율 값을 추가하여 진행률 표시줄 대신 진행률을 나타냅니다.
![chrome.notification API의 진행 상황 템플릿 전과 후](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-progress-t-aeb9eb61ae795.png?authuser=3&hl=ko)
알림 UI의 마지막 차이점은 appIconMarkUrl
이 macOS에서 더 이상 사용되지 않는다는 것입니다.
![chrome.notification API의 appIconMarkUrl 전후](https://developer.chrome.com/static/blog/native-mac-os-notifications/image/before-after-appiconmar-74e3f48314cd4.png?authuser=3&hl=ko)