오픈 소스, 오픈 도어: Hacktoberfest 4 마무리

4주간 연속 핵토버페스트를 진행한 끝에 드디어 승인된 PR 4개로 챌린지를 완료했습니다. 솔직히 말씀드리자면, 오픈 소스가 제가 익숙하지 않은 영역에서 벗어난 것처럼 느껴졌기 때문에 이 이벤트가 시작될 때 꽤 긴장했습니다. 하지만 작은 문제부터 시작하는 것이 자신감을 키우는 데 도움이 되었고, 곧 더 복잡한 문제를 해결해야겠다는 의욕이 생겼습니다. 제 생각에 이러한 추진력의 일부는 학생이었기 때문에 나온 것 같습니다. 개발자 커뮤니티에 기여하면서 실제 경험을 쌓을 수 있었습니다.

제 Hacktoberfest 여정에 대해 더 자세히 알고 싶으시다면 제 개인 페이지를 확인하세요. 각 PR 후에 제가 반성한 내용이 기록되어 있습니다. 그럼 더 이상 고민하지 말고 마지막 주 PR에 대해 살펴보겠습니다.

Mikochi 개요: 미니멀리스트 원격 파일 브라우저

Mikochi는 경량의 자체 호스팅 원격 파일 브라우저로, 개인 서버나 NAS(Network Attached Storage)에서 파일을 관리하는 사용자에게 이상적입니다. 이 도구를 사용하면 사용자는 원격 디렉터리를 쉽게 탐색하고, 파일 업로드, 다운로드, 이름 바꾸기, 삭제 등의 파일 관리 작업을 수행하고, 미디어 파일을 VLC 또는 MPV와 같은 플레이어로 직접 스트리밍할 수도 있습니다.

JavaScript/Preact로 구동되는 최신 웹 인터페이스와 Go/Gin의 API 백엔드로 구축된 Mikochi는 원격 파일 탐색을 위한 원활하고 응답성이 뛰어난 환경을 제공합니다.

내가 작업한 것

이번 프로젝트에서는 Mikochi의 사용자 제어 및 보안 강화와 관련된 문제를 다루었고, 애플리케이션 탐색 모음의 "로그아웃" 버튼을 통해 액세스할 수 있는 로그아웃 기능을 구현했습니다. 이 기능은 인증 토큰을 지우고 로그인 페이지로 리디렉션하여 사용자를 안전하게 로그아웃하도록 설계되었습니다. 프런트엔드에서 로그아웃 버튼은 새 /logout 엔드포인트에 대한 API 호출을 트리거하고, 로컬 저장소에서 JWT를 지우고, 페이지를 새로 고치거나 리디렉션하여 사용자가 완전히 로그아웃되었는지 확인합니다. 백엔드에서는 무효화된 토큰 목록에 토큰 ID를 추가하여 /logout 엔드포인트를 처리하는 논리를 구축했습니다. 이 목록은 JWT 인증 미들웨어에서 확인되어 무효화된 토큰이 포함된 요청이 403 응답과 함께 거부되는지 확인합니다. 이 추가 기능으로 Mikochi의 보안이 향상되어 사용자가 활성 세션을 제어하고 공유 또는 공용 장치에서 계정을 보호할 수 있습니다.

해결책

이번 PR에서는 Mikochi에 대한 보안 로그아웃 기능을 구현하여 프런트엔드 및 백엔드 요구 사항을 모두 해결하여 사용자 세션 제어를 향상시켰습니다. 프런트엔드에서는 /api/logout에 대한 API 호출을 처리하고 로컬 저장소에서 JWT를 지우는 로그아웃 구성 요소를 만들었습니다. 사용자가 "로그아웃"을 클릭하면 JWT가 제거되고, 로그아웃을 확인하기 위해 POST 요청이 백엔드로 전송되며, 페이지는 window.location.href를 사용하여 사용자를 기본 로그인 화면으로 리디렉션합니다. 백엔드에서는 ID 속성을 포함하도록 generateAuthToken()의 JWT 생성을 수정하여 토큰이 효과적으로 무효화되도록 했습니다. 그런 다음 무효화된 토큰 목록에 JWT ID를 추가하여 로그아웃 요청을 관리하기 위해 backend/auth/handlers.go에 핸들러를 추가했습니다. JWT 미들웨어는 각 요청을 확인하여 토큰이 무효화된 경우 액세스를 거부하고 403 응답을 반환합니다. 기능을 확인하기 위해 로그아웃 후 이전에 무효화된 토큰을 로컬 저장소에 다시 삽입하여 수동 테스트를 수행하여 재사용 시도가 실패하는지 확인하고 로그아웃 프로세스를 효과적으로 보호했습니다.

내 생각

나에게 이것은 백엔드와 프론트엔드 개발을 하나의 프로젝트로 혼합한 흥미로운 프로젝트였습니다. 프런트엔드에서 제가 해결한 문제는 상대적으로 간단했습니다. 로그아웃 버튼을 만들고 약간의 CSS를 사용하여 모양을 개선하는 것이었습니다. 한동안 React를 배워왔기 때문에 잠시 복습이 필요했지만 이미 소스에 있는 코드와 구성 요소를 이해하는 데 도움이 되었습니다.

백엔드에서 프로젝트 소유자는 나에게 친숙한 Docker를 사용하여 프로젝트를 컨테이너화했습니다. 하지만 가장 시간이 많이 걸리는 부분은 이 프로젝트의 백엔드 언어인 Go를 사용하여 작업하는 것이었습니다. 저는 Go에 대한 사전 경험이 없었지만 이 문제를 해결하면서 기능적인 수준까지 Go를 배울 수 있는 기회를 얻게 되었고 꽤 보람을 느꼈습니다.

위 내용은 오픈 소스, 오픈 도어: Hacktoberfest 4 마무리의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!