본문 바로가기

TIL✨

문제해결2_TIL(17)

이번주는 내내 문제해결 TIL이다. 미리확정임ㅋㅋ

어제 가만히 생각해보니까 내가 맡기로 한 분야에서 제대로 풀린게 없어서 이 상태로 가다간 답도 없겠다싶은 마음에 

잠도 제대로 못자고 새벽부터 시작 했다.. 하루종일 입맛도 없고ㅋㅋㅋ ㅠ

그래서 이번 주 금요일에 마이페이지를 완료시키자는 생각으로 계획을 짰다.

 

수요일-마이페이지에서 이미지변경, 닉네임 변경 시 그 상태로 저장이 가능하게하기
목요일-삭제버튼과 비밀번호 변경 구현하기
금요일-내가 쓴 목록 글 불러와서 밑에 나오게 하기

 

크게 이런식으로 짰는데 다행히 오늘은 내가 할꺼 다하고 삭제버튼까지 다 구현을 했다.

물론 이 구현하는 사이에 튜터님은 2번이나 찾아간거 안비밀 ㅠㅋㅋㅋ

 

첫번째는 이미지가  local storage까지는 잘 들어가지만 새로고침이나 다른페이지에 갔다오면 다시 없어져있었다.

이게 분명 파이어베이스까지 올라가는건 확인을 했는데 정작 페이지에 불러들여지지가 않아서 힘들었다.

콘솔해보면 displayName:null이였다. + photoURL도 안뜨고 이게 문제였다 이게  

 

✅해결

이 부분을 없애기 위해서 새벽부터 했건만 안되서 좌절하는 중에 콘솔로 하나씩 오류뜨는거 부터 해결하자 생각했다.

그 중에서 다 기억은 안나지만 대략적으로 import하는 부분에서 문제가 있었다.

authservice를 임포트하고

사진을 저장할 수 있는 downloadURL을 imgref를 달아서 위치를 지정해주고 photoURL을 downloadURL로 실행해주었다.

그리고 updateProfile을 사용해서 이미지를 가져오고 

 

input에 입력한 value값을 message라는 변수에 담아서 그 변수를  닉네임을 저장할 수 있는 some-child파일을 만들어서

거기에 닉네임이 저장되게 하고 uploadstring으로 이 내용들을 파이어베이스에 저장한다음 displayName이 message가

되도록 해주었다.

최종 코드 ㅠㅠ

이렇게 되서 다행히 한번 저장하면 계속 잘 유지 중이다!

 

그리고 두 번째는 닉네임을 저장할때 콘솔 창에는 입력이 잘 됬는데 값은 나오지 않았다.

튜터님이랑 원인을 찾았는데 보니까  

✅document.getElementById('profileNickname').value =>를 .textcontent로 해놓는 바람에 안되었던 것이다.

 

input은 textcontent가 더 먼저 나와서 value값이 뒤에 나온다고 한다ㅠ

그래서 value값이 textcontent뒤에 가려져 있었다고 한다.

알고나니까 완전 간단....ㅎㅋㅋㅋㅋ 나 혼자였으면 못찾았을 듯 이렇게 또 유익하게 얻고 갑니다..ㅎ

 

세번째로 삭제 기능이였는데 ㅠ

삭제 버튼을 누르면 이미지가 기본디폴트 값으로 변하는 기능이였다.

튜터님을 또 찾아갔는데 튜터님이 봐주시는 동안 콘솔창에 디폴트 값을 띄우는 것 까지는 성공을 했다.!!!

혼자 오만짓을 다한듯 그래도 잠시 이렇게 한게 지식을 많이 얻었다;;역시 구글링하면서 얻어야되나봄😂😂

 

일단 내가 생각한 디폴트 이미지방법가져오기는

1.storage에 있는 기본이미지 주소를 가져온다

2. 기본이미지의 photoURL을 null로 바꾼다.

 

✅이 두가지경우를 생각했는데 나는 1번으로 설정을 하기로 했다.

그래서 if문을 사용해서 만약 유저의 이미지가 디폴트 이미지 주소와 다르다하면 삭제버튼을 누를경우 디폴트 이미지로 

바꿔주는 조건을 걸어서 만들었다.

이거는 삭제구현 완성코드

이렇게 코드를 짜서 콘솔창에만 뜬다고 튜터님한테 말씀드렸더니

튜터님께서 then뒤에 조건을 달아보자고 하셔서 조건을 profileview라는 아이디 값을 가진 img에

default이미지를 넣을 수 있도록 했다.

그렇지만 내가 모르고 있었던 것은 src를 넣어줘야한다는거!

src주소에 이미지가 들어가있는 것이기 때문에 그 값을 바꿔줘야 한다고 한다.

왠지 안 바뀌더라...ㅎ 이런 세세한 정보도 얻어갑니다.

 

그래서 오늘은 크게 3가지 오류를 해결했고 다행이 오늘 하기로 한 계획을 다해서 나름 홀가분 한것같다.

내일은 비밀번호 변경이랑 내가 쓴 글 목록 불러오기를 해야겠다!!ㅎㅎ

 

오류 해결을 기록하는게 도움이 될까 했는데 이렇게 다시 정리를 하니까 확실히 다시 머리에 정리가 잘되는 것

같다...ㅎ 이제부터 미리미리 오류는 메모장에 적어놔야겠다!! 오늘은 끝!

😎

 

'TIL✨' 카테고리의 다른 글

댓글 수정 기능 만들기 TIL(20)  (1) 2022.11.25
비밀번호 변경 , 내가 쓴 글 목록 불러오기 TIL(19)  (0) 2022.11.24
문제 해결TIL(17)  (0) 2022.11.22
TIL(16)  (0) 2022.11.21
프로젝트 계획TIL(15)  (0) 2022.11.18