인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

shafeel2님의 프로필 이미지
shafeel2

작성한 질문수

처음 배우는 리액트 네이티브

채널화면에서 에러가 나네요 ..

작성

·

559

0

아마 파이어베이스에서 channels 의 하위 컬렉션 members 생성시의 에러인것 같은데 

실력부족입니다 

https://github.com/dongguntechnology/rn_chat

 

 

Possible Unhandled Promise Rejection (id: 0): FirebaseError: Function doc() cannot be called with an empty path.

답변 6

0

shafeel2님의 프로필 이미지
shafeel2
질문자

 앞단계는 성공하였으나 

GiftedChat 사용시 아래에러가 뜨네요 

 

'failed to call function, __fbbatchedbridge is undefined'

 

 

김범준님의 프로필 이미지
김범준
지식공유자

shafeel2님 코드로 테스트를 해도 동일한 에러가 발생하지 않습니다. 

모두 종료하고 재시작해보시기 바랍니다.

계속해서 같은 현상이 발생하면 개발 환경 및 테스트 기기 등등에 대한 정보를 함께 적어주세요.

  

다른 오류를 발견했는데 오타가 있네요

Channel.js 파일에서 <GiftedChat> 에서 messages={messages}로 하셨는데, 여기서 사용한 messages가 선언되어 있지 않습니다. 

48line에 const [message, setMessage] .. 가 아니라

const [messages, setMessages]... 가 되어야 합니다. 

이 오타 외에 다른 문제는 보이지 않습니다. 

  

에러가 났다고 바로 질문을 올리기 보다는 스스로 해결하려는 노력을 해보는 것을 추천합니다. 

그래야 실력이 늘고, 나중에 비슷한 문제가 발생했을 때 해결할 수 있는 능력을 기르게 됩니다. 

에러 메시지를 이용해 검색을 해보는것을 추천합니다. 

그리고 영상을 차분하게 다시 보면서 어떤 부분에서 실수했는지 확인해 보시기 바랍니다. 

  

즐거운 하루 되세요

감사합니다. 

 

 

 

0

김범준님의 프로필 이미지
김범준
지식공유자

안녕하세요 shafeel2님, 

  

해당 메시지는 에러가 아니라 경고(warning)입니다. 

동작에는 아무 영향을 주지 않습니다. 

  

해당 메시지는 파이어베이스와 관련된 문제로 내부에 있는 파일중 JSTimer.js 파일에서 MAX_TIMER_DURATION_MS의 값인 60*1000 보다 오래 걸려서 나타나는 경고 입니다. 

그냥 무시하고 진행해도 문제가 없습니다. 

파일을 확인하고 싶으면 node_modules/react-native/Libraries/Core/Timers/JSTimer.js 을 확인해 보시면 됩니다. 

  

즐거운 하루 되세요

감사합니다. 

0

shafeel2님의 프로필 이미지
shafeel2
질문자

이런 또 에러가 ... 

 

 

Setting a timer for a long period of time, i.e. multiple minutes, is a performance and correctness issue on Android as it keeps the timer module awake, and timers can only be called when the app is in the foreground. See https://github.com/facebook/react-native/issues/12981 for more info. (Saw setTimeout with duration 366579ms)

0

김범준님의 프로필 이미지
김범준
지식공유자

안녕하세요 shafeel2님, 

  

collectionRef를 파라미터로 받는 doc  함수의 설명을 보면, 

https://firebase.google.com/docs/reference/js/firestore_lite.md?authuser=0#doc_2

path 파라미터의 타입이 문자열로 되어 있는 것을 볼 수 있습니다. 

따라서, 코드를 다음과 같이 수정하면 됩니다. 

const createMessage = async ({ channelId, message }) => {
const collection_Ref = collection(db, `channels/${channelId}/messages`);
const now = Date.now();
await setDoc(doc(collection_Ref, now.toString()), {
id: now.toString(),
text: message,
createdAt: now,
});
};

 

파이어베이스에 대한 내용은 파이어베이스 공식 문서를 확인하시기 바랍니다.

  

즐거운 하루 되세요

감사합니다. 

0

shafeel2님의 프로필 이미지
shafeel2
질문자

코드수정 후 실행하니

이래 에러가 뜨는군요 죄송합니다

 

[Unhandled promise rejection: TypeError: _n9.indexOf is not a function]

0

김범준님의 프로필 이미지
김범준
지식공유자

안녕하세요 shafeel2님, 

  

channels하위에 members라는 컬렉션은 없고, messages만 있습니다. 

  

https://github.com/dongguntechnology/rn_chat/blob/main/screens/Channel.js#L47

에 있는 createMessage의 message파라미터에는 Input 컴포넌트에 입력하는 값이 전달됩니다. 

즉, 32번째 줄에 있는 message._id는 undefined가 됩니다. 

따라서, doc() 함수의 두번째 파라미터에 undefined가 전달되고, 빈 경로로 호출할 수 없다는 

Function doc() cannot be called with an empty path.

에러가 나타납니다. 

  

파이어베이스의 버전이 변경되면서 사용법이 강의와 약간의 차이가 있습니다. 

const createMessage = async ({ channelId, message }) => {

const collection_Ref = collection(db, `channels/${channelId}/messages`);
const now = Date.now();
await setDoc(doc(collection_Ref, now), {
id: now,
text: message,
createdAt: now,
});
};

고유한 값으로 id가 필요하므로, Date.now()로 현재 timestamp 를 받아와서 id와 createdAt으로 사용하면 문제없이 동작할 것으로 예상됩니다. 

현재 작성하신 코드에서 동작하게 하시려면 이렇게 하는 방법이 있습니다. 

또는, 현재 듣고 계신 Chat App -part2 의 "채널 화면" 강의에서 조금더 진행하시면, GiftedChat을 이용해서 자동으로 message를 id가 포함된 객체로 전달하도록 작성합니다. 현재 에러나는 부분은 무시하시고 진행하셔도 크게 문제는 없습니다. 

  

즐거운 하루 되세요

감사합니다

 

shafeel2님의 프로필 이미지
shafeel2

작성한 질문수

질문하기