2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
글쓴이글
-
2022년 8월 22일 06:47 #43442
박지오참가자파이어베이스 강의를 토대로 프로젝트를 하는중인데요. 로그인한 유저랑 게시물올린유저랑 같은사람일때만 수정하기 삭제하기를 구현하려고하는데 잘 작동이안되네요. 일단 css는 아래처럼 처음엔 안보이게해놓고 유저uid랑 게시물 uid랑 같을때만 block으로한상태인데 잘작동이안되네요. 어느아이디로로그인하든 수정,삭제하기가 보입니다.. if문을 잘못작성한걸까요? #edit { display: none; } #delete { display: none; } 전체코드<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous" /> <link href="main.css" rel="stylesheet" /> <link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link href="https://fonts.googleapis.com/css2?family=Cuprum:ital@1&family=Gloria+Hallelujah&family=Orbitron&display=swap" rel="stylesheet" /> </head> <body class="body"> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> <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.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous" ></script> <script> const firebaseConfig = { apiKey: 'AIzaSyAH-KOEpyYVknCZUEOh_YLiWHybaOfDIlI', authDomain: 'wewrite-92f77.firebaseapp.com', projectId: 'wewrite-92f77', storageBucket: 'wewrite-92f77.appspot.com', messagingSenderId: '286872322873', appId: '1:286872322873:web:319f642b13c0375c649ee8', measurementId: 'G-3N048SNN6W', };firebase.initializeApp(firebaseConfig); </script> <div class="collapse" id="navbarToggleExternalContent"> <div class="bg-dark p-4"> <h5 class="text-white h4">Collapsed content</h5> <span class="text-muted">Toggleable via the navbar brand.</span> </div> </div> <div class="wrapper"><script src="nav.js"></script></div> <div class="container"> <button id="edit" class="edit" src="edit.html">수정하기</button> <button id="delete">삭제하기</button> <div class="bg" style="background-image: url()"></div> <div class="detail-pic my-4" style="background-image: url()"> <p class="content" id="content"></p> </div>
<div> <h5 class="author" id="author"></h5> <hr /> <h5 class="title" id="title">제목</h5> <p class="date" id="date"></p> </div> <!-- <button class="btn btn-outline-secondary" id="comment">댓글보기</button> --> </div>
<script src="user.js"></script> <script> const db = firebase.firestore(); //firebase 데이터 읽기 const storage = firebase.storage(); //storage다루는 문법
//삭제함수 $('#delete').click(function () { db.collection('write') .doc(queryString.get('id')) .delete() .then(() => { alert('삭제완료'); window.location.href = 'index.html'; console.log('Document successfully deleted!'); }) .catch((error) => { console.error('Error removing document: ', error); }); });// URL query string에 있던 정보를뽑아온다 query string이란 ~html?뒤에있던것들 //ex) http://localhost:9000/detail.html?id=f5QuoJovv4PXHtWKMF67 여기선 id=f5QuoJovv4PXHtWKMF67 이게 쿼리스트링 var queryString = new URLSearchParams(window.location.search);
//유저의 로그인상태확인 firebase.auth().onAuthStateChanged((user) => { if (로그인유저 == 게시물유저) { var 로그인유저 = user.uid; console.log(로그인유저); $('#edit').css('display', 'block'); $('#delete').css('display', 'block'); } }); var 로그인유저; var 게시물유저; db.collection('write') .doc(queryString.get('id')) .get() .then((result) => { console.log(result.data().uid); var 게시물유저 = result.data().uid; console.log(게시물유저); var writes = result.data().title; $('.author').html('작가:' + result.data().name); $('.title').html(result.data().title); $('.content').html(result.data().content); $('.detail-pic').css('background-image', `url(${result.data().image})`); }); //현재로그인한user uid랑 글작성한 uid랑 같을때만 수정하기창 보이기 $('#edit').click(function () { window.location.href = '/edit.html?id=' + queryString.get('id'); }); </script> </body> </html> -
글쓴이글
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.