Unable to detect the beacons

[Srikanth-Enuguru]

Version

1.2.9

Platform

Android

OS version

android 12

Steps to reproduce

import Beacons from '@mindsoftcreative/react-native-beacons-manager';

function App(): JSX.Element {
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  const [state, setState] = useState([]);

  useEffect(() => {
    requestLocationPermission();
    Beacons.init();
    Beacons.detectIBeacons();

    const beaconsServiceDidConnect = Beacons.BeaconsEventEmitter.addListener(
      'beaconServiceConnected',
      () => {
        console.log('service connected');
        startRangingAndMonitoring();
      },
    );

    const beaconsDidRange = DeviceEventEmitter.addListener(
      'beaconsDidRange',
      data => {
        console.log('beaconsDidRange beacons!', data);
      },
    );

    const regionDidEnter = DeviceEventEmitter.addListener(
      'regionDidEnter',
      data => {
        console.log('regionDidEnter beacons!', data);
      },
    );

    return () => {
      console.debug('[app] main component unmounting. Removing listeners...');
      stopRangingAndMonitoring();
      beaconsServiceDidConnect.remove();
      beaconsDidRange.remove();
      regionDidEnter.remove();
    };
  }, []);

  const startRangingAndMonitoring = async () => {
    try {
      const data1 = await Beacons.startRangingBeaconsInRegion('REGION3');
      console.log('Beacons ranging started successfully', data1);
      const data2 = await Beacons.startMonitoringForRegion('REGION3');
      console.log('Beacons monitoring started successfully', data2);
    } catch (error) {
      console.log('error', error);
      throw error;
    }
  };

  const stopRangingAndMonitoring = async () => {
    try {
      await Beacons.stopRangingBeaconsInRegion('REGION3');
      console.log('Beacons ranging stopped successfully');
      await Beacons.stopMonitoringForRegion('REGION3');
      console.log('Beacons monitoring stopped successfully');
    } catch (error) {
      throw error;
    }
  };

  const requestLocationPermission = async () => {
    try {
      const granted = await PermissionsAndroid.request(
        PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
        {
          title: 'Location Permission',
          message:
            'This example app needs to access your location in order to use bluetooth beacons.',
          buttonNeutral: 'Ask Me Later',
          buttonNegative: 'Cancel',
          buttonPositive: 'OK',
        },
      );
      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
        return true;
      } else {
        // permission denied
        return false;
      }
    } catch (err) {
      console.warn(err);
      return false;
    }
  };

  

  return (
    <SafeAreaView style={styles.sectionContainer}>
      <View>
        <Text>Hello</Text>
      </View>
    </SafeAreaView>
  );
}

Actual behavior

Console output:
Found beacons! {"beacons": [], "identifier": "REGION3", "uuid": ""}

Please help me.
Am I missing anything here?

[sashko9807]

I don't have android 12 device, to test but since this library is based on android beacon library, check their docs regarding necessary changes for android 12+.

Another thing, for beacons ranging to work, you have to enable the device's location

[Srikanth-Enuguru]

@sashko9807 Thank you for the response. I already added the permissions in manifest file.

I enabled device's location also. But still unable to detect the beacons.

[sashko9807]

@sashko9807 Thank you for the response. I already added the permissions in manifest file.

I enabled device's location also. But still unable to detect the beacons.

Has the location permission been granted at runtime(e.g. prompting user to grant location permission when landing the page)? Other than that, I have no idea, why it doesn't work.

In summary the flow of my usage is this:
User opens the screen, which ranges for beacon -> Prompt user to grant location permission(if not granted already) -> prompt user to turn on location(if turned off) -> Start ranging for beacons.

[Srikanth-Enuguru]

@sashko9807 Yes. Location permission is being granted at runtime only. Please refer to the below screenshots.

I observed this error in console: error uniqueId may not be null

2-4f6d-958b-f0711fa96e58)

[sashko9807]

@sashko9807 Yes. Location permission is being granted at runtime only. Please refer to the below screenshots.

I observed this error in console: error uniqueId may not be null

Try updating the altbeacon library to a version 2.19.5 or 2.19.6, if it is not updated already.
You can do that from node_modules/@mindsoftcreative/react-native-beacons-manager/android/build.gradle
Then

dependencies {
     ....
    implementation 'org.altbeacon:android-beacon-library:2.19.5'
}

If that doesn't work, I am out of ideas

[Srikanth-Enuguru]

@sashko9807 I tried after updating the altbeacon library to a version 2.19.5.
Still I'm facing the same issue. beacons are detected.

{"beacons": [], "identifier": "REGION3", "uuid": ""}

[Srikanth-Enuguru]

@MacKentoch @mozart27 @Jake-Young @dmontecillo
Please help me in fixing this issue.

[interstates21]

@Srikanth-Enuguru this helped me!

[yasintz]

I am recommending to use https://github.com/JanSneeuw/react-native-beacon-radar