Hướng dẫn cài đặt push notification cho ứng dụng React Native (p2)

- Nối tiếp phần 1, ở phần 2 chúng ta cùng cài đặt cho ios

Bài viết có video hướng dẫn chi tiết

Tiếp tục những cài đặt ở phần 1, đến phần 2 chúng ta cấu hình cho ios. Đầu tiên chúng ta mở

Từ xcode, ta tiến hành cấu hình như sau:

  • Từ project chúng ta chọn Capabilities và Enable “Push Notifications”.
  • Tiếp Theo Enable “Background Modes” and check “Remote notifications

Screen Shot 2018-10-05 at 2.14.04 PM

  • Từ project => Build Setting => Header search paths thêm dòng config $(SRCROOT)/../node_modules/react-native-onesignal/ios và chọn recursive.

Screen Shot 2018-10-05 at 2.36.01 PM

  • Link thư viện
  • Sửa file AppDelegate.h
#import <RCTOneSignal.h>

Khai báo:

@property (strong, nonatomic) RCTOneSignal* oneSignal;

Screen Shot 2018-10-05 at 2.41.04 PM.png

Tiếp Theo kết nối onesignal qua key

self.oneSignal = [[RCTOneSignal alloc] initWithLaunchOptions:launchOptions
                                                         appId:@”KEY-ONESIGNAL”
                                                      settings:@{kOSSettingsKeyInFocusDisplayOption : @(OSNotificationDisplayTypeNotification), kOSSettingsKeyAutoPrompt : @YES}];

Screen Shot 2018-10-05 at 2.43.27 PM.png

Sau khi cấu hình xong, chúng ta cần tạo certificate Theo hướng dẫn sau:

 

https://documentation.onesignal.com/docs/generate-an-ios-push-certificate

Bước 1: Từ macbook, chúng ta mở Keychain Access và chọn như sau

https://documentation.onesignal.com/docs/generate-an-ios-push-certificate

Screen Shot 2018-10-05 at 2.18.34 PM

Bước 2: Chọn lưu vào ổ đĩa mà nhập các trường bắ buộc (email)

Screen Shot 2018-10-05 at 2.20.39 PM.png

Bước 3: Đăng nhập vào developer apple, ở phần app id, chỉnh sửa phần  nhận thông báo cho ứng dụng của bạn

Screen Shot 2018-10-05 at 2.21.42 PM

Bước 4: Ở phần certificates chúng ta tạo mới 1 cer mới và chọn như trong hình

Screen Shot 2018-10-05 at 2.24.02 PM.png

Bước 5: Chọn app Id tương tứng rồi tiếp tục

Bước 6: Chọn file certSigningRequest mà chúng ta export khi trước upload lên theo hướng dẫn.

Screen Shot 2018-10-05 at 2.25.43 PM.png

Bước 7: Chọn và tải certificate của bạn vừa tạo

Screen Shot 2018-10-05 at 2.26.59 PM.png

Bước 8: Tạo key, bạn nhấp chuột vào file cer vừa tải về, mở file lên

Screen Shot 2018-10-05 at 2.27.58 PM.png

Bước 9: Vào Keychain Access export file .p12

Screen Shot 2018-10-05 at 2.29.01 PM.png

Với file .p12 này ta dùng để cấu hình trên server onesignal cho nền tảng ios.

Bước 10: Từ onesignal => Setting => chọn cấu hình cho ios

Screen Shot 2018-10-05 at 2.31.05 PM.png

Bước 11: Upload file .p12 vừa tạo và kết thúc quá trình cấu hình server

Screen Shot 2018-10-05 at 2.31.34 PM.png

Sau khi cấu hình thành công, thì ta tiến hành test như ở phần 1. Bạn cũng có thể xem video chi tiết phần 2 và làm theo.

Chúc các bạn thành công!

Nguồn: Document react native onesignal

https://ntdung1128.wordpress.com/2018/10/05/huong-dan-cai-dat-push-notification-cho-ung-dung-react-native-p2/​

Bài liên quan

Hướng dẫn tạo App Icon, Splash Screen cho ứng dụng React Native.

Đối với app mobile thì app icon hay màn hình splash rất quan trọng, nó giúp cho ứng dụng của chúng ta nhìn chuyên nghiệp hơn, đẹp hơn và dễ tiếp cận với người dùng hơn. Trong khi đó, App icon và màn hình splash cũng là 1 dạng để marketing cho ứng dụng của bạn. Trong bài hôm nay mình sẽ hướng dẫn các ...

Nguyễn Dũng viết 2 ngày trước

Hướng dẫn export file release cho ứng dụng React Native.

Đối với lập trình ứng dụng, công đoạn sau khi xây dựng chương trình cũng rất quan trọng đó là đóng gói sản phẩm, đưa sản phẩm lên kho ứng dụng (CH play store đối với ứng dụng Android, App store đối với ứng dụng IOS). Hôm nay mình sẽ hướng dẫn các bạn export file release cho ứng dụng RN.

Nguyễn Dũng viết 1 tuần trước

Hướng dẫn cài đặt push notification cho ứng dụng React Native (p2)

- Nối tiếp phần 1, ở phần 2 chúng ta cùng cài đặt cho ios

Nguyễn Dũng viết 2 tuần trước

Hướng dẫn cài đặt giao diện cho blogger

Trong bài viết này mình sẽ hướng dẫn các bạn từng bước cài đặt giao điện cho blog của mình. Trước tiên các bạn phải download về những giao diện mà bạn muốn cài đặt và sau khi chép về máy, các bạn nhớ giải nén nó ra nhé . Các bạn làm theo các bước như sau: Bước 1: Sau khi đặng nhập vào Bảng ...

Trần Trung Dũng viết 2 tuần trước

Giới thiệu về Onesignal, hướng dẫn cài đặt push notification cho ứng dụng React Native (p1)

Trong bài ta sẽ tìm hiểu Onesignal là gì, những tính năng mà Onesignal cung cấp và cài đặt push notification với React Native sử dụng Onesignal

Nguyễn Dũng viết 3 tuần trước
+6