React Native - Cara Request Permission Android

Halo semuanya. Di postingan kali ini, kita akan membuat aplikasi untuk bisa melakukan request permission untuk mengakses bagian lain dari handphone tersebut. 

Sebelum masuk ke codingnya, saya akan jelaskan secara singkat environment yang saya gunakan. Di project kali ini, saya akan menggunakan react native versi 0.67.3. React native nya di compile menggunakan komputer dengan OS Windows 10.

Kita akan membuat aplikasi yang memiliki tombol untuk meminta permission atau akses untuk bluetooth scan dan bluetooth connect. Kemudian hasilnya akan tertampil setelah tombol dipencet. Sedikit penjelasan tentang permission bluetooth scan dan connect. Bluetooth scan digunakan untuk memberikan permission agar aplikasi bisa melakukan scanning atau mencari bluetooth perangkat lain. Sedangkan permission bluetooth connect digunakan agar aplikasi bisa terhubung atau pairing dengan perangkat bluetooth lainnya. Untuk lebih lengkapnya tentang permission apa saja yang disediakan oleh react-native, bisa dilihat di link ini. Berikut adalah bentuk coding dari aplikasi yang akan kita buat.

import React from 'react';

import { View, Text, Button, PermissionsAndroid } from 'react-native';

const App = () => {

  const [text, setText] = React.useState('');

  const requestPermission = async () => {

    var granted = await PermissionsAndroid.requestMultiple([

      PermissionsAndroid.PERMISSIONS.BLUETOOTH_CONNECT,

      PermissionsAndroid.PERMISSIONS.BLUETOOTH_SCAN

    ]);

    var tampilan = '';

    for(var data in granted) {

      tampilan += data + ' : ' + granted[[data]];

      tampilan += '\n';

    }

    setText(tampilan);

  };

  return (

    <View style={{marginRight: 10, marginLeft: 10,

      marginTop: 25, padding: 5}}>

      <View style={{marginBottom: 20}}>

        <Button

          onPress={() => requestPermission()}

          title="Request Permission"

        />

      </View>

      <View>

        <Text>{text}</Text>

      </View>

    </View>

  );

}

export default App;

Jangan lupa tambahkan pengaturan permission di file
android/app/main/AndroidManifest.xml, jadi seperti tampilan dibawah.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"

  package="com...">

    <uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />

    <uses-permission android:name="android.permission.BLUETOOTH_SCAN" />

    <application

      ...>

      <activity

        ...>

        <intent-filter>

            ...

        </intent-filter>

      </activity>

    </application>

</manifest>

Hasil dari coding di atas akan tertampil seperti berikut.

Request permission ini digunakan untuk memastikan jika aplikasi kita bisa mengakses data lainnya yang ada di android. Pastikan kita melakukan request permission terlebih dahulu sebelum memanggil fungsi atau syntax untuk mengakses hal tersebut.

Sekian dulu tentang postingan kali ini. Semoga bisa membantu kalian yang sedang mencari cara untuk menambahkan permission di React Native. Selamat membaca dan mencoba.

Salam Share,

Funtastic Share