Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Expo recordAsync() does not return response

Tags:

camera

expo

I was able to take picture using takePictureAsync() and it did give me a response. However, I am unable to receive response from recordAsync().

These are my dependencies:

import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, TouchableOpacity } from 'react-native';
import { Camera } from 'expo-camera';

These is the permissions:

useEffect(() => {
    (async () => {
      const { status } = await Camera.requestPermissionsAsync();
      setHasPermission(status === 'granted');
    })();
  }, []);

These are the functions and state:

  const [hasPermission, setHasPermission] = useState(null);
  const [type, setType] = useState(Camera.Constants.Type.back);
  const [record, setRecord] = useState(false)
  const [cam, setCam] = useState(null)

  const takeVideo = async () => {
    console.log('take video')
    if(cam){
      setRecord(true)
      let video = await cam.recordAsync({mute:true, maxDuration:5})
      console.log('video', video)  
    }
  }

 const stopRecord = async () => {
    console.log('stop record')
    let endVideo = await cam.stopRecording()
    console.log('end video', endVideo)
    setRecord(false)
  }

These are the render:

<View style={styles.container}>
  <Camera style={styles.camera} type={type} ref={(ref)=>setCam(ref)}>
     <View style={styles.buttonContainer}>
        {record?
          <TouchableOpacity style={styles.button} onPress={() => stopRecord()}>
            <Text style={styles.text}> Stop </Text>
          </TouchableOpacity>:
          <TouchableOpacity
            style={styles.button}
            onPress={() => {takeVideo()}}>
            <Text style={styles.text}> Record </Text>
          </TouchableOpacity>
        }
          
      </View>
    </Camera>
</View>
like image 904
Jin Tan Avatar asked Oct 15 '25 14:10

Jin Tan


1 Answers

After trying for one night, I have found the issue. To record a video in expo, user will need to give the app audio permission. This is not stated inside the documentation.(https://docs.expo.io/versions/latest/sdk/camera/#recordasync)

const {status} = await Audio.requestPermissionsAsync();

Hopefully expo can update this documentation.

How I found out it needs audio permission? I use try/catch to catch the error.

try{
    if(cam){
      setRecord(true)
      let video = await cam.recordAsync({mute:true, maxDuration:5})
      console.log('video', video)
    }
   }catch(err){
      console.log(err)
   }
like image 76
Jin Tan Avatar answered Oct 18 '25 00:10

Jin Tan



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!