Expo + Notification 시작하기

8805 단어 Notificationexpo

Mac이 없지만 아이폰에 알림을 보내고 싶다!



앱 개발 수업 중에 문득 이런 생각이 가슴 속을 둘러싸고, 도착한 것은 Expo이었습니다.

Expo는 자바스크립트(프레임워크의 주로 React)로 Android, IOS 앱을 쉽게 개발할 수 있도록 도와주는 도구입니다.

우선 앱에서 알림을 보내기 전에 먼저 온라인 에디터와 Curl을 사용하여 알림을 보내고 싶습니다.

앱 설치



Iphone에서 Expo Client를 설치하고 계정을 만드십시오.

우선 온라인 에디터를 사용해 본다



Expo의 온라인 편집기는 Expo Snack 라는 사이트에서 웹에서 쉽게 Expo 응용 프로그램을 만들 수 있습니다. 이번에는 Curl을 사용하여 알림을 보내기 위해 ExponentTokenID라는 것을 얻기위한 응용 프로그램 ()을 만듭니다.

소스 코드는 다음과 같습니다. 이것을 App.js에 쓰십시오. (쓴 것 htps : // s ck. 에 x포. 이오 / @ 에이 ct / ゔ ぃ 세프 sh와 켄)
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Permissions, Notifications } from 'expo';

//取得のためのコード
async function registerForPushNotificationsAsync() {

  //warningがでるのを防ぐためにtry catchを入れる
  try {

    const { status: existingStatus } = await Permissions.getAsync(
      Permissions.NOTIFICATIONS
    );
    let finalStatus = existingStatus;

    if (existingStatus !== 'granted') {
      const { status } = await Permissions.askAsync(Permissions.NOTIFICATIONS);
      finalStatus = status;
    }

    if (finalStatus !== 'granted') {
      return;
    }

    this.token = await Notifications.getExpoPushTokenAsync();
    // this.token = token
    //コンソールに出力
    console.log(this.token);

  } catch (error) {
    console.log(error);
  }
  return this.token;
}


export default class App extends React.Component {
  componentDidMount() {
    //呼び出し
    let token = registerForPushNotificationsAsync();
  }
  render() {
    return (
      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
        <Text>Open up App.js to start working on your app!</Text>
        <Text>token: {token}</Text>
      </View>
    );
  }
}
{token} 에서 빨간색 선이 나오고 있지만 무시하십시오. 잘갑니다

Expo Client를 통해 Expo 앱을 살펴보십시오.



Expo Snack의 오른쪽을보십시오.


장치가 보입니다. 이 Run on your device를 클릭하면 로그인하라는 메시지가 나타납니다.
로그인하면, Projects 라는 란에서 사용하고 있는 앱을 선택할 수 있게 되어 있으므로, 이것을 기동합니다.

앱을 열면,token: ExponentPushToken[...] 라는 문자를 볼 수 있다고 생각하므로, 이 녀석을 메모해 주세요.

메모를 사용하여 Curl에서 알림을 보냅니다.

Curl을 사용하여 Iphone에 알림



앱을 떨어뜨린 후,
터미널에서 다음 명령을 입력하십시오.
curl -H "Content-Type: application/json" -X POST "https://exp.host/--/api/v2/push/send" -d '{
  "to": "ExponentPushToken[<yourtoken>]",
  "title":"hello",
  "body": "world"
}'

당신의 아이폰에 좋은 알림을 얻을 수 있습니다.

참고


  • 공식 Push Notification
  • Expo의 Push Notifications 사용
  • 좋은 웹페이지 즐겨찾기