#ios

sonaki84sonaki84· 2년

iOS 웹 푸시를 받을 수 있도록 PWA를 만드는 방법

Progressive Web Apps(PWA)는 사용자에게 네이티브 앱과 유사한 경험을 제공하는 웹 애플리케이션의 일종입니다. 브라우저에 설치할 수 있으며 인터넷 연결 없이도 사용할 수 있습니다. PWA는 빠르고 반응성이 뛰어나며 오프라인에서 사용할 수 있습니다. iOS 16.4부터 PWA는 웹 푸시 알림을 받을 수 있습니다. 웹 푸시 알림은 웹 사이트에서 사용자에게 보낼 수 있는 알림입니다. 웹 푸시 알림을 사용하면 웹 사이트에 대한 새 콘텐츠나 업데이트에 대한 사용자에게 알릴 수 있습니다. 웹 푸시를 받을 수 있도록 PWA를 만들려면 몇 가지 작업을 수행해야 합니다. 웹 사이트에 서비스 워커를 추가해야 합니다. 서비스 워커는 백그라운드에서 실행되는 JavaScript 파일입니다. 웹 푸시 알림을 수신하고 처리하는 데 사용됩니다. 웹 사이트에 웹 푸시 알림 토큰을 추가해야 합니다. 웹 푸시 알림 토큰은 웹 사이트에 대한 고유 식별자입니다. 웹 푸시 알림을 보내는 데 사용됩니다. 웹 사이트에 웹 푸시 알림을 보내는 데 사용할 수 있는 API를 추가해야 합니다. 이러한 작업을 수행한 후에는 웹 사이트에 웹 푸시 알림을 보내기 시작할 수 있습니다. 웹 푸시 알림을 보낼 때는 다음을 지정해야 합니다: 알림 제목 알림 메시지 알림 아이콘 알림 배너 색상 알림 링크 웹 푸시 알림을 보낸 후에는 사용자가 잠금 화면, 알림 센터 또는 페어링된 Apple Watch에서 알림을 받게 됩니다. 다음은 웹 푸시를 받을 수 있도록 PWA를 만드는 방법에 대한 참고 샘플 코드입니다. HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>My PWA</title> </head> <body> <h1>My PWA</h1> <p>푸시 테스트 앱입니다. 홈 화면에 추가하세요.</p> </body> </html> Javascript: // service-worker.js // 서비스 워크에 등록 navigator.serviceWorker.register('service-worker.js'); // push 이벤트 정의 self.addEventListener('push', function(event) { // 알림 데이터 받기 var notificationData = event.data; // 알림 생성 var notification = new Notification(notificationData.title, { body: notificationData.message, icon: notificationData.icon }); // 알림 열기 notification.onclick = function() { window.open(notificationData.url); }; });
2.3K
1
0
케이플케이플· 4년

SwiftUI를 빨리 마스터하는 팁

Mastering SwiftUI previews This week, I want to talk about one of the most powerful Xcode features, SwiftUI previews. SwiftUI previews allow you to look at your SwiftUI views inside Xcode without running the app in the simulator. You can also preview UIKit views and controllers by wrapping them in SwiftUI. Today we will learn about all the powerful features of previews in Xcode. swiftwithmajid.com SwiftUI를 마스터하면 엄청나게 좋은 UI 생산성으로 앱을 만들 수 있습니다. 시뮬레이터 없이도 이런 화면에서 빨리 UI를 만들 수 있지요. SwiftUI를 이용할 때 미리보기를 가렸다 보였다 하면서 작업하면 개발이 용이해집니다. 따라서 미리보기 단축키를 익히면 훨씬 수월하게 개발할 수 있습니다.😁 Cmd + Option + Enter : 미리보기 보이기/숨기기 Cmd + Option + P :  미리보기 실행하기  
1.7K
0