Firebase 페이지 여러개 만들기 강의에서

[유용환]

detail.html에서

이런 오류가 나오는데 

Uncaught FirebaseError: Function CollectionReference.doc() cannot be called with an empty path.
at new qr (prebuilt.js:184:9)
at Yd (prebuilt.js:14497:19)
at yp (prebuilt.js:14885:44)
at nm.doc (prebuilt.js:17992:79)
at detail.html:84:30

어떤 것이 문제인가요

db.collection('product').doc(쿼리스트링.get('id')).get().then

이것이 84번째 줄입니다.

var 쿼리스트링 = new URLSearchParams(window.location.search)

 

[codingapple]

쿼리스트링이라는 변수가 없나봅니다 있는지 출력해봅시다 

[밥값]

안녕하세요?

저도 이전에 글쓰신 분과 같은 오류입니다 완전히 똑같습니다
Uncaught FirebaseError: Function CollectionReference.doc() cannot be called with an empty path.

detail.html

db.collection('product').doc(쿼리스트링.get('id')).get().then

var 쿼리스트링 = new URLSearchParams(window.location.search)

오류입니다. 오류를 해결하고 싶습니다.

답변이 잘 이해가 가지 않는데 제가 어떤 걸 해야 오류가 고쳐질까요?

[codingapple]

var 쿼리스트링 변수를 출력해봅시다 아무것도 안나오면 /detail?id=어쩌구로 접속안한것인듯요

[밥값]

강사님~
이렇게 하는게 맞는지는 모르겠으나
쿼리스트링 변수출력해봤는데 달라지는게 없습니다
주소창보니까 detail?id=어쩌구로 접속이 안되어 있는데 왜 이러는걸까요?



이게 제 detail.html 파일입니다

  <nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container-fluid">
      사과마켓
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav">
          <li class="nav-item">
            Home
         

          <li class="nav-item">             Features          

          <li class="nav-item">             Pricing          

          <li class="nav-item">             Disabled          

       

      </div>     </div>   </nav>

  <div class="container">
    상세페이지임
    <button>수정</button>
    <div class="detail-pic my-4" style="background-image: url('https://placeimg.com/640/380/tech');"></div>
    <div>
      <h5>올린사람 : 모름</h5>
      <hr>
      <h5 class="title">지금 url에 기록된 id를 가진 게시물의 상품명</h5>
      <p class="date">올린날짜</p>
      <p class="price">지금 url에 기록된 id를 가진 게시물의 가격</p>
    </div>
</div>

    <script>

    const db= firebase.firestore();
    // db.collection('product').doc('상품3').set({ 제목 : '변기'}) // 데이터베이스에 저장하게함
    // db.collection('product').add({ 제목 : '??'}) // 자동저장
    const storage = firebase.storage();

    var 쿼리스트링 = new URLSearchParams(window.location.search)
      console.log(쿼리스트링); 
      // 변수출력해봄

    db.collection('product').doc(쿼리스트링.get('id')).get().then((result)=>{
        console.log(result.data())
        $('.title').html(result.data().제목)
        $('.price').html(result.data().가격)
        $('.detail-pic').css('background-image', `url(${result.data().이미지})`)

      })

    </script>

</body>
</html>

[codingapple]

메인페이지에서 상품눌러서 상세페이지로 접속합시다

[밥값]

감사합니다 강사님 !! 🎉🎉🎉
😆😆😆😆😆😆😆

[Brain Choi]

어찌어찌 해결하였습니다~:)

[글쓴이]

글