Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision

Target

Select target project
  • gitlab-tests/pages-test
  • gitlab-tests/subgroup-1/pages-test
  • gitlab-tests/subgroup-1/subgroup-1.1/pages-test
3 results
Select Git revision
Show changes
Commits on Source (60)
image: alpine:latest
# Only run pipelines for pushes on branches
workflow:
rules:
- if: $CI_COMMIT_BRANCH
# We can't do variable substitution in a job and then also use that computed
# variable in the Environment URL of the same job, so we have to do the
# substitution in an earlier stage. All of this variable substitution is only
# required for projects in sub-groups because GitLab doesn't have a predefined
# variable that contains the project namespace relative to the root namespace.
#
# For example, if the project path is "/group/subgroup-1" then we need just the
# "/subgroup-1" portion because that is used in the Environment URL path, while
# the "/group" root namespace is used as the subdomain.
setup:
stage: .pre
tags:
- docker
script:
- echo "ROOT_RELATIVE_NAMESPACE=${CI_PROJECT_NAMESPACE#$CI_PROJECT_ROOT_NAMESPACE}" >> build.env
artifacts:
reports:
dotenv: build.env
# We can't deploy multiple different variants of GitLab Pages sites (e.g. one
# per branch), so we use this workaround instead. GitLab has a special browsable
# URL for job artifacts on public projects, and we can create an Environment
# that points to that URL so it's easy for devs to know what the current
# Environment URL for their branch is.
.deploy:
stage: deploy
tags:
- docker
before_script:
- echo $CI_ENVIRONMENT_URL
- echo $ROOT_RELATIVE_NAMESPACE
- test "$ROOT_RELATIVE_NAMESPACE" == "${CI_PROJECT_NAMESPACE#$CI_PROJECT_ROOT_NAMESPACE}" || { echo "ROOT_RELATIVE_NAMESPACE is not set correctly" ; exit 1 ; }
script:
- find src/ -type f \( -iname '*.html' -or -iname 'sitemap.xml' \)
-exec sed -i
-e "s|%%BRANCH%%|${CI_COMMIT_BRANCH}|g"
-e "s|%%BASE_URL%%|${CI_PAGES_URL}|g"
-e "s|%%COMMIT_SHA%%|${CI_COMMIT_SHORT_SHA}|g"
-e "s|%%COMMIT_TIMESTAMP%%|${CI_COMMIT_TIMESTAMP}|g"
-e "s|%%JOB_ID%%|${CI_JOB_ID}|g"
-e "s|%%JOB_TIMESTAMP%%|${CI_JOB_STARTED_AT}|g"
-e "s|%%JOB_URL%%|${CI_JOB_URL}|g"
-e "s|%%PROJECT_PATH%%|${CI_PROJECT_PATH}|g"
-e "s|%%PROJECT_TITLE%%|${CI_PROJECT_TITLE}|g"
-e "s|%%PROJECT_URL%%|${CI_PROJECT_URL}|g"
{} +
- mv src public
artifacts:
paths:
- public/
# Deploy a review environment for any push to a branch that is not the default
# branch
review:
extends: .deploy
rules:
- if: $CI_COMMIT_BRANCH != $CI_DEFAULT_BRANCH
environment:
name: "review $CI_COMMIT_BRANCH"
url: "https://${CI_PROJECT_ROOT_NAMESPACE}.${CI_PAGES_DOMAIN}/-${ROOT_RELATIVE_NAMESPACE}/${CI_PROJECT_NAME}/-/jobs/$CI_JOB_ID/artifacts/public/index.html"
# Deploy to GitLab Pages for pushes on the default branch
pages:
extends: .deploy
rules:
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
# Create a list of URLs that need to be purged from the cache after GitLab Pages
# deployment. Each real file/directory has multiple URLs because the router for
# GitLab Pages fudges paths for better user experience. The fudging rules are:
# - Directories can be accessed with or without a trailing slash
# - Files can be accessed with or without a trailing slash
# - Files with the '.html' extension can be accessed with or without .html
create-purge-list:
stage: deploy
rules:
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
needs: ['pages']
tags:
- docker
script:
- echo 'Nothing to do...'
# Add the index-less homepage
- echo "$CI_PAGES_URL" > purge-list.txt
# Add all the HTML files and HTML symlinks, with and without .html extension
- |-
for f in $(find public/* \( -type f -or -type l \) -iname '*.html'); do
f="${f#public/}"
echo "$CI_PAGES_URL/$f" >> purge-list.txt
echo "$CI_PAGES_URL/${f%.html}" >> purge-list.txt
done
# Add everything else
- |-
for f in $(find public/* \( -type d -or -type f -or -type l \) -not -iname '*.html'); do
echo "$CI_PAGES_URL/${f#public/}" >> purge-list.txt
done
# Remove any duplicate URLs
- sort -u -o purge-list.txt purge-list.txt
# Duplicate each line, adding a trailing slash to the duplicates
- sed -i 'p;s|$|/|' purge-list.txt
artifacts:
paths:
- public
only:
- master
- purge-list.txt
trigger-cache-purge:
stage: .post
rules:
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
trigger:
include: purge-cache.gitlab-ci.yml
variables:
PARENT_PIPELINE_ID: $CI_PIPELINE_ID
CF_PURGE_CACHE_CHUNK_SIZE: 20
# vi: set ts=2 sw=2 et ft=yaml:
![Build Status](https://gitlab.com/pages/plain-html/badges/master/build.svg)
[![pipeline status](https://git.codingallnight.com/gitlab-tests/pages-test/badges/master/pipeline.svg)](https://git.codingallnight.com/gitlab-tests/pages-test/-/commits/master)
---
Example plain HTML site using GitLab Pages.
Example plain HTML site using GitLab Pages and Environments, and Cloudflare Cache.
Learn more about GitLab Pages at https://pages.gitlab.io and the official
documentation https://docs.gitlab.com/ce/user/project/pages/.
---
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents** *generated with [DocToc](https://github.com/thlorenz/doctoc)*
- [GitLab CI](#gitlab-ci)
- [GitLab User or Group Pages](#gitlab-user-or-group-pages)
- [Did you fork this project?](#did-you-fork-this-project)
- [Troubleshooting](#troubleshooting)
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
## GitLab CI
This project's static Pages are built by [GitLab CI][ci], following the steps
defined in [`.gitlab-ci.yml`](.gitlab-ci.yml):
The Pages site is available at https://gitlab-tests.codingallnight.dev/pages-test/
```
image: alpine:latest
The Environments are dynamic, changing every time a CI job is ran. However, you
can see the currently available ones here:
https://git.codingallnight.com/gitlab-tests/pages-test/-/environments?search=review
pages:
stage: deploy
script:
- echo 'Nothing to do...'
artifacts:
paths:
- public
only:
- master
```
The above example expects to put all your HTML files in the `public/` directory.
## GitLab User or Group Pages
To use this project as your user/group website, you will need one additional
step: just rename your project to `namespace.gitlab.io`, where `namespace` is
your `username` or `groupname`. This can be done by navigating to your
project's **Settings**.
Read more about [user/group Pages][userpages] and [project Pages][projpages].
## Did you fork this project?
If you forked this project for your own use, please go to your project's
**Settings** and remove the forking relationship, which won't be necessary
unless you want to contribute back to the upstream project.
Learn more about GitLab Pages at https://pages.gitlab.io and the official
documentation https://docs.gitlab.com/ce/user/project/pages/.
## Troubleshooting
1. CSS is missing! That means that you have wrongly set up the CSS URL in your
HTML files. Have a look at the [index.html] for an example.
[ci]: https://about.gitlab.com/gitlab-ci/
[index.html]: https://gitlab.com/pages/plain-html/blob/master/public/index.html
[userpages]: https://docs.gitlab.com/ce/user/project/pages/introduction.html#user-or-group-pages
[projpages]: https://docs.gitlab.com/ce/user/project/pages/introduction.html#project-pages
[_modeline]: # ( vi: set ts=4 sw=4 et wrap ft=markdown: )
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="GitLab Pages">
<title>Plain HTML site using GitLab Pages</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="navbar">
<a href="https://pages.gitlab.io/plain-html/">Plain HTML Example</a>
<a href="https://gitlab.com/pages/plain-html/">Repository</a>
<a href="https://gitlab.com/pages/">Other Examples</a>
</div>
<h1>Hello World!</h1>
<p>
This is a simple plain-HTML website on GitLab Pages, without any fancy static site generator.
</p>
</body>
</html>
# Purge the URLs contained in purge-list.txt from the Cloudflare cache
#
# We delay this job to give the pages:deploy job time to finish. If we don't
# delay, then the cache might refill with old pages before the new pages are
# finished deploying.
purge-cache:
tags:
- docker
rules:
- if: $CF_PURGE_CACHE_ZONE && $CF_PURGE_CACHE_TOKEN
when: delayed
start_in: 3 minutes
needs:
- pipeline: $PARENT_PIPELINE_ID
job: create-purge-list
before_script:
# Make sure the purge-list.txt file is readable, else exit
- test -r purge-list.txt || { echo "purge-list.txt not found" ; exit 1 ; }
- echo "Purge list has $(cat purge-list.txt | wc -l) URLs"
# Default to chunks of 30 URLs because Cloudflare only allows 30 URLs per
# purge request on free accounts
- echo "Chunk size of ${CF_PURGE_CACHE_CHUNK_SIZE:=30}"
script:
# Split the purge list into chunks named 'purge-chunk-[aaa,aab,...]'
- split -l $CF_PURGE_CACHE_CHUNK_SIZE -a 3 purge-list.txt purge-chunk-
- chunks=$(find . -type f -name 'purge-chunk-*' | wc -l)
# Loop over the chunks, creating a purge request for each
- |-
counter=0
for chunk in purge-chunk-* ; do
echo -e "\nChunk $((++counter))/$chunks"
# Create the purge request body
echo -en "{\n \"files\": [" > purge.json
unset comma # This needs to be unset for the first line in each chunk
while read path; do
echo -en "$comma\n \"$path\"" >> purge.json
comma=','
done < $chunk
echo -e "\n ]\n}" >> purge.json
cat purge.json
# Make the API request to Cloudflare to purge the URLs from cache
wget -qO- "https://api.cloudflare.com/client/v4/zones/$CF_PURGE_CACHE_ZONE/purge_cache" \
--header "Content-Type: application/json" \
--header "Authorization: Bearer $CF_PURGE_CACHE_TOKEN" \
--post-file purge.json
# Rate limit ourselves to 1 request per second
sleep 1
done
# vi: set ts=2 sw=2 et ft=yaml:
cache-test.html
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<base href="%%BASE_URL%%/">
<title>Cache Test | %%PROJECT_TITLE%%</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="gitlab-favicon.png">
<link rel="canonical" href="cache-test.html">
<link rel="preload" href="style.css" as="style">
<link rel="stylesheet" href="style.css">
<style>
img {
float: left;
margin-right: 1em;
}
.clearfix {
clear: both;
}
</style>
</head>
<body>
<header>
<a href="./">Homepage</a>
<a href="cache-test.html">Cache Test</a>
<a href="sub/">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</header>
<main>
<h1>Cache Test</h1>
<img src="gitlab-logo.png" alt="GitLab logo" width=200>
<p>
This page is meant for testing caching.
</p>
<p>
It was built on the <strong>%%BRANCH%%</strong> branch of the
<a href="%%PROJECT_URL%%"><strong>%%PROJECT_PATH%%</strong></a> project in
<a href="%%JOB_URL%%">Job %%JOB_ID%%</a> at %%JOB_TIMESTAMP%%.
</p>
<p>
The current site revision is
<a href="%%PROJECT_URL%%/-/commit/%%COMMIT_SHA%%"><code>%%COMMIT_SHA%%</code></a>
from %%COMMIT_TIMESTAMP%%.
</p>
<p>
Here's a static CSS file: <a href="style.css">style.css</a>
</p>
<p>
Here's a static image: <a href="gitlab-logo.png">gitlab-logo.png</a>
</p>
<p>
Here's a symlink to this same page: <a href="cache-test-symlink.html">cache-test-symlink.html</a>
</p>
<h2 class="clearfix">Path Fudging</h2>
<p>
The server for GitLab Pages does some path fudging to make user experience
better, but you have to make sure you account for that fudging when you
purge the cache by URLs. The fudging rules are:
</p>
<ul>
<li>Directories can be accessed with or without a trailing slash.</li>
<li>Files can be accessed with or without a trailing slash.</li>
<li>
Files with the <code>.html</code> extension can be accessed with or
without the file extension.
</li>
</ul>
<p>
So every HTML file has four URLs it can be accessed on, and every other
file and directory has two. Here are some examples:
</p>
<ul>
<li><a href="cache-test.html">cache-test.html</a>
<li><a href="cache-test">cache-test</a>
<li><a href="cache-test.html/">cache-test.html/</a>
<li><a href="cache-test/">cache-test/</a>
<li><a href="style.css">style.css</a>
<li><a href="style.css/">style.css/</a>
<li><a href="sub">sub</a>
<li><a href="sub/">sub/</a>
</ul>
</main>
</body>
</html>
<!-- vi: set ts=2 sw=2 et ft=html: -->
src/gitlab-favicon.png

591 B

src/gitlab-logo.png

9.98 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<base href="%%BASE_URL%%/">
<title>%%PROJECT_TITLE%%</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="gitlab-favicon.png">
<link rel="canonical" href="./">
<link rel="preload" href="style.css" as="style">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<a href="./">Homepage</a>
<a href="cache-test.html">Cache Test</a>
<a href="sub/">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</header>
<main>
<h1>Hello World!</h1>
<p>
This is a simple plain-HTML website on GitLab Pages, without any fancy static site generator.
</p>
<p>
It was built on the <strong>%%BRANCH%%</strong> branch of the
<a href="%%PROJECT_URL%%"><strong>%%PROJECT_PATH%%</strong></a> project.
</p>
</main>
</body>
</html>
<!-- vi: set ts=2 sw=2 et ft=html: -->
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>%%BASE_URL%%/</loc>
</url>
<url>
<loc>%%BASE_URL%%/cache-test.html</loc>
</url>
<url>
<loc>%%BASE_URL%%/sub/</loc>
</url>
</urlset>
<!-- vi: set ts=2 sw=2 et ft=xml: -->
body {
font-family: sans-serif;
margin: auto;
max-width: 1280px;
box-sizing: border-box;
margin: 0;
padding: 0;
font-family: monospace;
font-size: 14px;
}
.navbar {
header {
background-color: #313236;
border-radius: 2px;
max-width: 800px;
width: 100%;
}
.navbar a {
header a {
color: #aaa;
display: inline-block;
font-size: 15px;
padding: 10px;
padding: 0.5em;
text-decoration: none;
}
.navbar a:hover {
header a:hover {
color: #ffffff;
}
main {
padding: 0 1em;
}
/*vi: set ts=2 sw=2 et ft=css:*/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<base href="%%BASE_URL%%/">
<title>Subdirectory | %%PROJECT_TITLE%%</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="gitlab-favicon.png">
<link rel="canonical" href="sub/">
<link rel="preload" href="style.css" as="style">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<a href="./">Homepage</a>
<a href="cache-test.html">Cache Test</a>
<a href="sub/">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</header>
<main>
<h1>Subdirectory Page</h1>
<p>
This page is in a subdirectory.
</p>
</main>
</body>
</html>
<!-- vi: set ts=2 sw=2 et ft=html: -->