CODEWITHSUNDEEP
react-nativewebcameraexpo
GRZa
GRZa

Reputation: 793

Expo <Camera> component does not work on the Web on mobile

I am using this basic code to get access to the camera using Expo Camera component.

It works on a computer, but when I open it on iPhone/iPad it shows me empty space (although it asks for permissions and shows camera in use symbol. I tried both Safari and Chrome. I use https

import { Camera } from 'expo-camera';

export default function Add({ navigation }){

  const [cameraPermission, setCameraPermission] = useState(null);
  const [camera, setCamera] = useState(null);


  const permisionFunction = async () => {
    // here is how you can get the camera permission
    const cameraPermission = await Camera.requestCameraPermissionsAsync();

    setCameraPermission(cameraPermission.status === 'granted');

    
    if (
      cameraPermission.status !== 'granted'
    ) {
      alert('Permission for media access needed.');
    }
  };

  useEffect(() => {
    permisionFunction();
  }, []);

  return (
    <View >
        <Camera
          ref={(ref) => setCamera(ref)}
        />
     </View>);
}

Any idea what can cause it?

Upvotes: 0

Views: 4769

Answers (1)

GRZa
GRZa

Reputation: 793

I found the issue thread here.

The issue seems to be with Camera.requestCameraPermissionsAsync() that does not properly close the camera, so subsequent attempts to use the camera are failing. (This is my guess, I have not debugged the code).

Once I disabled Camera.requestCameraPermissionsAsync() call, the code works.

Upvotes: 3

Related Questions