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 (21)
Hide whitespace changes
Inline Side-by-side
Showing
with 221 additions and 105 deletions
.gitlab-ci.yml
View file @ 44f79a70
......@@ -38,17 +38,19 @@ setup:
- 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:
- sed -i
-e "s|%%BRANCH%%|${CI_COMMIT_BRANCH}|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"
src/*.html
- 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:
......@@ -68,31 +70,53 @@ review:
pages:
extends: .deploy
rules:
- if: $CI_COMMIT_BRANCH == 'custom-domain'
- if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH
# Purge all of this site's URLs from the Cloudflare cache
create-purge-json:
# 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 -en "{\n \"files\": [\n \"$CI_PAGES_URL/\"" > purge.json;
for d in $(find public/* -type d); do echo -en ",\n \"$CI_PAGES_URL/${d#public/}/\"" >> purge.json; done;
for f in $(find public -type f); do echo -en ",\n \"$CI_PAGES_URL/${f#public/}\"" >> purge.json; done;
echo -e "\n ]\n}" >> purge.json
- cat purge.json
# 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:
- purge.json
- 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:
README.md
View file @ 44f79a70
......@@ -2,29 +2,17 @@
---
Example plain HTML site using GitLab Pages and Environments.
Example plain HTML site using GitLab Pages and Environments, and Cloudflare Cache.
The Pages site is available at https://gitlab-tests.pages.codingallnight.com/pages-test
The Pages site is available at https://gitlab-tests.codingallnight.dev/pages-test/
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-pages/pages-test/-/environments?search=review
https://git.codingallnight.com/gitlab-tests/pages-test/-/environments?search=review
Learn more about GitLab Pages at https://pages.gitlab.io and the official
documentation https://docs.gitlab.com/ce/user/project/pages/.
## 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].
[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: )
purge-cache.gitlab-ci.yml
View file @ 44f79a70
# Purge the Cloudflare cache using the request body contained in purge.json
# 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
......@@ -12,14 +12,40 @@ purge-cache:
start_in: 3 minutes
needs:
- pipeline: $PARENT_PIPELINE_ID
job: create-purge-json
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:
- cat purge.json
# - >-
# 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
# 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:
src/cache-test-symlink.html 0 → 120000
View file @ 44f79a70
cache-test.html
\ No newline at end of file
src/cache-test.html
View file @ 44f79a70
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="GitLab Pages">
<title>Cache Test | %%PROJECT_TITLE%%</title>
<link rel="preload" href="style.css" as="style">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="navbar">
<a href="./">Homepage</a>
<a href="cache-test.html">Cache Test</a>
<a href="sub/">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</div>
<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.
<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 current site revision is <a href="%%PROJECT_URL%%/-/commit/%%COMMIT_SHA%%"><code>%%COMMIT_SHA%%</code></a> from %%COMMIT_TIMESTAMP%%.
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>
It was built in <a href="%%JOB_URL%%">Job %%JOB_ID%%</a> at %%JOB_TIMESTAMP%%.
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>
</body>
<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 0 → 100644
View file @ 44f79a70
src/gitlab-favicon.png

591 B

src/gitlab-logo.png 0 → 100644
View file @ 44f79a70
src/gitlab-logo.png

9.98 KiB

src/index.html
View file @ 44f79a70
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="GitLab Pages">
<title>%%PROJECT_TITLE%%</title>
<link rel="preload" href="style.css" as="style">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="navbar">
<a href="./">Homepage</a>
<a href="cache-test.html">Cache Test</a>
<a href="sub/">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</div>
<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>
......@@ -24,7 +27,8 @@
It was built on the <strong>%%BRANCH%%</strong> branch of the
<a href="%%PROJECT_URL%%"><strong>%%PROJECT_PATH%%</strong></a> project.
</p>
</body>
</main>
</body>
</html>
<!-- vi: set ts=2 sw=2 et ft=html: -->
src/sitemap.xml 0 → 100644
View file @ 44f79a70
<?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: -->
src/style.css
View file @ 44f79a70
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:*/
src/sub/index.html
View file @ 44f79a70
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="GitLab Pages">
<title>Subdirectory | %%PROJECT_TITLE%%</title>
<link rel="preload" href="../style.css" as="style">
<link rel="stylesheet" href="../style.css">
</head>
<body>
<div class="navbar">
<a href="../">Homepage</a>
<a href="../cache-test.html">Cache Test</a>
<a href="./">Subdirectory</a>
<a href="%%PROJECT_URL%%">Repository</a>
</div>
<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>
</body>
</main>
</body>
</html>
<!-- vi: set ts=2 sw=2 et ft=html: -->