password protected website template

암호화된 단일 페이지 웹사이트용 템플릿

이 템플릿 저장소를 사용하면 Github 페이지에서 호스팅되는 비밀번호로 보호된 페이지를 쉽게 만들 수 있습니다. 이는 생일, 결혼식, 기업 행사 등 모든 사람에게 공개되어서는 안 되는 정보나 이벤트에 유용할 수 있습니다.

데모를 확인하려면 비밀번호 test 사용하세요.

면책 조항 : 나(또는 종속성)가 뭔가를 놓쳤을 수도 있으므로 이것이 방탄이라고 가정하지 마십시오. 이런 식으로 은행 정보 등을 공유하지 마십시오.

용법

• use this template 버튼을 클릭하여 템플릿에서 저장소를 생성하세요.
• 저장소 이름을 선택하세요(URL은 {GITHUB-ACCOUNT-NAME}.github.io/{REPOSITORY-NAME} 입니다)
• 사람들이 비밀번호 없이 콘텐츠에 접근할 수 없도록 하려면 저장소를 비공개 로 선택하세요.
• DECRYPTION_PASSPHRASE 라는 Github 비밀을 생성하고 value 원하는 비밀번호로 설정합니다(비밀번호 누락으로 인해 첫 번째 시도에서 CI 파이프라인이 실패한다는 점에 유의하세요).
• Github 페이지로 호스팅을 활성화하려면 게시 소스를 main 브랜치로 설정하세요.

웹사이트를 사용자 정의하려면:

• 로그인 페이지를 사용자 정의할 수 있습니다.

  • encrypt_with_assets.yml을 조정합니다. 즉, 제목, 지침 및 버튼 이름을 설정하는 "인덱스 암호화" 단계입니다.

    - name : Encrypt index
      run : >
        staticrypt index.html -p ${{ secrets.DECRYPTION_PASSPHRASE }} --short
        --template "password_template.html"
        --template-title "Login"
        --template-instructions "This is a test website, use the password 'test' to enter."
        --template-button "Open Page"
        --template-color-primary "#113e9f"
        --template-color-secondary "#e4e4e4"

  • 자세한 내용과 전체 레이아웃을 변경하려면 StatiCrypt를 참조하세요.

• 암호화 후 방문자에게 표시될 main.html 편집합니다(호스팅되는 암호화된 버전은 index.html 입니다).

  • 자산은 평소와 같이 사용할 수 있으며 암호화되지 않습니다.

암호화된 자산

encrypt_with_assets.yml 워크플로가 활성화되어 있으므로 기본적으로 자산 암호화가 활성화됩니다. 이는 HTML 문서의 직접 연결된 모든 이미지, CSS 및 JavaScript 파일만 내부 base64 표현으로 대체한다는 점에 유의하세요. 따라서 파일의 상대 링크는 위치가 변경되었기 때문에 더 이상 작동하지 않을 수 있습니다.

자산을 암호화하고 싶지 않은 경우

• _config.yml 의 exclude 항목에서 자산 폴더를 제거하고,
• encrypt_with_assets.yml encrypt_with_assets._yml 로 변경
• encrypt_without_assets._yml 이름을 encrypt_with_assets.yml 로 바꿉니다.

로컬 사용법

개인 저장소에 데이터를 보관하고 싶지 않다면 로컬로 변환하고 나중에 index.html 만 업로드할 수도 있습니다. 이렇게 하려면 다음 단계를 따르세요.

• 이미지 빌드

   docker build -t ppw .
  

• 암호화 실행

   docker run -it --rm --name ppw -e PASSWORD=test --mount type=bind,source=${PWD},target=/code ppw
  

• main.html 변경 사항 무시

   git update-index --skip-worktree main.html
  

  선택적으로 자산에도 동일한 작업이 필요합니다.

크레딧

• 암호화는 StatiCrypt에 의해 이루어집니다: MIT 라이센스
• 우리는 staticrypt-github-actions의 작업 흐름을 기본으로 사용합니다: MIT 라이선스
• 우리는 예제(데모) 중 하나를 포함하여 Bootstrap을 사용합니다: MIT 라이센스
• 이미지 MIME 유형을 결정하기 위해 6-4의 코드를 사용합니다: MIT 라이센스
• Github CSS 리본: MIT 라이센스를 사용합니다.