리뷰 - expo Permissions on Android

1.0 Permissions on Android

안드로이드의 경우 Permission을 구현해보자. expo의 경우 개발환경에 때라  managed workflow와 bared workflow가 있다. 여기서는 managed workflow만 다룰 것이다. 만약 bared workflow와 IOS환경에 대해서 관심이 있다면 맨 밑에 있는 Permissions링크로 들어가 보자.  

 

일단 모듈을 설치하자. 

expo install expo-permissions

 

managed workflow에서 모든 안드로이드 퍼미션은 app.json파일의 android.permissions에 의해서 관리된다. 몇몇 module들에는 자동으로 permission이 포함되는 경우가 있다. 

 

camera를 포함시켜주어야한다고 가정해보자.  그러면 android.permission에 list 형태로 넣어야 한다. 만약 넣어야 한 permission이 없다면 [ ]를 넣으면 된다.

 

Example

"android": {

"package": "????????",

"versionCode": ???????????????,

"permissions" : [ ...다른 permission들 ,camera]

},

 

NOTE : permission은 필요한 것만 넣어야한다. 아무 생각 없이 넣으면 app store 등록 시 거절될 수 있다.

 

2.0 Implementaion with Hooks

보호되고 있는 기능을 permission을 통해서 이용할수 있다. 보호되는 기능의 Permission을 물어보고 얻는 것을 구현하기 위해 Hooks를 사용해보자. 

 

먼저 API를 임포트 시키자

import * as Permissions from 'expo-permissions';
import React, { usePermissions } from "react";

2.1 usePermission

임포트를 완료했다면 아래의 코트를 보자.

const [permission, askPermission, getPermission] = usePermissions(Permissions.CAMERA, { ... });

Hooks에서 기본적으로 제공하는 usePermission을 사용하면 된다. permissions.CAMERA자리에는 리스트 형식으로 대체될 수 있다. 여러 가지를 한꺼번에 물어 볼 때 유용하다. {....}는 옵션의 자리이다. 관심이 있으면 아래 Permissions링크로 들어가 보자.

 

permission은 status, expiration 그리고 scope들을 가진 object이다.  

 

 

askPermission의 경우 유저에게 물어보는것을 의미한다. 한편 getPermission은 유저 없이 현재 stauts(상태)를 리턴 받기 위해 사용된다.

 

그러면 예제를 통해 구체적으로 어떻게 사용되는지 살펴보자.

function App() {
  const [permission, askForPermission] = usePermissions(Permissions.CAMERA, { ask: true });

  if (!permission || permission.status !== 'granted') {
    return (
      <View>
        <Text>Permission is not granted</Text>
        <Button title="Grant permission" onPress={askForPermission} />
      </View>
    );
  }

  return (
    <View>
      <Camera />
    </View>
  );
}

 

option 자리에 ask : true라는 옵션이있다. askPermission(UI가 제공된다. 일반적인 앱에서 물어보는 것처럼?) 없이 진행할지를 정하는 것이다. 여기서는 버튼이 askPermission의 역할을 하고 있기 때문에 ask : true로 정했다. 기본적으로 ask는 false로 정의되어있다. 즉 askPermission이 callback 된다. 만약 현재 permission 상태를 알고 싶으면 getPermission을 추가해 확인해 보자.

2.2 Permissions.getAsync(...types)

 

아래의 예를 보자. 참 쉽다.

async function checkMultiPermissions() {
  const { status, expires, permissions } = await Permissions.getAsync(
    Permissions.CALENDAR,
    Permissions.CONTACTS
  );
  if (status !== 'granted') {
    alert('Hey! You have not enabled selected permissions');
  }
}

위의 코드를 보면 리턴된  PermissionResponse에는  status, expires, permisssions를 가지고 있는 것을 할 수 있다. 관심이 있다면 아래의 Permissions링크로 가서 확인해 봐라. 

 

2.2 Permissions.askAsync(... types)

유저에게 permission UI를 제공하고 답변을 받는 함수이다. 만약 이미 granted access 되어 있다면 response는 suceess이다.

이 함수는 새로운 PermissionResonse object를 리턴한다.

 

2.3 PermissionsResponse

이 오브잭트는 아래와 같은 형태를 가지고 있다. 아래의 코드에서 | 는 or의 뜻을 가지고 있다. 구체적인 내용을 맨밑으 링크를 통해 공부해보기 바란다.

interface PermissionResponse {
  status: 'granted' | 'undetermined' | 'denied';
  granted: boolean;
  expires: 'never' | number;
  canAskAgain: boolean;
  permissions: {
    // an object with an entry for each permission requested
    [permissionType: string /* PermissionType */]: PermissionInfo;
  };
}

docs.expo.io/versions/v40.0.0/sdk/permissions/

Permissions - Expo Documentation