skip to Main Content

I’m trying to take pictures in foreground service. for example taking pictures when the user is in another program. when we are in the app everything is running fine, But when I close the app while the foreground service is active, the camera stops working and gives this error:

`WARN  Possible Unhandled Promise Rejection (id: 3):
session/camera-not-ready: [session/camera-not-ready] The Camera is not ready yet! Wait for the onInitialized() callback!`

I am using this for foreground service: https://notifee.app/react-native/docs/android/foreground-service and for camera: https://github.com/mrousavy/react-native-vision-camera

Here is my code:

import React, {useRef, useState, useEffect} from 'react';
import {
  Button,
  PermissionsAndroid,
  SafeAreaView,
  StatusBar,
  StyleSheet,
  Text,
  View,
  LoadingView,
  ActivityIndicator,
  Image,
  TouchableOpacity,
} from 'react-native';
import {useCameraDevices, Camera} from 'react-native-vision-camera';
import {useIsForeground} from './hooks/useIsForeground';
import RNFS from 'react-native-fs';
import notifee, {AndroidColor} from '@notifee/react-native';


const HelloWorldApp = () => {
  const isAppForeground = useIsForeground();
  console.log('In Foreground?: ', isAppForeground);

  const cameraRef = useRef(null);
  const [finalPath, setPhotoPath] = useState('');

  const devices = useCameraDevices();
  const device = devices.front;

  useEffect(() => {
    console.log('useEffect');
    notifee.registerForegroundService(() => {
      console.log('registerForegroundService');
      return new Promise(() => {
        setInterval(() => {
          console.log('setInterval');
          const snapShotTaker = async () => {
            const snapshot = await cameraRef.current.takeSnapshot({
              quality: 20,
              skipMetadata: true,
            });
            console.log(snapshot);
            //const path = RNFS.ExternalDirectoryPath + '/photo-X.jpg';
            //await RNFS.moveFile(snapshot.path, path);
            setPhotoPath('file://' + snapshot.path);
            console.log(finalPath);
          };
          snapShotTaker();
        }, 2000);
      });
    });
  }, []);

  if (device == null) {
    return <ActivityIndicator style={styles.indicator} size="large" />;
  }

  async function onDisplayNotification() {
    // Request permissions (required for iOS)
    await notifee.requestPermission();

    // Create a channel (required for Android)
    const channelId = await notifee.createChannel({
      id: 'default',
      name: 'Default Channel',
    });

    // Display a notification
    await notifee.displayNotification({
      title: 'Foreground service',
      body: 'This notification will exist for the lifetime of the service runner',
      android: {
        channelId,
        asForegroundService: true,
        color: AndroidColor.RED,
        colorized: true,
      },
    });
  }

  return (
    <View style={styles.container}>
      <Camera
        ref={cameraRef}
        style={styles.camera}
        device={device}
        isActive={true}
      />
      <Image
        source={{uri: finalPath + '?' + new Date()}}
        style={[styles.image]}
      />

      <TouchableOpacity style={styles.button} onPress={onDisplayNotification}>
        <Text>Start F Service</Text>
      </TouchableOpacity>
    </View>
  );
};

2

Answers


  1. The notifee docs suggests to register your foreground service early on in your project directory outside of any react component, preferably your ‘index.js’ file

    Login or Signup to reply.
  2. If you take a look at the source code for react-native-vision-camera you will see that the camera is being bound to the main activity – this main activity will be killed when you leave the app therefore the camera will be killed too.

    You will probably need to patch the package and bind it to the lifecycle of a foreground service somehow.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search