2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
글쓴이글
-
2023년 7월 6일 07:46 #89822
황철민참가자--------------------->upload.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="main.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"> </head>
<nav class="navbar navbar-expand-lg bg-body-tertiary"> <div class="container-fluid"> 당근 <span class="ms-auto mx-2" id="userName">Name</span> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav me-auto mb-2 mb-lg-0"> <li class="nav-item"> Home <li class="nav-item"> Link <li class="nav-item dropdown"> Dropdown <ul class="dropdown-menu">
- Action
- Another action
- <hr class="dropdown-divider">
- Something else here
<li class="nav-item"> Disabled <form class="d-flex" role="search"> <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search"> <button class="btn btn-outline-success" type="submit">Search</button> </form> </div> </div> </nav><div class="container mt-3"> <input type="text" class="form-control mt-2" id="title" placeholder="title"> <textarea class="form-control mt-2" id="content">content</textarea> <!-- <input type="text" class="form-control mt-2" id="price" placeholder="price"> --> <input class="form-control mt-2" type="file" id="image"> <button class="btn btn-danger mt-3" id="send">올리기</button> </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.0/dist/js/bootstrap.bundle.min.js"></script> <script src="https://code.jquery.com/jquery-3.7.0.min.js" integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
<script >
const firebaseConfig = { apiKey: "AIzaSyBaPocafLkaD6G-OlMHkO64YDmAbgYsW5A", authDomain: "homepage-9978e.firebaseapp.com", projectId: "homepage-9978e", storageBucket: "homepage-9978e.appspot.com", messagingSenderId: "237249758140", appId: "1:237249758140:web:5edb2687779d50ffb361b9", measurementId: "G-26XL67DWXG" };
firebase.initializeApp(firebaseConfig); </script> <script> const db = firebase.firestore(); const storage = firebase.storage(); $('#send').click(function(){ //이미지 저장 var file = document.querySelector('#image').files[0]; //폴더 지정 이미지 저장 선언 var storageRef = storage.ref(); var 저장할경로 = storageRef.child('image/'+file.name); //저장하는 기능 var 업로드작업 = 저장할경로.put(file); // var 업로드작업 = 저장할경로.put(지정한 js로 파일 넣으면됨);
업로드작업.on( 'state_changed', // 변화시 동작하는 함수 null, //에러시 동작하는 함수 (error) => { console.error('실패사유는', error); }, // 성공시 동작하는 함수 () => { 업로드작업.snapshot.ref.getDownloadURL().then((url) => { console.log('업로드된 경로는', url);
var 저장할거 = { 제목 : $('#title').val(), // 가격 : $('#price').val(), 내용 : $('#content').val(), 날짜 : new Date(), 이미지 : url, uid : JSON.parse( localStorage.getItem('user') ).uid, 이름 : JSON.parse(localStorage.getItem('user')).displayName, }
db.collection('product').add(저장할거).then((result)=>{ console.log(result); window.location.href = "./index.html"; }).catch((err)=>{ console.log(err); }) //.than(성공 했을때).catch(실패 했을때) 에러 체크 }); } ); })
var 뺀거 = localStorage.getItem('user'); if(localStorage.getItem('user') != null){
$('#userName').html(JSON.parse(뺀거).displayName);
}
firebase.auth().onAuthStateChanged((user)=>{ if (user) { console.log(user.uid); console.log(user.displayName); localStorage.setItem('user', JSON.stringify(user)); } })//이름 뜨는 기능
</script>
</body> </html>
------------------------ 질문 : 게시물을 작성할때 이미지뿐만 아닌 pdf파일도 첨부하고 싶은데 어떤 코드를 추가해야하는 알고싶습니다.
뿐만아닌 detail페이지에서 pdf 파일을 다운받을 수 있게 하고싶은데 어떤 코드를 추가해야할까요?
2023년 7월 6일 08:40 #89826
codingapple키 마스터기타파일도 이미지랑 똑같이 올리면 됩니다 storageRef.child('images/stars.jpg').getDownloadURL() 이런거 쓰면 다운로드url 알려준다는군요 https://firebase.google.com/docs/storage/web/download-files?hl=ko#web-namespaced-api
-
글쓴이글
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.