password protected website template

Modèle pour site Web crypté à page unique

Ce référentiel de modèles facilite la création d'une page protégée par mot de passe hébergée sur les pages Github. Cela peut être utile pour des informations ou des événements qui ne devraient pas être accessibles à tout le monde, par exemple pour votre anniversaire, votre mariage ou un événement d'entreprise.

Pour vérifier la démo, utilisez le test de mot de passe .

Avis de non-responsabilité : sachez que moi (ou les dépendances) ai peut-être raté quelque chose, alors ne présumez pas que cela est à l'épreuve des balles. Ne partagez pas d’informations bancaires ou similaires de cette manière.

Usage

• Créez un référentiel à partir d'un modèle en cliquant sur le bouton use this template
• Sélectionnez un nom de référentiel (votre URL sera {GITHUB-ACCOUNT-NAME}.github.io/{REPOSITORY-NAME} )
• Choisissez que le référentiel soit privé , si vous ne voulez pas que les gens puissent accéder au contenu sans le mot de passe
• Créez un secret Github nommé DECRYPTION_PASSPHRASE et définissez la value sur le mot de passe souhaité (notez que le pipeline CI échouera à la première tentative en raison du mot de passe manquant)
• Définissez la source de publication sur la branche main afin d'activer l'hébergement avec Github Pages

Pour personnaliser le site Web :

• Vous pouvez personnaliser la page de connexion

  • ajustez le encrypt_with_assets.yml, c'est à dire l'étape "Encrypt index" pour définir le titre, les instructions et le nom du bouton

    - 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"

  • Pour plus de détails et pour modifier la mise en page complète, voir StatiCrypt

• Modifiez le main.html qui sera montré aux visiteurs après le cryptage (la version cryptée hébergée est index.html )

  • Les actifs peuvent être utilisés comme d'habitude et ne seront pas cryptés

Actifs cryptés

Par défaut, le chiffrement des actifs est activé, puisque le workflow encrypt_with_assets.yml est actif. Notez que cela remplace uniquement toutes les images directement liées, les fichiers CSS et JavaScript dans le document HTML par une représentation base64 sur place. Ainsi, vos liens relatifs dans les fichiers ne fonctionneront probablement plus, puisque leur emplacement a changé.

Si vous ne souhaitez pas chiffrer les actifs

• supprimez le dossier d'actifs des exclude du _config.yml ,
• encrypt_with_assets.yml à encrypt_with_assets._yml , et
• renommer encrypt_without_assets._yml en encrypt_with_assets.yml

Utilisation locale

Si vous ne souhaitez pas avoir (même) aucune de vos données dans un référentiel privé, vous pouvez également les convertir localement et télécharger le index.html uniquement par la suite. Pour ce faire, suivez ces étapes :

• Construire l'image

   docker build -t ppw .
  

• Exécutez le cryptage

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

• Ignorer les modifications apportées à main.html

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

  En option, la même chose est nécessaire pour vos actifs.

Crédits

• Le cryptage est réalisé par StatiCrypt : Licence MIT
• Nous utilisons le workflow de staticrypt-github-actions comme base : Licence MIT
• Nous utilisons Bootstrap, dont un de leurs exemples (démo) : MIT License
• Nous utilisons le code de six à quatre pour déterminer les types d'images MIME : Licence MIT
• Nous utilisons le ruban CSS Github : licence MIT