0바이트 레코드 파일
묘사
react 로컬 오디오: 4.1.3반응: 0.55.4
반응: 16.4.0
로컬 사운드를 사용하시겠습니까?아니오.
오디오 파일을 녹음하려고 시도하지만, 끝 파일은 0바이트를 보존합니다
아행grep
ReactNativeJS: Finished recording of duration 6 seconds at path: /data/user/0/myAPP/files/test.aac and size of 0 bytes
녹음기.onProgress=(데이터)=>{
위문하다.로그(data.currentMetering, data.currentPeakMetering)
};
ReactNativeJS: undefined, undefined
토론 #1
resact native fs토론 #2
의stat(path)@chinnr 힌트 감사합니다. 오디오를 녹음한 코드에 대해 질문이 하나 더 있습니다.stat(path)는 어디에 두시겠습니까?주 오디오 경로에서?아니면 마지막에 녹음하는 거예요?
컨디션
this.state = {
currentTime: 0.0,
recording: false,
paused: false,
stoppedRecording: false,
finished: false,
audioPath: AudioUtils.DocumentDirectoryPath + '/test.aac',
hasPermission: undefined,
};
버튼 클릭onRecordButtonClick(){
//Stop recording if already start
if (this.state.recording) {
this._stopAudio();
return;
}
this._checkAudioPermission().then((hasPermission) => {
this.setState({ hasPermission });
if (!hasPermission) return;
this.prepareRecordingPath(this.state.audioPath);
AudioRecorder.onProgress = (data) => {
console.log(data.currentMetering, data.currentPeakMetering)
this.setState({currentTime: Math.floor(data.currentTime)});
};
AudioRecorder.onFinished = (data) => {
// Android callback comes in the form of a promise instead.
if (Platform.OS === 'ios') {
this._finishRecording(data.status === "OK", data.audioFileURL, data.audioFileSize);
}
};
this._recordAudio();
});
}
오디오 기능```
기록 경로 준비(오디오 경로)
녹음기.기록 경로 준비(오디오 경로)
샘플링기:22050,
채널: 1,
오디오 품질: 낮음
오디오 인코딩: "aac",
오디오 인코딩 비트레이트: 32000
});
}
_checkAudioPermission(){
(Platform.os!='android') {
약속에 보답하다.결심
}
const rationale = {
'title': 'Microphone Permission',
'message': 'AudioExample needs access to your microphone so you can record audio.'
};
return PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.RECORD_AUDIO, rationale)
.then((result) => {
console.log('Permission result:', result);
return (result === true || result === PermissionsAndroid.RESULTS.GRANTED);
});
}async_recordAudio(){
(이 상태 로깅)
위문하다.경고(기록됨!);
이stopAudio();
회귀
}
if (!this.state.hasPermission) {
console.warn('Can\'t record, no permission granted!');
return;
}
if(this.state.stoppedRecording){
this.prepareRecordingPath(this.state.audioPath);
}
this.setState({recording: true, paused: false});
try {
const filePath = await AudioRecorder.startRecording();
} catch (error) {
console.error(error);
}
}비동기식 stopAudio()
만약(!this.state.recording)
위문하다.경고("멈출 수 없어, 녹음할 수 없어!");
회귀
}
this.setState({stoppedRecording: true, recording: false, paused: false});
try {
const filePath = await AudioRecorder.stopRecording();
if (Platform.OS === 'android') {
this._finishRecording(true, filePath);
}
return filePath;
} catch (error) {
console.error(error);
}
}finishRecording(성공, 파일 경로, 파일 크기)
이거.setState({finished:didcessfuel});
위문하다.로그("####didcessfuel", didcessfuel);
위문하다.로그(파일 경로, filePath);
RNFS.moveFile(FsUtils.stat(filePath), '/device-path/sound.aac');
console.log(`Finished recording of duration ${this.state.currentTime} seconds at path: ${filePath} and size of ${fileSize || 0} bytes`);
}```
토론 #셋
AudioRecorder.onProgress = (data) => {
console.log(data.currentMetering, data.currentPeakMetering)
};
ReactNativeJS: undefined, undefined
나도 같은 문제가 있는데, 어떻게 해결해야 합니까?
토론 #4
打印出来的录音进度偶然会为0?
토론 #5
내 예에서 AudioExample 옵션을 추가하고 코드를 변경하여 레코드 파일을 서버에 업로드하는 중가족:
npm i axios
'React'에서 React, {Component} 가져오기;
수입
평가학,
스타일시트,
텍스트
관점
고광택 터치,
플랫폼
라이센스 Sandroid,
} 리액션 본기에서
"axios"에서 axios 가져오기;
"react native Sound"에서 사운드 가져오기;
"react native audio"에서 {Audio Recorder, Audio Utils} 가져오기;
클래스 AudioExample 확장 구성 요소
state = {
currentTime: 0.0,
recording: false,
paused: false,
stoppedRecording: false,
finished: false,
audioPath: AudioUtils.DocumentDirectoryPath + '/test.aac',
hasPermission: undefined,
};
prepareRecordingPath(audioPath){
AudioRecorder.prepareRecordingAtPath(audioPath, {
SampleRate: 22050,
Channels: 1,
AudioQuality: "Low",
AudioEncoding: "aac",
AudioEncodingBitRate: 32000
});
}
componentDidMount() {
this._checkPermission().then((hasPermission) => {
this.setState({ hasPermission });
if (!hasPermission) return;
this.prepareRecordingPath(this.state.audioPath);
AudioRecorder.onProgress = (data) => {
this.setState({currentTime: Math.floor(data.currentTime)});
};
AudioRecorder.onFinished = (data) => {
// Android callback comes in the form of a promise instead.
if (Platform.OS === 'ios') {
this._finishRecording(data.status === "OK", data.audioFileURL, data.audioFileSize);
}
};
});
}
_checkPermission() {
if (Platform.OS !== 'android') {
return Promise.resolve(true);
}
const rationale = {
'title': 'Microphone Permission',
'message': 'AudioExample needs access to your microphone so you can record audio.'
};
return PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.RECORD_AUDIO, rationale)
.then((result) => {
console.log('Permission result:', result);
return (result === true || result === PermissionsAndroid.RESULTS.GRANTED);
});
}
_renderButton(title, onPress, active) {
var style = (active) ? styles.activeButtonText : styles.buttonText;
return (
<TouchableHighlight style={styles.button} onPress={onPress}>
<Text style={style}>
{title}
</Text>
</TouchableHighlight>
);
}
_renderPauseButton(onPress, active) {
var style = (active) ? styles.activeButtonText : styles.buttonText;
var title = this.state.paused ? "RESUME" : "PAUSE";
return (
<TouchableHighlight style={styles.button} onPress={onPress}>
<Text style={style}>
{title}
</Text>
</TouchableHighlight>
);
}
async _pause() {
if (!this.state.recording) {
console.warn('Can\'t pause, not recording!');
return;
}
try {
const filePath = await AudioRecorder.pauseRecording();
this.setState({paused: true});
} catch (error) {
console.error(error);
}
}
async _resume() {
if (!this.state.paused) {
console.warn('Can\'t resume, not paused!');
return;
}
try {
await AudioRecorder.resumeRecording();
this.setState({paused: false});
} catch (error) {
console.error(error);
}
}
async _stop() {
if (!this.state.recording) {
console.warn('Can\'t stop, not recording!');
return;
}
this.setState({stoppedRecording: true, recording: false, paused: false});
try {
const filePath = await AudioRecorder.stopRecording();
if (Platform.OS === 'android') {
this._finishRecording(true, filePath);
}
return filePath;
} catch (error) {
console.error(error);
}
}
async _play() {
if (this.state.recording) {
await this._stop();
}
// These timeouts are a hacky workaround for some issues with react-native-sound.
// See https://github.com/zmxv/react-native-sound/issues/89.
setTimeout(() => {
var sound = new Sound(this.state.audioPath, '', (error) => {
if (error) {
console.log('failed to load the sound', error);
}
});
setTimeout(() => {
sound.play((success) => {
if (success) {
console.log('successfully finished playing');
} else {
console.log('playback failed due to audio decoding errors');
}
});
}, 100);
}, 100);
}
async _record() {
if (this.state.recording) {
console.warn('Already recording!');
return;
}
if (!this.state.hasPermission) {
console.warn('Can\'t record, no permission granted!');
return;
}
if(this.state.stoppedRecording){
this.prepareRecordingPath(this.state.audioPath);
}
this.setState({recording: true, paused: false});
try {
const filePath = await AudioRecorder.startRecording();
} catch (error) {
console.error(error);
}
}
_finishRecording(didSucceed, filePath) {
this.setState({ finished: didSucceed });
console.log(`Finished recording of duration ${this.state.currentTime} seconds at path: ${filePath}`);
let ext = 'aac';
let data = new FormData();
data.append('file', {
uri:`file://${filePath}`,
name:`recording.${ext}`,
type:`audio/${ext}`
});
//Upload file to server
const url = "YOUR_END_POINT";
let headers = {};
headers['Content-Type'] = 'multipart/form-data;';
axios.post(url, data, {headers:headers});
}
render() {
return (
<View style={styles.container}>
<View style={styles.controls}>
{this._renderButton("RECORD", () => {this._record()}, this.state.recording )}
{this._renderButton("PLAY", () => {this._play()} )}
{this._renderButton("STOP", () => {this._stop()} )}
{/* {this._renderButton("PAUSE", () => {this._pause()} )} */}
{this._renderPauseButton(() => {this.state.paused ? this._resume() : this._pause()})}
<Text style={styles.progressText}>{this.state.currentTime}s</Text>
</View>
</View>
);
}
}var styles = 스타일시트.창조({
컨테이너:
flex:1,
배경색: "2b608a",
},
제어:
내용 변호: "중심",
항목 정렬: 가운데 맞춤,
flex:1,
},
진행 텍스트:
paddingTop:50,
사이즈:50,
색상:"ff"
},
버튼:
채우기:20
},
버튼 텍스트 사용 안 함:
색상: "#eee"
},
버튼 텍스트:
사이즈:20,
색상:"ff"
},
activeButtonText:{
사이즈:20,
색상: "B81F00"
}
});
기본 오디오 샘플 내보내기;
`
토론 #6
@expouic 제발, iOS에서 어떻게 녹음했어요?stat (경로) 를 사용하십니까?나는 그 문제에 너무 오래 빠졌다토론 #7
. 이 문제에 대해 무슨 해결 방법이 있습니까?토론 #8
any fix for this problem please ?
안드로이드 메소드 녹음기.stopRecording은 파일에 기록된 파일 경로만 되돌려주고 파일 크기가 포함된 데이터 구조는 되돌려주지 않습니다.ios에서 파일 크기를 되돌려줍니다.따라서 컨트롤 데스크톱에서 0 바이트가 기록되어 있다는 메시지를 보면 오류가 발생합니다.
바로 여기에서 언급한 바와 같다
using stat(path) by react-native-fs
이 방법을 사용하여 파일 크기를 검색할 수 있습니다.stopRecording 방법을stat에 반환하는 파일 경로를 매개 변수로 제공합니다.
토론 #9
json 데이터를 통해audioPath토론 #10
를 어떻게 보내는지On this my example, i'm using and changing code from AudioExample adding option to upload record file to server
Dependences: npm i axios
`import React, {Component} from 'react'; import { AppRegistry, StyleSheet, Text, View, TouchableHighlight, Platform, PermissionsAndroid, } from 'react-native'; import axios from 'axios'; import Sound from 'react-native-sound'; import {AudioRecorder, AudioUtils} from 'react-native-audio';
class AudioExample extends Component {
``` state = { currentTime: 0.0, recording: false, paused: false, stoppedRecording: false, finished: false, audioPath: AudioUtils.DocumentDirectoryPath + '/test.aac', hasPermission: undefined, };
prepareRecordingPath(audioPath){ AudioRecorder.prepareRecordingAtPath(audioPath, { SampleRate: 22050, Channels: 1, AudioQuality: "Low", AudioEncoding: "aac", AudioEncodingBitRate: 32000 }); }
componentDidMount() { this._checkPermission().then((hasPermission) => { this.setState({ hasPermission });
if (!hasPermission) return; this.prepareRecordingPath(this.state.audioPath); AudioRecorder.onProgress = (data) => { this.setState({currentTime: Math.floor(data.currentTime)}); }; AudioRecorder.onFinished = (data) => { // Android callback comes in the form of a promise instead. if (Platform.OS === 'ios') { this._finishRecording(data.status === "OK", data.audioFileURL, data.audioFileSize); } };
}); }
_checkPermission() { if (Platform.OS !== 'android') { return Promise.resolve(true); }
const rationale = { 'title': 'Microphone Permission', 'message': 'AudioExample needs access to your microphone so you can record audio.' };
return PermissionsAndroid.request(PermissionsAndroid.PERMISSIONS.RECORD_AUDIO, rationale) .then((result) => { console.log('Permission result:', result); return (result === true || result === PermissionsAndroid.RESULTS.GRANTED); }); }
_renderButton(title, onPress, active) { var style = (active) ? styles.activeButtonText : styles.buttonText;
return (
); } {title} _renderPauseButton(onPress, active) { var style = (active) ? styles.activeButtonText : styles.buttonText; var title = this.state.paused ? "RESUME" : "PAUSE"; return (
); } {title} async _pause() { if (!this.state.recording) { console.warn('Can\'t pause, not recording!'); return; }
try { const filePath = await AudioRecorder.pauseRecording(); this.setState({paused: true}); } catch (error) { console.error(error); } }
async _resume() { if (!this.state.paused) { console.warn('Can\'t resume, not paused!'); return; }
try { await AudioRecorder.resumeRecording(); this.setState({paused: false}); } catch (error) { console.error(error); } }
async _stop() { if (!this.state.recording) { console.warn('Can\'t stop, not recording!'); return; }
this.setState({stoppedRecording: true, recording: false, paused: false});
try { const filePath = await AudioRecorder.stopRecording();
if (Platform.OS === 'android') { this._finishRecording(true, filePath); } return filePath;
} catch (error) { console.error(error); } }
async _play() { if (this.state.recording) { await this._stop(); }
// These timeouts are a hacky workaround for some issues with react-native-sound. // See https://github.com/zmxv/react-native-sound/issues/89. setTimeout(() => { var sound = new Sound(this.state.audioPath, '', (error) => { if (error) { console.log('failed to load the sound', error); } });
setTimeout(() => { sound.play((success) => { if (success) { console.log('successfully finished playing'); } else { console.log('playback failed due to audio decoding errors'); } }); }, 100);
}, 100); }
async _record() { if (this.state.recording) { console.warn('Already recording!'); return; }
if (!this.state.hasPermission) { console.warn('Can\'t record, no permission granted!'); return; }
if(this.state.stoppedRecording){ this.prepareRecordingPath(this.state.audioPath); }
this.setState({recording: true, paused: false});
try { const filePath = await AudioRecorder.startRecording(); } catch (error) { console.error(error); } }
_finishRecording(didSucceed, filePath) { this.setState({ finished: didSucceed }); console.log(
Finished recording of duration ${this.state.currentTime} seconds at path: ${filePath}
);let ext = 'aac'; let data = new FormData(); data.append('file', { uri:`file://${filePath}`, name:`recording.${ext}`, type:`audio/${ext}` }); //Upload file to server const url = "YOUR_END_POINT"; let headers = {}; headers['Content-Type'] = 'multipart/form-data;'; axios.post(url, data, {headers:headers});
}
render() {
return (
); } ``` {this._renderButton("RECORD", () => {this._record()}, this.state.recording )} {this._renderButton("PLAY", () => {this._play()} )} {this._renderButton("STOP", () => {this._stop()} )} {/ {this._renderButton("PAUSE", () => {this._pause()} )} /} {this._renderPauseButton(() => {this.state.paused ? this._resume() : this._pause()})} {this.state.currentTime}s }
var styles = StyleSheet.create({ container: { flex: 1, backgroundColor: "#2b608a", }, controls: { justifyContent: 'center', alignItems: 'center', flex: 1, }, progressText: { paddingTop: 50, fontSize: 50, color: "#fff" }, button: { padding: 20 }, disabledButtonText: { color: '#eee' }, buttonText: { fontSize: 20, color: "#fff" }, activeButtonText: { fontSize: 20, color: "#B81F00" }
});
export default AudioExample; `
만약 내가 내용 유형을 선택한다면: - application/json은요
Reference
이 문제에 관하여(0바이트 레코드 파일), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://github.com/jsierles/react-native-audio/issues/273텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)