6달 전 · 익명 님의 질문
개인 프로젝트 피드백 부탁드립니다!! (Next.js + firebase)
안녕하세요! 휴학 중에 개인 프로젝트 한번 만들어봤습니다! 아직 감이 잘 안 잡히다보니 chatGPT에 꽤나 의존했던 것 같습니다. 폴더 구조와 ssr, csr 사용 부분에서 피드백을 받고자 합니다! 또, containers 폴더 안 create 폴더에 있는 RouteChangeListener.tsx를 사용하여 퀴즈를 만들거나 푸는 도중에 현재 페이지를 벗어나려는 움직임을 감지하면 alert 창이 나오도록 설정하였습니다. 제가 생각해봤을 때 페이지가 이동했다가 다시 돌아오는 부분이 비효율적이라고 생각이 들어서 미들웨어나 다른 방법을 통해 해결할 수 있는지 여쭤보고 싶습니다. 감사합니다! 프로젝트 설명 : 퀴즈를 만들고 풀 수 있는 웹페이지 만들어봤습니다! vercel로 배포하였고, PWA 사용하여 모바일에서도 다운로드 가능하게 했습니다! 웹 앱 둘다 가능하지만 웹으로 봐주시는 것을 권장드립니다~!! 프로젝트 기술 스택: Next.js, react-query, zustand, firebase 테스트 아이디: 123@naver.com 테스트 비밀번호: 123123 GitHub 주소 : https://github.com/kmj0973/donquiz Vercel 배포 주소 : https://donquiz.vercel.app/ 따끔한 피드백 주시면 감사드리겠습니다!! 감사합니다!!
개발자
#react
#개인-프로젝트
#next.js
#firebase
#react-query
답변 0
댓글 0
추천해요 2
조회 92
7달 전 · 최선호 님의 질문 업데이트
docker에 redis 오류 질문드립니다
안녕하세요 현재 개인프로젝트를 진행하고있습니다. 문제가 있는데, docker에서 app(springboot) + mysql + redis container를 만들어서 docker-compose.yml로 띄운후 localhost:8080 접속시 <오류 내용> Caused by: io.netty.channel.AbstractChannel$AnnotatedConnectException: Connection refused: localhost/127.0.0.1:6379 Caused by: java.net.ConnectException: Connection refused 이렇게 오류가 발생하는데 자꾸 redis가 localhost로 뜨는데 docker-compose 설정에는 문제가 없어보이는데 한번 봐주시면 감사하겠습니다 1. docker-compose.yml - db 접속정보와 redis 비밀번호는 지우고 코드를 올렸습니다 - redis 비밀번호는 서버에서 확인했습니다. - redis-cli 명령어로 ping-pong 확인했습니다. - app안에 redis와 db(mysql) 같은 네트워크 보고있음 확인했습니다. - 외부 접속 허용하기 위해 redis,.conf 에 bind 0.0.0.0수정 확인했습니다. - 맥 방화벽도 껐습니다. 2. application.properties -redis 설정정보에 ${SPRING_REDIS_PORT:6379} 이렇게 바인딩도 해봤습니다 -db접속 되는지 확인해봤습니다 아래의 코드를 첨부했습니다. 구글 검색과 gpt검색으로 해결방안 전부 시도해봤지만 자꾸 localhost로 뜨니까 진척도 없고 답답합니다... docker를 처음 사용해보는거라 부족한점이 많은데 어떤 부분에 이해도가 필요한지 봐주시면 정말 감사하겠습니다.
개발자
#springboot
#redis
#docker
#mysql
답변 0
댓글 0
조회 171
9달 전 · 김영민 님의 새로운 답변
비밀번호검증 질문 (백엔드 프론트엔드 연동 )
저는 컴퓨터공학과 학생이지만 개발이 처음입니다. 프론트엔드를 맡아 리액트 네이티브 앱을 개발하는 중입니다. 기초 지식은 있지만 학교 수업만 들어봤기 때문에 실제로 서비스를 어떻게 만드는지는 몰라, 이번 프로젝트에서는 사실상 GPT가 다 짜줬다고 해도 무방한 정도였어요. 프로젝트가 거의 다 끝나가는데, 백에서 비밀번호에 암호화를 걸면서 수정사항이 생겼습니다. if (existingProfile.password !== profile.oldPassword) { Alert.alert('비밀번호 오류', '기존 비밀번호가 올바르지 않습니다.'); return; } 기존에는 위와 같이 단순하게 비교를 했었는데, 백에서 암호화가 되어버려서 저런 단순한 로직을 사용할 수 없게 되었습니다. 대신 백에서 currentPassword(클라이언트에서 입력받은 비밀번호), getPassword함수(암호화되지 않은 사용자 계정의 기존 비밀번호를 받아오는 함수)를 bcrypt를 이용해서 알아서 다 처리하도록 코드를 다 짜주셨다고 하더라고요. 백엔드 코드는 사진으로 올려두었는데, if (passwordEncoder.matches(currentPassword, user.getPassword()))를 통해서 두 비밀번호가 일치하는 경우에만 정보가 수정되도록 코드가 작성되어 있습니다. 로직은 충분히 이해가 가는데, 이를 프론트엔드 코드에 어떻게 적용해야하는지 전혀 모르겠습니다. 구글링을 어떻게 해야 이런 경우의 풀이가 나오는지도 모르겠고, 찾아봐도 백엔드에서 암호화를 하는 방법이나 해시를 하는 방법 같은 것만 나오네요. 이 문제를 해결하기 위해 일주일 내내 노트북만 붙잡고 있었는데 멘탈만 부서지고, 코드는 아무것도 나아지지 않았습니다. 부디 많은 조언과 도움 부탁드립니다.
개발자
#비밀번호
#프론트엔드
#react-native
#front-end
#javascript
답변 1
댓글 0
조회 184
일 년 전 · cozy 님의 새로운 답변
스프링부트에서 클린코드 사용 관련 질문
안녕하세요 선생님들 현업에서는 정말 아무 생각없이 사용하고 있는 개발 방식이었는데 클린 코드라는 책을 접하면서 고민이 되는 부분이 하나 있습니다. SpringBoot ServiceImpl 구현 부분에서 만약 로그인 API를 개발한다는 가정하에, 로그인 API 에는 수많은 기능들이 포함될 수 있습니다.(유효성 검증, 비밀번호 5회 연속 시 잠금, 권한에 따른 페이지 이동 기능 등등) 하지만 클린 코드의 원칙 상 '되도록 하나의 메소드는 하나의 기능만을 포함한다.' 라는 원칙에 위배되기 때문에 각각의 기능을 분리하여 작성하는 것이 맞을듯 합니다. 그러나 각각의 수많은 부가기능(이 될수도 있는)들을 만들면 인터페이스와 클래스의 개수도 그만큼 늘어나게 되고 개발에 소요되는 시간도 늘어납니다. 실제로 제가 있었던 SI회사에서는 하나의 큰 기능(로그인 API) 자체를 기준으로 메소드를 만들고 부가 기능들을 모두 하나로 구현하였습니다. SI 특성 상 마감시간 내에 빨리 완성시켜주고 빠지면 땡이기 때문에 이런 것이라 생각되는데 만약 시간적인 압박이 있는 SI개발에서 두 부분중 어떤 원칙을 지키는 것이 효율적인지에 대한 고민이 되는데 길을 좀 알려주시면 감사드리겠습니다.
개발자
#스프링부트
답변 1
댓글 0
추천해요 1
조회 117
일 년 전 · Jake 님의 답변 업데이트
안드로이드 setBackgroundResource 적용이 안됩니다
로그인 기능에서 아이디와 비밀번호 EditText에서 값을 입력받고, 두 EditText 모두 값이 입력이 되면 버튼의 Background를 변경하고 싶어 코드를 이렇게 작성하였습니다. 그러나 setBackgroundResource가 작동되지 않는 것인지, 버튼의 색상이 변경되지 않습니다. 제가 작성한 코드가 제가 구현하고 싶은 것과 맞는 코드인지, background가 변경되지 않는 현상을 고치는 방법은 없을지 궁금합니다
개발자
#android
#kotlin
#xml
#background
답변 1
댓글 0
조회 57
일 년 전 · 프레드윰 님의 답변 업데이트
안드로이드 스튜디오에서 메일전송기능 구현하는법
안녕하세요 이번에 3학년 올라가는 컴공 학부생입니다. 방학동안 안드로이드 프론트엔드 공부를 하면서 동기들과 프로젝트로 앱을 하나 만들고있습니다. 코틀린을 사용해서 문의하기 기능을 만드는 중인데 인텐트를 사용하지 않고 문의 제목은 메일 제목으로, 문의 내용은 메일 내용으로 전송하는 방법을 찾고있습니다. 구글 검색을 해보니 smtp가 뭔지는 잘 모르겠지만 그걸로 구현이 가능한 것 같은데 글들이 최소 2년전 자료들이어서 현재 쓰고있는 hedgehog 버전과 통용되지 않는것 같습니다. 그래도 과거글을 바탕으로 구현해보고 있는데 2가지 문제가 발생했습니다. 1. Zendesk Auth 사이트에서 구글메일 보안비밀번호를 확인할수있다고 하는데 확인이 되지 않습니다. 2. 구글에서 지원하는 smtp 정보를 받아와서 MimeMessage 객체에 전달하는 과정에서 getDefaultInstance의 authenticator 부분에 javax.mail의 Authenticator를 상속받은 this를 넣었는데 FATAL EXCEPTION: DefaultDispatcher-worker-1 javax.mail.AuthenticationFailedException 오류가 발생했습니다. 스택오버플로우를 찾아보니 새로운 애뮬레이터를 만들라는 말이 있어서 해봤는데 실패했습니다. 구글신께 도움을 구해보려다 실패해서 여기에 올립니다!
개발자
#android
#androidstudio
#kotlin
답변 1
댓글 0
조회 158
일 년 전 · 차돌박이 님의 질문
Springboot 환경의 암복호화 질문
민감정보인 비밀번호의 경우 스프링 시큐리티가 제공해주는 password encoder를 써서 단방향 암호화를 한 뒤 일치여부를 체크하면 되지만 이름, 전화번호같이 다시 복호화해서 보여줄 필요가 있는 데이터들은 보통 어떤 라이브러리를 이용해서 처리들 하시는지 궁금합니다. @Bean public StandardPBEStringEncryptor jasyptStringEncryptor() { StandardPBEStringEncryptor encryptor = new StandardPBEStringEncryptor(); encryptor.setPassword(password); encryptor.setSaltGenerator(new StringFixedSaltGenerator(salt)); return encryptor; } 지금 만들고있는 사이드 프로젝트에서는 jasypt 라이브러리의 StandardPBEStringEncryptor를 사용하여 salt값을 고정하여 사용중인데 맞는 방법인지 모르겠고.. jasypt에 대해 검색해보면 properties나 yml파일 암호화 관련된 이야기가 대부분이던데 혹시 엉뚱한 라이브러리를 사용하고있는건 아닌가 싶네요.. 다른 분들은 어떤걸 사용하시는지가 궁금해서 질문 드립니다.
개발자
#springboot
#spring-boot
#encode
#decode
답변 0
댓글 0
조회 89
일 년 전 · 장성호 님의 답변 업데이트
jwt 리플레시 토큰은 어디서 언제 데이터베이스에 저장할까요?
사수가 없는 상태에서 블로그 글들을 보고 어떻게 어떻게 jwt 토큰 발행까지 해냈습니다. 1차 로그인 하면 아이디 비밀번호를 받고 아이디로 검증후 토큰을 발급해서 웹페이지로 전달했는데요 블로그에는 그 추후의 로직에 대한 설명을 찾기가 어렵더라구요 ㅠ JwtTokenProvider 클래스에서 generateToken 메서드에서 에세스 토큰과 리플레시 토큰을 생성하는데 이때 데이터베이스에 이미 있는지 검사하고 저장하는건지? JwtAuthenticationFilter클래스에서 doFilter 메서드에서 저장하는지 그런데 이부분은 저같은 경우에는 GenericFilterBean 을 상속 받았는데 이런 방법을 사용하는 예시 에서는 UsernamePasswordAuthenticationFilter 을 상속받아서 사용하더라구요 지금 막힌 부분이 토큰이 DB에 저장을 어디서 하는지 그리고 아직 토큰유효가 끝나면 리플레시 토큰 요청과 검증후 에세스 재발급 이 남아 있습니다. 어떤 흐름으로 풀어야하는지 알려주세요 ㅠ
개발자
#jwt
#refreshtoken
답변 1
댓글 0
조회 1,297
일 년 전 · 강병진 님의 새로운 답변
리액트 로그인 jwt 구현중 나타나는 에러
제가 jwt를 통해서 로그인을 구현하고 있는데요. 서버에서 jwt토큰을 가져오면 그 토큰을 디코딩해서 사용하고 있습니다. 로그인 코드를 짜놓고 실행을 시키면 저렇게 에러 코드가 나오고 let payload = testGetCK.substring(testGetCK.indexOf('.')+1,testGetCK.lastIndexOf('.')); let dec = JSON.parse(base64.decode(payload)); console.log(dec.id); console.log(dec.nickname); 이부분을 지우면 화면이 잘 나타나게 되고 저상태로 아이디랑 비밀번호를 넣어 로그인 버튼을 누르면 jwt토큰이 잘 들어옵니다. 토큰이 들어온 상태서 다시 let payload = testGetCK.substring(testGetCK.indexOf('.')+1,testGetCK.lastIndexOf('.')); let dec = JSON.parse(base64.decode(payload)); console.log(dec.id); console.log(dec.nickname); 이 코드를 넣으면 작동이 되는데 예외 처리를 해서 작업을 해야하나요??..
개발자
#react
#로그인
#jwt토큰
#jwt로그인
#jwt
답변 1
댓글 0
조회 430
일 년 전 · 김도열 님의 답변 업데이트
웹 백엔드) Bcrypt를 이용하여 암호화 시 비밀번호 검증
사용중인 라이브러리: Express.js bcrypt mongoose 현재 진행중인 사내 웹 프로젝트내에 게시판을 만들려고 하는데 DC인사이드 처럼 게시글마다 비밀번호를 설정하도록 기능구현을 한 상태입니다. 비밀번호는 bcrypt를 이용해서 암호화를 진행했고 수정이나 삭제를 할 땐 비밀번호 검증 후 수정/삭제가 이뤄지도록 구현하고 있습니다. 패스워드가 bcrypt로 암호화되어 있기 때문에 수정의 경우 1. request body에 비밀번호를 보내서 백엔드에서 bcrypt.compare() 2. 비밀번호가 일치할 시 해당 게시글의 데이터를 response 3. response에서 받은 데이터를 기반으로 프론트 수정페이지에 보여준다음 4. 수정페이지 내용을 다시 PUT요청으로 수정하도록 구현되어 있습니다. 이 과정에서 API가 1. 비밀번호 검증용(GET) 2. 게시글 수정용(PUT) 이렇게 두가지가 필요한 상황이 되었는데, 비밀번호 검증 GET에서 질문이 생겼습니다. 기본적으로 GET과 DELETE요청은 request body를 가지지 않는게 규칙이라고 배웠습니다. 하지만 request body를 가지는 POST와 PUT은 그 의미가 생성/수정이라고 이해하고 있습니다. 그렇다고 비밀번호를 URL에 Query Params로 보내자니 보안상 문제가 되지않을까 걱정이 되구요... 1. GET 또는 DELETE요청에 request body를 포함하여 보낸다. - 현재 사용중인 방식이고 앞서 말한 규칙 때문에 수정을 고민중이며 구현, 사용상에 문제는 없었습니다. 2. POST 또는 PUT요청에 request body를 포함하여 보낸다. - 현재 고려중인 방식이고 의미적인 문제가 없다면 이렇게 사용하려고 합니다. 개발 자체를 공부해본지 얼마안된 개발어린이라 제 상식외의 문제가 발생하면 대처하기가 어렵네요..ㅜㅜ 위에 제시한 1, 2번 방법중 어떤게 더 Best Practice에 가까울까요? 더 좋은 방법이 있다면 의견도 제시해주시면 너무 감사하겠습니다. <(__)>
개발자
#express.js
#bcrypt
#node.js
답변 3
댓글 3
조회 97
일 년 전 · 초코칩 님의 새로운 답변
for문을 이용한 중복체크 방법
public MemberDTO doRegist() { sc.nextLine(); System.out.println("*****************************************************"); System.out.print("아이디를 입력하세요 : "); String id = sc.nextLine(); System.out.print("비밀번호를 입력하세요 : "); String pwd = sc.nextLine(); System.out.print("이름을 입력하세요 : "); String name = sc.nextLine(); System.out.print("나이를 입력하세요 : "); int age = sc.nextInt(); System.out.print("성별을 입력하세요 : "); char gender = sc.next().charAt(0); sc.nextLine(); System.out.print("핸드폰 번호를 입력하세요 : "); String phone = sc.nextLine(); System.out.print("이메일을 입력하세요 : "); String email = sc.nextLine(); System.out.println("*****************************************************"); MemberDTO user = null; if(answer == 'Y') { user = new MemberDTO(id, pwd, name, age, gender, phone, email); }else { System.out.println("로그인 페이지로 돌아갑니다."); mainLogin(); } return user; } 여기에 for 문으로 아이디 중복체크를 넣고 싶은데 어떻게 넣어야 할까요...ㅠㅠ...
개발자
#intellij-java
답변 1
댓글 0
보충이 필요해요 1
조회 163
일 년 전 · 익명 님의 질문 업데이트
IOS에서 추천비밀번호 막는방법
IOS 설정에있는 추천비밀번호를 입력이 안되게 막아야 하는데 어떻게 해야하나요 스립트나 제이쿼리로 막아야 합니다
개발자
#ios
#추천비밀번호
#자동완성
답변 0
댓글 0
조회 56
일 년 전 · 김하림 님의 새로운 답변
예외처리가 더 효율적인 코드
유저 로그인 관련 메서드를 구현하던 중, 예외처리 방법 두가지 중 어느 것이 더 효율적(가독성, 유지보수 측면 등등..)인지 여쭤보고 싶습니다 첫번째 방법: try문에 NotFoundException을 던지고, catch문에서 instanceof를 사용해서 예외의 타입을 확인하고 처리하기 async userLogin(nickname: string, password: string) { try { const user = await this.usersRepository.findOne({ where: { nickname } }); // console.log(user) if (user && (await bcrypt.compare(password, user.password))) { return user; } else { throw new NotFoundException('아이디 또는 비밀번호가 일치하지 않습니다.'); } } catch (e) { console.error(e); if (e instanceof NotFoundException) { throw e; // NotFoundException은 그대로 던지기 } else { throw new InternalServerErrorException('알 수 없는 오류'); } } } 두번째 방법: try문에서는 일반적인 Error객체를 던진 후 catch문에서 error.message를 확인하여 예외 유형을 판단하기 async userLogin(nickname: string, password: string) { try { const user = await this.usersRepository.findOne({ where: { nickname } }); // console.log(user) if (user && (await bcrypt.compare(password, user.password))) { return user; } else { throw new Error('아이디 또는 비밀번호가 일치하지 않습니다.'); } } catch (error) { if (error.message === '아이디 또는 비밀번호가 일치하지 않습니다.') { throw new NotFoundException('아이디 또는 비밀번호가 일치하지 않습니다.'); } else { // 다른 예외 처리 throw new InternalServerErrorException('알 수 없는 오류'); } } }
개발자
#node.js
#예외처리
답변 1
댓글 0
추천해요 1
조회 245
2년 전 · 익명 님의 질문
파이어베이스 이메일 인증 만료 메시지가 계속 뜨는데 같은 문제 겪으신 분 계신가요?
안녕하세요! 저는 현재 파이어베이스, 플러터 이용해서 웹앱을 개발 중입니다. 파이어베이스 auth 사용해서 회원가입과 로그인을 처리하고 있어요! 회원가입 시 userCredential.user!.sendEmailVerification() 메서드를 호출해 사용자의 메일 주소로 이메일 인증 메일을 보냅니다. 가끔 메일이 안 보내지는 일은 있었지만, 지금까지 잘 사용하고 있었는데, 갑자기 메일로 온 링크를 클릭했을 때 만료 메시지만 뜨기 시작했어요. 메시지 전문은 아래와 같아요. “이메일 인증 재시도 이메일 인증 요청이 만료되었거나 링크가 이미 사용되었습니다.” 추가로 확인해보니, 비밀번호 재설정 메일도 링크 클릭하니 만료되었다는 메시지가 뜨네요ㅠㅠ 2주 전에 파이어스토어 규칙 부분을 변경한 게 있는데, 그게 원인인가 싶어 모두 true로 설정 후 테스트해봐도 계속 문제가 발생합니다. 파이어베이스에서 보내주는 이메일 링크 클릭 시 뜨는 만료 메시지 해결 경험 있으시면 어떻게 해결하셨는지 공유해주시면 정말정말 감사하겠습니다..!!
개발자
#파이어베이스
#플러터
#이메일인증
#인증만료
#비밀번호재설정
답변 0
댓글 0
조회 96
2년 전 · mjm 님의 질문
exe파일 자동 로그인 보안에 대해서 궁금합니다.
안녕하세요. 간단한 앱을 exe파일로 배포하려고 하는데요. 만약 자동 로그인 서비스를 지원한다고 했을 때 유저의 아이디와 비밀번호 정보를 어딘가에 따로 저장해 놓고 불러와야 하는데 어떤 방식이 보안을 높이는 방법일까요.. 아무리 구글링 해봐도 관련 예제는 없어서 제 PC 카카오톡 exe파일 경로를 조금 뜯어 봤는데 pred(파일명) 파일 안에 "set_auto_login" 변수가 따로 있더군요. 이 변수 값을 통해 유저가 카카오톡을 실행 시켰을 때 자동 로그인 할지 안 할지 결정함을 예상할 수 있었습니다. 이때 자동 로그인을 한다고 가정 했을 때 결국에는 어딘가에 저장되어 있는 제 전화번호와 비밀번호 정보를 불러와야 합니다. 혹시 어떤 방식으로 제 정보를 저장하고 불러오는지 아시는 분 있을까요..?? 저장할 때 암호화는 당연히 진행하겠죠?? 암호화가 진행된다면 exe파일 내부에 public key도 어딘가에 존재하겠죠??? 조금 덧붙이자면 내부 파일 중 connect_conf 라는 파일이 존재했고 여기에 저장되어 있나 생각이 들긴 하는데 파일 형식이 뭔지 모르겠고 메모장으로 열어봐도 encoding이 되지 않은 상태로 뜹니다. 너무 궁금하네요.
개발자
#exe
#보안
답변 0
댓글 0
조회 137
2년 전 · 윪 님의 새로운 댓글
백엔드 협업 프로젝트 초반 진행
안녕하세요 지금 부트캠프에서 협업 프로젝트 진행 예정 중에 있습니다 첫 프로젝트라 규모가 작지만 시작을 어떻게 해야할지 고민이 되어서 질문합니다 회원 1. 이메일 비밀번호 입력하여 회원가입 API 2. 이메일 비밀번호 입력하여 접속하는 API 3. 접속된 유저 로그아웃 조회 1. 게시물 전체 조회하는 API 2. 작성자 이메일을 통해 특정 게시물들을 검색하는 API 3. 댓글을 조회하는 API 생성 1. 댓글을 새롭게 만들 수 있는 API 2. 게시물을 새롭게 만들 수 있는 API 수정 1. 기존 댓글의 글을 수정하는 API 2. 게시물을 새롭게 수정할 수 있는 API 삭제 1. 게시물을 삭제하는 API 2. 댓글을 삭제하는 API 심화 1. 이메일과 같이 댓글 좋아요를 할 수 있는 기능 해당 기능을 구현하는 것이고 팀원들과 분담도 마쳤습니다. 우선 DTO, Controller, Repository, ERD 등을 설계하려고 하는데 그 중에서 DTO가 우선이라고 생각하고 진행했습니다. 과정 중에 DTO와 ERD은 서로 같을 필요가 없다고 판단했고 처음부터 데이터베이스랑 연결하면 혼란이 올 것 같다고 생각했습니다. 그래서 DTO로 설계하고 테스트 코드로 확인 후 잘 동작한 다음 데이터 베이스와 연결을 하는게 좋을지 아니면 처음부터 데이터 베이스랑 연결하는 것이 좋을지 궁금합니다. 또한, 해당 설계를 먼저 하는 것보다 더 좋은 방법이 있는지도 궁금합니다. 대체로 어떤 순서로 진행되는지 조언을 받고 싶습니다!
개발자
#백엔드
#프로젝트
#spring
답변 3
댓글 3
추천해요 1
조회 536
2년 전 · 강명진 님의 질문
Nextjs13 route..
안녕하세요 nextjs와 springboot를이용하여 프로젝트를 진행하고 있습니다. 회원정보확인부분을 구현중인데 .. 로그인 page.js 에서 회원아이디와 비밀번호를 api-route.js 를 통해 post json 방식으로 넘겨주고 싶습니다.. 값을 어떻게 넘겨주어야 될까요..? 전혀 감이 오질 않습니다 ㅠㅠ
개발자
#nextjs
답변 0
댓글 0
조회 55
2년 전 · 고지완 님의 새로운 댓글
비로그인 서비스에서 유저를 특정하는 방법?
안녕하세요! 요즘 사이드 프로젝트로 비로그인 게시판 서비스를 기획하고 있습니다. 로그인이 있으면 아무래도 개인정보 처리 및 관리가 어렵기도 하고 유저 접근성도 떨어지다보니 한번도 구현해본 적은 없지만 비로그인 방식으로 서비스를 제공하려고 합니다. 게시판 서비스다보니 좋아요나 댓글 달기, 게시글 생성 및 수정 등의 유저 기능이 필요한데, 이때 유저를 로그인 없이 특정할 수 있는 방법이 궁금합니다. 현재는 ulid, ip, agent를 유저 정보가 필요한 기능을 수행할때마다 전달받아 이를 데이터베이스에 조회 후 없다면 저장하는 방식으로 수행하고 있습니다. 하지만, 이러면 동일한 유저가 다른 네트워크, 다른 브라우저에서 접속을 한다면 다른 유저로 인식을 하는 문제가 생기니 게시글 및 댓글을 작성할때는 간단한 비밀번호와 보여질 닉네임을 입력 받도록 구현해두었습니다. 현재까지는 개발 초기 단계라 문제가 없어 보..이긴..하지만 뭔가 찝찝하네요.. 디시인사이드 같은 경우도 비로그인 게시판이고 저와 비슷한 로직으로 구현이 되어있는 것 같은데 여전히 찝찝합니다. 특히 좋아요 기능 부분에서 이미 좋아요를 한 경우 이를 화면에서 보여주기 위해 유저를 특정할 필요가 있는데 좋아요는 비밀번호 등을 입력받을 수 없기에 역시 다른 환경에서는 동일한 유저를 인식하지 못하게 될 것 같습니다. 이를 어떤 식으로 해결해야할지.. 비로그인 서비스라면 이런 유저를 특정해야하는 부분들은 포기하는 것이 맞는지 선생님들의 의견을 구하고 싶습니다! 긴글 읽어주셔서 감사합니다! 의견 부탁드립니다!
개발자
#로그인
#비로그인
#게시판
답변 1
댓글 1
조회 996
2년 전 · 손희준 님의 질문
Android 앱에서 JWT를 저장할 때 SharedPreferences
안녕하세요. Android와 Spring을 공부하고 있는 주니어 개발자입니다. 다름이 아니라 서버에서 REST API(를 가장한 HTTP API)로 회원 서비스를 제공하려고 하는데요, 세션이 아닌 JWT 방식으로 인증하려고 합니다. 클라이언트에서 아이디와 비밀번호를 POST로 서버에 보내면 응답으로 JWT를 발급하려고 하는데요. 클라이언트가 웹일 경우 쿠키에 담아서 저장하면 된다던데, 클라이언트가 앱일 경우는 SharedPreferences에 담아 저장해도 보안상에 문제가 없을까요? 또한, 이에 관해 검색을 하다보니 나오는 자료가 별로 없던데, 혹시 제가 하려는 방식처럼 앱에 로그인 서비스를 제공하기 위해 서버를 별도로 구현하여 REST API로 제공하는 방식 자체가 안 좋은 방식인가요?
개발자
#android
#server
#jwt
#authentication
답변 0
댓글 0
조회 112
2년 전 · 커리어리 AI 봇 님의 새로운 답변
초보 개발 질문입니다. Spring Security를 사용해보려고 하는데 활용방법 있을까요?
환경 : Spring boot : 빠른 설정 추가를 위해서 사용합니다. jsp : jsp를 이용하지만 axios로 프론트-백엔드를 연결합니다. JPARepository : 쿼리 작성을 간편화 하기 위해 사용합니다. ORACLE : 사용하는 데이터 베이스 입니다. 하고 싶은 기능은 : Spring Security 를 통한 로그인, 로그인 시 jwt토큰 발급입니다. 로그인, 회원가입 기능을 구현중인데 Spring Security 라는 프레임워크가 있길래 사용해보려고합니다. 회원가입은 자체적으로 만들었는데 로그인 기능은 기존에 Controller - Service - DB 를 통해 DB에서 아이디, 비밀번호 일치하는지 확인하고 jsp를 이용했기 때문에 Session에 로그인 정보를 담아 주었습니다. 이번에는 axios를 통해 프론트엔드에서 요청을 보내면 서버에서 응답하는 방식을 사용해보려고합니다. (jsp + axios 입니다.) 그리고 로그인이 성공하면 jwt토큰을 발행해서 로그인을 유지시켜주려고 합니다. 그래서 대부분 Spring Security 와 jwt를 같이 사용하길래 저도 사용해보려고합니다. Spring Security를 사용하면 로그인, 인증, 토큰 관리 등을 더 편하게 사용할 수 있다고해서 사용해보려고하는데 Spring Security의 대표적으로 사용하는 기능은 또 무엇이 있을까요? 그리고 Spring Security를 사용하면 어떤 점에서 장점이 있을까요? 너무 부족한 질문들이라 죄송합니다. 답변해주시면 잘 참고하겠습니다.
개발자
#spring-security
#jwt
#spring-boot
답변 1
댓글 0
조회 225
2년 전 · 커리어리 AI 봇 님의 새로운 답변
리액트 라우팅을 이렇게 하는게 맞는지 모르겠습니다..
안녕하세요 독학 하고 있는 학생입니다.. 작은 프로젝트로 혼자서 홈페이지를 만들고 있습니다. 우선 로그인 페이지부터 만들고 있는데, 로그인페이지에는 아이디찾기 비밀번호찾기 등등 많은 페이지가 들어가더라구요.. 그래서 리액트 라우터를 공부하고 적용시켰습니다. 코드는 아래와 같습니다. 이렇게 해도 제가 원하는대로 로그인페이지에서 아이디 찾기 페이지로 이동하고 하는 것은 맞는데 App.js에 이렇게 주저리주저리 원하는 것을 다 넣어두면 나중에 전체적으로 페이지를 완성시켰을 때 App.js에 너무 방대한 내용이 들어가지않나..? 싶더라구요.. 그래서 중첩된 라우트도 찾아서 공부했는데 크흡..암만해도 적용이 안됩니다.. 그래서 그냥 이대로 홈페이지를 계속 만들어도 되는지,,아니면 저의 고민을 해결할 방법이 중첩된 라우트가 맞는지 알고싶습니다.. 맞다면 다시 공부해야겠죠 ㅜ.. 답변부탁드립니다 (_ _) import "./App.css"; import { Route, Routes } from "react-router-dom"; import WigTemplate from "./components/wigtemplate"; import FindId from "./components/findId"; import FindPwd from "./components/findPwd"; import SignIn from "./components/signIn"; import NotFound from "./components/notFound"; function App() { return ( <Routes> <Route path="/" element={<WigTemplate />} /> <Route path="/findId" element={<FindId />} /> <Route path="/findPwd" element={<FindPwd />} /> <Route path="/signIn" element={<SignIn />} /> <Route path="*" element={<NotFound />} /> </Routes> ); } export default App; ---------------------------------------------------------- import React from "react"; import styled from "styled-components"; import WigLoginButton from "./wigLoginButton"; import WigHeader from "./wigHeader"; import WigInput from "./wigInput"; import WigFind from "./wigFind"; const WigTemplateContainer = styled.div` height: 100vh; display: flex; align-items: center; justify-content: center; `; const WigTemplateBlock = styled.div` width: 500px; height: 600px; background: #d0ebff; border-radius: 80px; `; function WigTemplate() { return ( <WigTemplateContainer> <WigTemplateBlock> <WigHeader></WigHeader> <WigInput></WigInput> <WigFind></WigFind> <WigLoginButton></WigLoginButton> </WigTemplateBlock> </WigTemplateContainer> ); } export default WigTemplate; ------------------------------------------------------- import React from "react"; import styled from "styled-components"; import { RxDividerVertical } from "react-icons/rx"; import { Link } from "react-router-dom"; const FindBlock = styled.div` display: flex; justify-content: center; `; const ABlock = styled(Link)` color: black; font-size: 0.9rem; text-decoration: none; `; function WigFind() { return ( <FindBlock> <ABlock to="/findId">아이디 찾기</ABlock> <RxDividerVertical style={{ marginTop: "3px" }} /> <ABlock to="/findPwd">비밀번호 찾기</ABlock> <RxDividerVertical style={{ marginTop: "3px" }} /> <ABlock to="/signIn">회원가입</ABlock> </FindBlock> ); } export default WigFind;
개발자
#react
답변 2
댓글 3
조회 483
2년 전 · 커리어리 AI 봇 님의 새로운 답변
개발자 선생님들 도와주세요..
안녕하세요 초보개발자입니다 지금 구글로 코드 복붙하며 게시판 수정중인데 아예 똑같이 복붙 하였는데 저는 왜 이런 식으로 나올까요 도와주세요 .. ㅠㅠ 프로젝트 발표가 코앞인데.. 1번째사진은 작성자의 사진이고 2번째 사진이 제 출력 화면입니다... 코드는 댓글에 적어두겠습니다..도와주세요.. ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <!--부트스트랩은 어떤device로 접속하더라도 해상도에 맞게 알아서 설정되는 탬플릿이다. --> <meta name="viewport" content="width=device-width" , inital-scale="1"> <!--스타일시트를 참조, 주소는 css안에 부트스트랩.css--> <link rel="stylesheet" href="css/bootstrap.css"> <title>JSP 게시판 웹 사이트</title> </head> <body> <!-- 네비게이션 구현 네비게이션이라는 것은 하나의 웹사이트의 전반적인 구성을 보여주는 역할 --> <nav class="navbar navbar-default"> <!-- header부분을 먼저 구현해 주는데 홈페이지의 로고같은것을 담는 영역이라고 할 수 있다. --> <div class="navbar-header"> <!-- <1>웹사이트 외형 상의 제일 좌측 버튼을 생성해준다. data-target= 타겟명을 지정해주고--> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-exmaple="false"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <!-- 여긴 웹페이지의 로고 글자를 지정해준다. 클릭 시 main.jsp로 이동하게 해주는게 국룰 --> <a class="navbar-brand" href="main.jsp">JSP 게시판 웹 사이트</a> </div> <!-- 여기서 <1>에만든 버튼 내부의 데이터 타겟과 div id가 일치해야한다. --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <!-- div 내부에 ul은 하나의 어떠한 리스트를 보여줄때 사용 --> <ul class="nav navbar-nav"> <!-- 리스트 내부에 li로 원소를 구현 메인으로 이동하게만들고--> <li><a href="main.jsp">메인</a></li> <!-- 게시판으로 이동하게 만든다. --> <li><a href="bbs.jsp">게시판</a></li> </ul> <!-- 리스트 하나 더 생성 웹페이지 화면에서 우측 부분--> <ul class="nav navbar-nav navbar-right"> <!-- 원소를 하나 구현해 준다. 네비게이션 우측 슬라이드메뉴 구현 --> <li class="dropdown"> <!-- 안에 a태그를 하나 삽입한다. href="#"은 링크없음을 표시한다. --> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">접속하기<span class="caret"></span></a> <!--접속하기 아래에 드랍다운메뉴 생성 --> <ul class="dropdown-menu"> <!-- li class="active" 현재 선택된 홈페이지를 의미 --> <li><a href="login.jsp">로그인</a></li> <li class="active"><a href="join.jsp">회원가입</a></li> </ul> </li> </ul> </div> <!-- 네비게이션 바 구성 끝 --> </nav> <!-- 하나의 컨테이너처럼 감싸주는 역할 --> <div class="container"> <div class="col-lg-4"></div> <!-- 회원가입 폼은 위의 양식은 일치하며, 이제 내부 폼만 바꿔준다. --> <div class="col-lg-4"> <div class="jumbotron" style="padding-top: 20px;"> <!-- 양식 삽입 post는 회원가입이나 로그인같이 어떠한 정보값을 숨기면서 보내는 메소드/ 로그인 Action페이지로 정보를보내겠다--> <form method="post" action="joinAction.jsp"> <!-- 회원 가입에 맞게 위에 액션은 joinAction페이지로 밑에 제목은 회원가입 화면으로 변경 --> <h3 style="text-align: center;">회원가입 화면</h3> <div class="form-group"> <!-- 회원 가입에서도 userID or userPassword는 동일하게 가져가고, 회원가입에 필요한 나머지 속성추가 --> <input type="text" class="form-control" placeholder="아이디" name="userID" maxlength="20"> </div> <div class="form-group"> <input type="password" class="form-control" placeholder="비밀번호" name="userPassword" maxlength="20"> </div> <!-- userName 추가 --> <div class="form-group"> <input type="text" class="form-control" placeholder="이름" name="userName" maxlength="20"> </div> <!-- 성별 선택 추가 --> <div class="form-group" style="text-align: center;"> <!-- 버튼 공간을 따로 마련해준다.(남,녀) --> <div class="btn-group" data-toggle="buttons"> <!-- 선택이 된곳에 표시를 하는 active를 설정해준다. --> <label class="btn btn-primary active"> <input type="radio" name="userGender" autocomplete="off" value="남자" checked>남자 </label> <label class="btn btn-primary"> <input type="radio" name="userGender" autocomplete="off" value="여자" checked>여자 </label> </div> <!-- 성별 선택부분 완료 --> </div> <!-- email 작성부분 구현 --> <div class="form-group"> <!-- placeholder는 아무런 입력이 없을때 띄워주는 값 --> <input type="email" class="form-control" placeholder="이메일" name="userEmail" maxlength="20"> </div> <!-- 버튼 또한 회원가입으로 value변경 --> <input type="submit" class="btn btn-primary form-control" value="회원가입"> </form> </div> </div> <div class="col-lg-4"></div> </div> <!-- 애니메이션을 담당하게 될 자바스크립트 참조 --> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <!-- 특정홈페이지에서 제이쿼리 호출 --> <script src="js/bootstrap.js"></script> </body> </html>
개발자
#jsp
#java
답변 2
댓글 4
보충이 필요해요 3
조회 387
2년 전 · 프레드윰 님의 답변 업데이트
ssh 키 등록해도 깃 연결이 안되네여..
mac 에서 gitlab 관련 진행하고 있는 프로젝트에 클론할려고 ssh 키 만들고 등록했는데도 계속 비밀번호 입력 , permission denied 뜨는데 이유가 뭘까요.. 윈도우에서 하면 정상적으로 되서, 제 맥 설정 문제인거 같은데.. 혹시 도와주실분 있나요ㅠ
개발자
#git
답변 1
댓글 0
조회 118
2년 전 · 호빵 님의 답변 업데이트
비밀번호 암호화 할때 복호화가능한 방법 (이전 비밀번호 내용 저장or양방향암호화)
안녕하세요 2달차 신입 자바개발자입니다. 현재 spring boot로 거래소 api를 만들려고 하는데, 비밀번호 암호화에 대해 궁금한 점이 있습니다. JWT+PasswordEncoder를 통해서 비밀번호 암호화해서 db에 저장하는데 복호화가 불가능한 상황입니다. 그런데 기획 상으로 '비밀번호 재설정 유의사항 1. 이전 *회 동안 사용한 비밀번호는 사용 금지' 2. 생일, 전화번호 등 추측하기 쉬운 번호 금지' 라고 되어있는데, 사용자가 지정한 비밀번호를 알아야 기록을 남길 텐데 어떤 프레임워크나 스택을 써야할지 모르겠습니다. 노드 코인 주소를 저장할때도 암호화해서 저장했다가 내보낼때는 복호화해서 내보내야 한다고 하는데 비슷한 기능을 사용하면 될 것같은데 혹시 어떤 기능을 써야할지 추천 부탁드리면 너무 감사드리겠습니다.
개발자
#복호화
#springboot
#java
#비밀번호
#양방향-암호화
답변 2
댓글 0
추천해요 1
조회 755
3년 전 · 기린낙타오리 님의 새로운 댓글
로컬 환경에서 외부 사이트 로그인 인증 질문입니다 !
nodejs - axios - express - cors 안녕하세요 올해 컴공으로 전과하게되어 웹 프론트엔드를 바라보고 공부중인 3학년 학생입니다. 다름이아니라 간단하게 학교 홈페이지에서 식단 리스트를 받아와 데이터베이스에 저장 후 한 주의 학식과 기숙사 식당의 메뉴를 보여주는 웹 사이트를 만드는 중입니다만... 학교 홈페이지에는 재학생만 접근이 가능하여 nodejs 서버에서 제 아이디와 비밀번호로 post 요청을 보냈고 response 헤더에는 status 200이 나타나는데 메뉴 페이지에 get 요청을 보내면 세션이 만료되었다는 응답과 응답 헤더에는 connection: 'close'로 나타납니다. 그래서 인증 문제인가싶어 로그인 요청 후 받은 cookie값을 변수에 저장하고 get 요청에 담아 보냈지만 결과는 같았습니다. post 요청 이후 get 요청을 하도록 비동기 처리했습니다. 지금 화장실에서 글을 쓰느라 코드를 적지 못하는점 양해 부탁드립니다 ㅠㅠ... +아 혹시 포스트맨에서 로그인 요청시에는 쿠키 값이 총 세개가 있었는데 나머지 두개가 인증에 관한 것인지 찾아보겠습니다. ++ 로그인 요청시 받은 쿠키입니다 cookie : { 세션아이디 httpOnly : true, sameSite : 'none', maxAge : 5300000, secure : true, httpOnly : true },
개발자
답변 1
댓글 1
추천해요 3
조회 215
3년 전 · 조재건 님의 새로운 댓글
인증 실패시 http status code
로그인 요청이나 휴대폰 인증같은 요청을 할때, 잘못된 비밀번호, 인증번호를 보낸 경우에는 어떤 상태코드가 맞을까요? 401이라고 많이 하는 것 같은데, 401은 인증정보를 가지고 있지 않은 사용자가 인증을 필요로하는 요청을 할때 인증되지 않았으니 이후 진행 불가! 하면서 내려주는 것으로 생각하고 있어서요.. 개인적으로는 409가 적절하지 않을까 싶긴 한데, 저장된 비밀번호(서버의 상태)와 충돌이 일어났다고 생각할 수 있지 않을까요? 혹은, 아이디+비밀번호를 보내서 인증정보를 내려주는 api을 로그인이라고 하면, 아이디+비밀번호 또한 인증정보라서 인증 실패다! 하면서 401을 내려준다는 원리인가요?
개발자
#백엔드
답변 2
댓글 1
추천해요 2
조회 1,153
3년 전 · 김희지 님의 새로운 댓글
스프링시큐리티 질문
스프링시큐리티를 스프링부트 내에서 프론트엔드, 백엔드 모드 구현하렸을 때는 문제가 없었는데 프론트엔드를 리액트로 바꾸고 떼어냈습니다. 로그인은 되는데 principal 이 anonymius 값으로 뜹니다. 이유를 알 수 있나요? 프론트에서 백엔드로 아이디, 비밀번호 외에 다른 것도 보내야 하나요? 백인드는 전과 동일합니다
개발자
#백엔드
#프론트엔드
답변 1
댓글 1
추천해요 3
조회 295
3년 전 · 삭제된 사용자 님의 새로운 답변
네이버 비밀번호 찾으려면 어디에 문의해야되요???
제.곧.내
개발자
답변 1
댓글 0
보충이 필요해요 1
조회 270