Building Password-Protected HTML Pages for Jekyll Site with Python in GitHub Actions🔒

∙ 4 mins read ∙ Tags: Github, Python, Jekyll, Markdown
Building Password-Protected HTML Pages for Jekyll Site with Python in GitHub Actions🔒

Building Password-Protected HTML Pages for Jekyll Site with Python in GitHub Actions

Jekyll is a static-site generator powered by Ruby, which converts markdown files into static HTML pages to be served via a web browser. We endeavor to create a password-protected site page (leveraging PageCrypt to encrypt the page source code and encase the encrypted payload into a decrytion HTML template).

One approach would be to generate the password-protected site page locally and commit it to remote GitHub repository, prompt the Jekyll page build action, and overwrite the specified page in the _sites with the password-protected HTML page. However, let us offload the password-protected HTML page generation too by incorporating Python scripting in the YAML workflow configuration.

GitHub Actions YAML File

# Sample workflow for building and deploying a Jekyll site to GitHub Pages
name: Deploy Jekyll with GitHub Pages dependencies preinstalled

on:
  # Runs on pushes targeting the default branch
  push:
    branches: ["master"]

  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
  contents: read
  pages: write
  id-token: write

# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
  group: "pages"
  cancel-in-progress: false

env:
  HOME_DIR: $(pwd)
jobs:
  # Build job
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3
      - name: Setup Pages
        uses: actions/configure-pages@v3
      - name: Build with Jekyll
        uses: actions/jekyll-build-pages@v1
        with:
          source: ./
          destination: ./_site
      - name: Set up Python 3.10
        uses: actions/setup-python@v5 
        with:
          python-version: '3.10'
      - name: Install Package Dependencies
      - run: pip install pycryptodome
      - name: Compose Password-Protected psoneliners.html Page
      - run: python encrypt.py $/_site/blog/psoneliners.html {YourPasswordHere}
      - name: Upload artifact
        uses: actions/upload-pages-artifact@v1

  # Deployment job
  deploy:
    environment:
      name: github-pages
      url: $
    runs-on: ubuntu-latest
    needs: build
    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v2

Steps

1. Place the decryptTemplate.html and encrypt.py files into the root of the repository. (Optional: customize the CSS/HTML properties (e.g. I specify a background image) or the encryption parameters such as cipher, number of iterations, hash algorithm).

2. The prebuilt action actions/jekyll-build-pages@v1 will build static HTML pages from markdown files and place them into the _site folder.

3. The actions/setup-python@v5 action installs any Python dependencies and executes encrypt.py to convert the targeted HTML page into an encrypted payload and encase it within the decryptTemplate.html template. The new HTML page replaces the targeted HTML page in the path ./_site:

python encrypt.py $/_site/blog/title-of-post.html {password}

Note: this approach exposes your password within the GitHub Actions workflow file in .github/workflows, so ensure that the personal site repository is set to private.

4. Deploy the site using the prebuilt action actions/deploy-pages@v2.

Could the password-protected site page be generated locally and pushed to GitHub?

Theoretically, yes, with the benefit of offline storage of the password to the page. However, the jekyll-build-pages@v1 action in the YAML file above renders the Markdown files into HTML files when a change is committed to the repository, so any static HTML files placed into ./_site/blog would be overwritten.

I’ve opted for the current approach to offload the password-protected site page build process to GitHub Actions.

Source

Comments 💬