2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
파이어베이스를 배포했는데, 화면에 메뉴만 보이고 나머지는 안 보여요.
db를 받아오지 못하는 걸까요? 로컬에서는 제대로 보이고 잘 실행돼요. 어떻게 해결해야 될까요?
그리고 혹시 로그인은 되나 확인하려고 login페이지로 가니까 저런 경고문구가 떠요ㅠ
다음은 index.html 소스코드입니다.
<!DOCTYPE html>
<html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>사자마켓</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"><link href="main.css" rel="stylesheet"> </head>
<body> <nav class="navbar navbar-expand-lg bg-body-tertiary"> <div class="container-fluid"> <a class="navbar-brand" href="/index.html">사자마켓</a> <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"> <a class="nav-link active" aria-current="page" href="/index.html">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Feature</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Pricing</a> </li> <li class="nav-item"> <a class="nav-link disabled" aria-disabled="true">Disabled</a> </li> </ul> </div> </div> </nav> <div class="container mt-3"> </div> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-app.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-auth.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-firestore.js"></script> <script src="https://www.gstatic.com/firebasejs/8.6.5/firebase-storage.js"></script><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script><script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script><script> var firebaseConfig = { apiKey: ... }; // Initialize Firebase firebase.initializeApp(firebaseConfig); </script> <script> const db = firebase.firestore();// db.collection(product).get() // .then((querySnapshot) => { // console.log("데이터 불러오기 성공:", querySnapshot); // }) // .catch((error) => { // console.error("데이터 불러오기 실패:", error); // });var 뺀거 = localStorage.getItem('user'); $('#userName').html(JSON.parse(뺀거).displayName)firebase.auth().onAuthStateChanged((user) => { if (user) { console.log(user.uid); // $('#userName').html(user.displayName) // localStorage.setItem('user', JSON.stringify(user)) } })db.collection('product').get().then((결과) => { 결과.forEach((doc) => { const data = doc.data();let formattedDate = ''; if (data.날짜 && data.날짜.seconds) { const date = new Date(data.날짜.seconds * 1000); formattedDate = date.toLocaleDateString('ko-KR', { year: 'numeric', month: 'long', day: 'numeric' }); } // console.log(doc.data())const imageStyle = data.이미지 ? `background-image: url('${data.이미지}')` : 'background-color: #f8f9fa'; // 기본 배경색 지정var 템플릿 = `<div class="product"> <div class="thumbnail" style="${imageStyle}"></div> <div class="flex-grow-1 p-4"> <h5 class="title"><a href="/detail.html?id=${doc.id}">${data.제목}</a></h5> <p class="date">${formattedDate}</p> <p class="price">${data.가격}</p> <p class="float-end">♥0</p> </ > </div >`; $('.container').append(템플릿) }) }) </script> </body></html>
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.