TIL

김재익·2023년 6월 8일
0

TIL

목록 보기
3/42
post-thumbnail

방명록 비밀번호 암호화필요
중복코드가 몇개 있어서 제거 해야함
실시간 방명록 업데이트

  • bcrypt를 이용해서 해시코드로 암호화했음
  • 비교하는 부분이 중복코드가 발생해 함수로 만들었고 프론트 부분에 방명록 태그가 방명록 저장에도 사용되고 첫 화면 보여줄 때도 사용되어서 함수화 하였음
  • 웹소켓을 이용해서 실시간 업데이트를 해봤지만 너무 어려워서 포기
  • setInterval로 첫화면 방명록 생성하는 함수 계속 돌려서 list 길이 변화 생기면 생성하도록 만듬

bcrypt.hashpw(pw_receive.encode("utf-8"), bcrypt.gensalt())
def checkpassword(inputpw, userpw):
    if bcrypt.checkpw(inputpw.encode("utf-8"), userpw):
        result = True
    else:
        result = False

    return result

간단하게 변환 비교가 된다 함수화 하여 중복코드를 제거함

function guestbook_shape(name, own_uuid, guestbook) {
	return `
    <div id="${own_uuid}">
		<p>${name}</p>
		<p class="guestbook">${guestbook}</p>
        <div id="edit-guestbook-${own_uuid}" style="display: none">
        	<input id="edit-guestbook-text-${own_uuid}" type="text" />
            <input id="guestbook-password-${own_uuid}" type="text" placeholder="비밀번호"/>
            <button onclick="modify_guestbook('${own_uuid}')" type="button" class="btn btn-primary">저장</button>
            <button onclick="cancel_edit('${own_uuid}')" type="button" class="btn btn-primary">취소</button>
        </div>
        <button onclick="edit_guestbook('${own_uuid}', '${guestbook}')" type="button" class="btn btn-primary">수정</button>
        <button onclick="check_delete_guestbook('${own_uuid}')" type="button" class="btn btn-primary">삭제</button>
        <div id="delete-guestbook-${own_uuid}" style="display: none">
        	<input id="guestbook-password-${own_uuid}" type="text" placeholder="비밀번호"/>
            <button onclick="delete_guestbook('${own_uuid}')" type="button" class="btn btn-primary">확인</button>
            <button onclick="cancel_delete('${own_uuid}')" type="button" class="btn btn-primary">취소</button>
        </div>
	</div>`
}

두 곳에서 같은 모양이 필요해서 함수로 만들었음

function show_guestbook() {
    $('#comment-list').empty()
    let count = 0
    setInterval(() => {
        fetch("/guestbook_read")
            .then((res) => res.json())
            .then((response) => {
                let rows = response['users']
                console.log(rows.length, count)
                if (rows.length > count) {
                    for (let i = count; i < rows.length; i++) {
                        let a = rows[i]
                        let name = a['name']
                        let guestbook = a['guestbook']
                        let own_uuid = a['uuid']

                        let temp_html = guestbook_shape(name, own_uuid, guestbook)
                        $('#comment-list').prepend(temp_html)
                    }
                    count = rows.length
                }
            })
    }, 1000)
}
js도 색칠 안해주네...

가라지만 완성도 있다고 생각함. 내 최선인듯

암호화는 파이썬이라 그런가 좀 간단하게 잘 된거같음
복호화를 직접 안하고 그냥 라이브러리에 포함된 함수로 간단하게 비교를 할 수 있는게 좋은 것 같음
근데 이거 말고 다른 암호화가 있었던거같은데 그게 더 좋은지는 모르겠음
중복코드 제거하니까 줄수도 줄고 보기도 편해서 좋다
가라 실시간이지만 시간 간격을 1초로 해놔서 그런지 실시간 느낌 나긴한다.
웹소켓 공부를 좀 해봐야겠다..

profile
개발자호소인

0개의 댓글