The Wiert Corner – irregular stream of stuff

Jeroen W. Pluimers on .NET, C#, Delphi, databases, and personal interests

  • My badges

  • Twitter Updates

  • My Flickr Stream

  • Pages

  • All categories

  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

    Join 1,861 other subscribers

Archive for the ‘Web Development’ Category

ropg/ipocalypse: FreeBSD jails with web servers on a single IPv4 address

Posted by jpluimers on 2022/08/04

Rob Gongrijp has this nice repository [Wayback/Archive.is] ropg/ipocalypse: FreeBSD jails with web servers on a single IPv4 address:

To deal with web servers (which all need to be reached at ports 80 (http) and 443 (https), I describe a convenient Apache reverse proxy setup in its own jail, and the management script I wrote to make things super-easy.

Via [Archive.is] ᖇ⦿ᖘ Gonggrijp on Twitter: “HOWTO for setting up a FreeBSD host with multiple jails running web servers on a single IPv4 address. (No rocket science: just a general HOWTO plus an easy certificate management / reverse proxy script which also works on other systems with adaptation.) … “

With an interesting response [Archive.is] corbosman on Twitter: “I use kubernetes/traefik pretty much like that, and before that docker/traefik. It’s getting more and more difficult to get IP space at all.… “

–jeroen

Posted in *nix, BSD, Development, Power User, Software Development, Web Development | Leave a Comment »

OWASP WebGoat repositories: Deliberately insecure JavaEE application to teach application security

Posted by jpluimers on 2022/08/02

Last year in OWASP top rated security “feature” A01:2021 – Broken Access Control, I promised to write more about how learn about OWASP documented and rated security vulnerabilities.

Today is the day you should start learning from [Wayback/Archive.is] Github: OWASP WebGoat:

Deliberately insecure JavaEE application to teach application security

It is a Java backend with a JavaScript/HTML frontend, but the vulnerabilities just as easily apply to other back-end stacks.

Repositories:

  1. [Wayback/Archive.is] WebGoat/WebGoat: WebGoat is a deliberately insecure application

    WebGoat is a deliberately insecure web application maintained by OWASP designed to teach web application security lessons.

    This program is a demonstration of common server-side application flaws. The exercises are intended to be used by people to learn about application security and penetration testing techniques.

    WARNING 1: While running this program your machine will be extremely vulnerable to attack. You should disconnect from the Internet while using this program. WebGoat’s default configuration binds to localhost to minimize the exposure.

    WARNING 2: This program is for educational purposes only. If you attempt these techniques without authorization, you are very likely to get caught. If you are caught engaging in unauthorized hacking, most companies will fire you. Claiming that you were doing security research will not work as that is the first thing that all hackers claim.

  2. [Wayback/Archive.is] WebGoat/WebGoat-Lessons: 7.x – The WebGoat STABLE lessons supplied by the WebGoat team.

    This repository contains all the lessons for the WebGoat container. Every lesson is packaged as a separate jar file which can be placed into a running WebGoat server.

  3. [Wayback/Archive.is] WebGoat/WebWolf (Can’t have a goat without a wolf, but I wonder where the cabbage is)
  4. [Wayback/Archive.is] WebGoat/WebGoat-Legacy: Legacy WebGoat 6.0 – Deliberately insecure JavaEE application
    This is the WebGoat Legacy version which is essentially the WebGoat 5 with a new UI.
    This program is a demonstration of common server-side application flaws. The exercises are intended to be used by people to learn about application penetration testing techniques.
  5. [Wayback/Archive.is] WebGoat/WebGoat-Archived-Releases: WebGoat 5.4 releases and older

    WebGoat 5.4 releases and older

  6. [Wayback/Archive.is] WebGoat/groovygoat: POC for dynamic groovy/thymeleaf based lesson system

    POC to demonstrate dynamic lessons with groovy controller/thymeleaf templates

They are by OWASP:

The Open Web Application Security Project (OWASP) is an online community that produces freely-available articles, methodologies, documentation, tools, and technologies in the field of web application security.[4][5]The Open Web Application Security Project (OWASP) provides free and open resources. It is led by a non-profit called The OWASP Foundation. The OWASP Top 10 – 2021 is the published result of recent research based on comprehensive data compiled from over 40 partner organizations.

Very important is the [Wayback/Archive.is] OWASP Top Ten Web Application Security Risks | OWASP:

The OWASP Top 10 is a standard awareness document for developers and web application security. It represents a broad consensus about the most critical security risks to web applications.

Globally recognized by developers as the first step towards more secure coding.

Companies should adopt this document and start the process of ensuring that their web applications minimize these risks. Using the OWASP Top 10 is perhaps the most effective first step towards changing the software development culture within your organization into one that produces more secure code.
Changes in the OWASP Top 10 between 2017 and 2021:

More OWASP repositories (including the [Wayback/Archive.is] OWASP/Top10: Official OWASP Top 10 Document Repository and [Wayback/Archive.is] OWASP/www-project-top-ten: OWASP Foundation Web Respository which seem to be at a 4-year update interval got updated in 2021) are at [Wayback/Archive.is] Github: OWASP.

Related: [Archive.is] Jeroen Wiert Pluimers on Twitter: “This so much sounds like German government IT-projects: …”

Via:

–jeroen

Posted in Authentication, CSS, Development, Encryption, HTML, Java Platform, JavaScript/ECMAScript, Pen Testing, Scripting, Security, Software Development, Web Development | Leave a Comment »

eidam/cf-workers-status-page: Monitor your websites, showcase status including daily history, and get Slack/Telegram/Discord notification whenever your website status changes. Using Cloudflare Workers, CRON Triggers, and KV storage.

Posted by jpluimers on 2022/07/26

Cool: [Wayback/Archive.is] eidam/cf-workers-status-page:

Monitor your websites, showcase status including daily history, and get Slack/Telegram/Discord notification whenever your website status changes. Using Cloudflare Workers, CRON Triggers, and KV storage

Will try this out in a while, hopefully before this actually reaches the front of the blog article queue (:

Via: [Wayback/Archive.is] Status Page – Scott Helme (via [Archive.is] Scott Helme on Twitter: “And yes, I’m also nervously watching my own status page 😅 …”).

Related blog post: One of the Let’s Encrypt’s Root Certificates expired today (and their corresponding intermediate yesterday); how is your infrastructure doing?

–jeroen

Posted in CSS, Development, JavaScript/ECMAScript, Scripting, Software Development, Web Development | Leave a Comment »

Converting inline svg xml to png

Posted by jpluimers on 2022/07/19

A while ago, I had a web page showing the logo as inline svg xml code.

Edit 20231209: [Wayback/Archive] Render SVG to PNG: Edit fiddle – JSFiddle – Code Playground (explained in [Wayback/Archive] html – Convert embedded SVG to PNG in-place – Stack Overflow by [Wayback/Archive] User anatoly techtonik – Stack Overflow) works way better than the InfoHeap link:

  1. Replace the svg element in it (but keep the id="inputSvg" attribute!),
  2. Run the fiddle,
  3. Save the rendered PNG file by right-clicking the “PNG (Save link as..)” link then saving the file.

Original content

It took a while to find a place to convert that on-line: [Wayback/Archive.is] inline svg xml to png – online html sandbox – InfoHeap (via [Wayback/Archive.is] Convert svg xml text to png image using canvas – InfoHeap):

The solution is a bit of JavaScript (quoted below) that you can run-online: modify the svg bit in it, then run it, scroll down in the result and verify if the canvas fits (when not: adapt the canvas side, then re-run).

The svg xml code needs to be all on one line, so remove any line breaks in it before running.

I have tested it in Chrome, but it should work in non-Chromium browsers like Firefox as well.

The inner workings of the JavaScript conversion code is explained in [Wayback/Archive.is] html – Convert embedded SVG to PNG in-place – Stack Overflow with more demo code at [Archive.is] Rasterizing In-Document SVG (thanks [Wayback] Phrogz!).

Related: [Archive.is] Jeroen Wiert Pluimers on Twitter: “Nieuwe logo, oude logo. Vrijwel alle werknemers werden een halve dag naar huis gestuurd om ruimte te maken voor de genodigden voor de zodat die de introductie van naam en logo konden bijwonen. Heel goed om verbinding te verliezen met je echte doelgroep. … “

Provalu logo

MareGroep logo

--jeroen



<div id="diagram_image">
<svg id="inputSvg" xmlns="http://www.w3.org/2000/svg&quot; xmlns:inkspace="http://www.inkscape.org/namespaces/inkscape&quot; xmlns:xlink="http://www.w3.org/1999/xlink&quot; viewBox="0 0 640 120">
<defs id="defs_block">
<filter height="1.504" id="filter_blur" inkspace:collect="always" width="1.1575" x="-0.07875" y="-0.252">
<feGaussianBlur id="feGaussianBlur3780" inkspace:collect="always" stdDeviation="4.2" />
</filter>
</defs>
<title>blockdiag</title>
<desc/>
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="67" y="46" />
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="259" y="46" />
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="451" y="46" />
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="64" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="128" y="66">discovery</text>
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="256" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="320" y="66">execution</text>
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="448" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="512" y="66">reporting</text>
<path d="M 192 60 L 248 60" fill="none" stroke="rgb(0,0,0)" />
<polygon fill="rgb(0,0,0)" points="255,60 248,56 248,64 255,60" stroke="rgb(0,0,0)" />
<path d="M 384 60 L 440 60" fill="none" stroke="rgb(0,0,0)" />
<polygon fill="rgb(0,0,0)" points="447,60 440,56 440,64 447,60" stroke="rgb(0,0,0)" />
</svg>
</div>
<img id="outputPngImage" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="/>
<span id="outputPngLinkSpan">
<a href="">PNG (Save link as..)</a>
</span>

view raw

page-body.html

hosted with ❤ by GitHub


class SVGtoPNGDataURL {
constructor() {
this.canvas = document.createElement('canvas'); // Not shown on page
this.canvas2DContext = this.canvas.getContext('2d');
this.loaderImage = new Image; // Not shown on page
}
// Generate PNG data URL from SVG and send it to callback function when ready
go(svgElement, dataUrlCallback) {
var svgAsXML = (new XMLSerializer).serializeToString( svgElement );
this.loaderImage.width = this.canvas.width = svgElement.clientWidth;
this.loaderImage.height = this.canvas.height = svgElement.clientHeight;
var self = this;
this.loaderImage.onload = function() {
self.canvas2DContext.drawImage( self.loaderImage, 0, 0, self.loaderImage.width, self.loaderImage.height );
dataUrlCallback(self.canvas.toDataURL());
};
this.loaderImage.src = 'data:image/svg+xml,' + encodeURIComponent( svgAsXML );
}
};
var converter = new SVGtoPNGDataURL();
var inputSvgElement = document.querySelector('#inputSvg'), // Inline SVG element
outputPngImage = document.querySelector('#outputPngImage'), // Where to draw the result
outputPngLink = document.querySelector('#outputPngLinkSpan a');
converter.go(inputSvgElement, dataUrlCallback=function(dataURL) {
outputPngImage.src = dataURL;
outputPngLink.href = dataURL;
});

Posted in Chrome, Development, Firefox, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »

Automatically reload page in Chrome without plugin – Super User

Posted by jpluimers on 2022/07/14

Below is a cool solution to refresh a page using a bookmarklet is to embed it into an iframe, then automatically reload it every interval.

It for instance works for the [Wayback/Archive.is] Woonveilig and often in Fritz!Box environments.

[Wayback] Jon described the below method as a solution for his own question, 6 years after asking it in [Wayback/Archive.is] Automatically reload page in Chrome without plugin – Super User.

So I made this a bookmark:


javascript:document.getElementsByTagName("body")[0].innerHTML = "<iframe id=\"testFrame\" src=\""+window.location.toString()+"\" style=\"position: absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%;\"><\/iframe>";reloadTimer = setInterval(function(){ document.getElementById("testFrame").src=document.getElementById("testFrame").src },5*60*1000)

(it is in a gist as the WordPress editors keep killing the embedded html code, despite it being escaped within <code> tags.

–jeroen

Posted in Bookmarklet, Chrome, Chrome, Development, Firefox, Google, HTML, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »

GitKon Sept 22 – 23, 2021 – Virtual Git Conference | Presented by GitKraken

Posted by jpluimers on 2022/07/12

GitKon was a cool virtual conference about git and the git ecosystem: [Wayback/Archive.is] GitKon Sept 22 – 23, 2021 – Virtual Git Conference | Presented by GitKraken

Navigation was a bit hard because of the visual overload on the site (look at the various Archive.is archivals), so here is the outlined list of sessions with the rough timestamps in the below live recordings:

Global sitemap:

Live recordings are below. Hopefully they will last and per session splits will have become available.

None of them are at listed at [Wayback/Archive.is] www.youtube.com/c/Gitkraken/videos.

Via: [Wayback/Archive.is] Attendee Registration Thank You – GitKon 2021

–jeroen


Day 1 live recordings

Day 2 live recordings

Posted in Development, DVCS - Distributed Version Control, git, Mobile Development, Software Development, Source Code Management, Web Development | Leave a Comment »

Getting meta data from an image URL – JSFiddle – Code Playground (not sure why it fails on the Chrome console)

Posted by jpluimers on 2022/06/28

It works as a [Wayback/Archive.is] Edit fiddle – JSFiddle – Code Playground.

And it fails on the Google Chrome console:

GET https://anniversary.archive.org/files/2021/07/October-2001-Google-Drive-7-19-2021-3-24-49-PM-768x276.png net::ERR_FAILED

The code is from [Wayback/Archive.is] javascript – Get width height of remote image from url – Stack Overflow (which has many more sync and async code examples that all fail in the same way, not sure why).

Glad the JSFiddle one works.

Via: [Wayback] get image dimensions from url – Google Search

–jeroen

Posted in Development, JavaScript/ECMAScript, JSFiddle, Scripting, Software Development, Web Development | Leave a Comment »

Inclusie/toegankelijkheid voor het @LUMC_Leiden: een tabel in HTML in plaats van plaatje zonder alt-text – #a11y

Posted by jpluimers on 2022/06/20

Voor inclusie en toegankelijkheid heb ik het plaatje van de tabel met voedingsmiddelen op [Wayback/Archive] Coloscopie | LUMC onderstaand in een HTML versie gegoten dankzij Google Lens die voor mij de tekst via OCR eruit gehaald heeft.

Dit vanwege een ingreep die binnenkort plaatsvindt waarbij een laxeerprotocol met Picoprep bij hoort.

De tabel als plaatje

De tabel is niet leesbaar voor mensen met een visuele beperking, en is afgedrukt bovendien zo klein dat zelfs voor mensen met een normaal zicht dit bijna niet leesbaar is.

Vanuit oogpunt van (verplichte, zie onder) toegankelijkheid en inclusie van mensen met een beperking is dit onwenselijk.

Read the rest of this entry »

Posted in accessibility (a11y), Awareness, Development, Health, Hospital, Inclusion / inclusive society, LifeHacker, LUMC, Power User, Web Development | Leave a Comment »

Setting up a GitLab project so it is served over https as a gitlab.io and a custom subdomain

Posted by jpluimers on 2022/05/05

Last week, I posted about Setting up a GitHub project so it is served over https as a custom github.io subdomain.

Today it’s the equivalent, but on GitLab.

Why GitLab? Two major reasons: unlike GitHub:

  1. it’s open source
  2. provides way more granular control over permissions
  3. allows a hierarchy of repositories on which you can specify that permission control

Already 2. and 3. combined are a huge advantage, though we will see that 3. also makes some of the subcases (hosting as user.gitlab.io from account gitlab.com/user where user is your username) is harder than the similar user.github.io, github.com/user combo.

So here we go, starting with a similar set of links:

The goal is to have

  1. page projects as or under wiert.gitlab.io (like wiert.gitlab.io/wiert)
  2. a gitlabstatus.wiert.me plain html (or maybe markdown) page project that eventually will show some status information (kind of like status.gitlab.com, but for different things).

The beauty of GitLab is that it supports hierarchies of repositories through groups and subgroups, so I already had these subgroups hoping they would cover both the first and second kind of page projects:

Steps I did

Since there are quite a few links above, here are the steps I took from my gitlab.com/wiert account and gitlab.com/wiert.me group.

Steps for wiert.gitlab.io/wiert

  1. For wiert.gitlab.io/wiert, try A (failed in part, and therefore interesting to understand why):
    1. Under leaf group gitlab.com/wiert.me/public/web/sites/gitlab.io, created a new GitLab repository
    2. Chose “Create from template”
    3. Chose the template “Pages/Plain HTML”
    4. Named the project “wiert” (with slug “wiert“) so it would appear at gitlab.com/wiert.me/public/web/sites/gitlab.io/wiert
    5. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    6. Now I got in a confusing situation as the page indicated “There are currently no pipelines.”, but an enabled blue “Run pipeline” button:
      By default there is no CI/CD pipeline, but there is an enabled blue "Run pipeline" button: confusing.

      By default there is no CI/CD pipeline, but there is an enabled blue “Run pipeline” button: confusing.

    7. Clicked the “Run pipeline” button nonetheless, and that created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    8. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job and deployed the page.
    9. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wiert.me.gitlab.io/public/web/sites/gitlab.io/wiert/ and https://wiert.me.gitlab.io/public/web/sites/gitlab.io/wiert/
       Warning: When using Pages under the general domain of a GitLab instance (gitlab.io), you cannot use HTTPS with sub-subdomains.

      Warning: When using Pages under the general domain of a GitLab instance (gitlab.io), you cannot use HTTPS with sub-subdomains.

      The sites do work (see the [Archive.is http version] and [Archive.is https version]), but the HTTPS fails because wiert.me.gitlab.io does not match the SANs (Subject Alternative Names) in the certificate: *.gitlab.io, gitlab.io

  2. For wiert.gitlab.io/wiert, try B (failed, and therefore interesting to understand why):
    1. In my my groups gitlab.com/dashboard/groups, added a new group wiert
    2. Added subgroups until the leaf gitlab.com/wiert/public/web/sites/gitlab.io which as URL is gitlab.com/wier1/public/web/sites/gitlab.io because user account wiert already occupies gitlab.com/wiert.
    3. Under leaf group gitlab.com/wier1/public/web/sites/gitlab.io, created a new GitLab repository
    4. Chose “Create from template”
    5. Chose the template “Pages/Plain HTML”
    6. Named the project “wiert” (with slug “wiert“) so it would appear at gitlab.com/wiert.me/public/web/sites/gitlab.io/wiert
    7. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    8. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    9. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    10. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    11. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wier1.gitlab.io/public/web/sites/gitlab.io/wiert and https://wier1.gitlab.io/public/web/sites/gitlab.io/wiert.
      Bummer: again not the wiert.gitlab.io/wiert I hoped for
      The sites do work (see the [Archive.is http version] and [Archive.is https version]). The HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

    12. If a user wiert exists and occupies gitlab.com/wiert, then a group named wiert cannot occupy gitlab.com/wiert, and therefore a project named wiert within that group won’t be deployed to wiert.gitlab.io/wiert.
      Maybe this can be shortened like “if there is a user wiert, then no group named wiert cannot be used to contain a project named wiert to host as wiert.gitlab.io/wiert“.
      Let’s find out!
  3. For  wiert.gitlab.io/wiert, try C (success, steps 1, 3, 4, 7 and 8 were the key ones):
    1. In my user gitlab.com/wiert, created a new GitLab repository
    2. Chose “Create from template”
    3. Chose the template “Pages/Plain HTML”
    4. Named the project “wiert” (with slug “wiert“) so it would appear at gitlab.com/wiert
    5. The odd but cool thing is that the actual project now ended up at gitlab.com/wiert/wiert:
    6. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    7. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    8. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    9. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    10. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wiert.gitlab.io/wiert/ and https://wiert.gitlab.io/wiert/.
      Success: finally the wiert.gitlab.io/wiert I hoped for:

      Success: published at https://wiert.gitlab.io/wiert/

      Success: published at https://wiert.gitlab.io/wiert/

      The sites do work fine (see the [Archive.is http version] and [Archive.is https version]). The HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

Steps for wiert.gitlab.io

  1. For wiert.gitlab.io, try A (failed, and therefore interesting to understand why):
    1. Under leaf group gitlab.com/wiert.me/public/web/sites/gitlab.io, created a new GitLab repository
    2. Chose “Create from template”
    3. Chose the template “Pages/Plain HTML”
    4. Named the project “wiert.gitlab.io” (with slug “wiert.gitlab.io“) so it would appear at gitlab.com/wiert.me/public/web/sites/gitlab.io/wiert.gitlab.io
    5. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    6. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    7. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    8. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    9. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wiert.me.gitlab.io/public/web/sites/gitlab.io/wiert.gitlab.io and https://wiert.me.gitlab.io/public/web/sites/gitlab.io/wiert.gitlab.io.
      Failure: not the wiert.gitlab.io I hoped for.

      The sites do work (see the [Archive.is http version] and [Archive.is https version]), but the HTTPS fails because wiert.me.gitlab.io does not match the SANs (Subject Alternative Names) in the certificate: *.gitlab.io, gitlab.io. The HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

  2. For wiert.gitlab.io, try B (failed, and therefore interesting to understand why):
    1. Under leaf group gitlab.com/wier1/public/web/sites/gitlab.io, created a new GitLab repository
    2. Chose “Create from template”
    3. Chose the template “Pages/Plain HTML”
    4. Named the project “wiert.gitlab.io” (with slug “wiert.gitlab.io“) so it would appear at gitlab.com/wier1/public/web/sites/gitlab.io/wiert.gitlab.io
    5. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    6. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    7. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    8. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    9. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wier1.gitlab.io/public/web/sites/gitlab.io/wiert.gitlab.io and https://wier1.gitlab.io/public/web/sites/gitlab.io/wiert.
      Bummer: again not the wiert.gitlab.io I hoped for
      The sites do work (see the [Archive.is http version] and [Archive.is https version]). The HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

    10. Try A and B were almost identical to wiert.gitlab.io/wiert try A and B, so let’s see if the solution C for that also works for us:
  3. For wiert.gitlab.io, try C (success, steps 1, 3, 4, 7 and 9 were the key ones)
    1. In my user gitlab.com/wiert, created a new GitLab repository
    2. Chose “Create from template”
    3. Chose the template “Pages/Plain HTML”
    4. Named the project “wiert.gitlab.io” (with slug “wiert.gitlab.io“) so it would appear at gitlab.com/wiert/wiert.gitlab.io.
    5. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    6. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    7. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    8. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    9. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wiert.gitlab.io/ and https://wiert.gitlab.io/.
      Success: finally the wiert.gitlab.io I hoped for with working sites (see the [Archive.is http version] and [Archive.is https version]).
    10. Note the HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

Steps for gitlabstatus.wiert.me

Having learned from the GitHub githubstatus.wiert.me procedure (where I had to wait a long time for the default *.wiert.me domain mapping timeout and the githubstatus.wiert.me DNS CNAME record to become effective), I started on the DNS CNAME record side which is documented at [Wayback] Custom domains and SSL/TLS certificates: Section 3. Set up DNS records for Pages: For subdomains | GitLab:

Subdomains (subdomain.example.com) require:

  • A DNS CNAME record pointing your subdomain to the Pages server.
  • A DNS TXT record to verify your domain’s ownership.
From DNS Record To
subdomain.example.com CNAME namespace.gitlab.io
_gitlab-pages-verification-code.subdomain.example.com TXT gitlab-pages-verification-code=00112233445566778899aabbccddeeff

Note that, whether it’s a user or a project website, the CNAME should point to your Pages domain (namespace.gitlab.io), without any /project-name.

DNS CNAME record pointing to GitLab.com project

The value for the TXT record is only known after you created the pages project, but the value for the CNAME record is known beforehand:

From DNS Record To
gitlabstatus.wiert.me CNAME namespace.gitlab.io

So let’s see if I can do this in one try, with these steps:

  1. For gitlabstatus.wiert.me, try A (success, steps 1, 3, 4, 7 and 9 were the key ones)
    1. In my DNS settings of the wiert.me domain, created a CNAME record from gitlabstatus.wiert.me to namespace.gitlab.io:

      gitlabstatus.wiert.me CNAME record pointing to namespace.gitlab.io

      gitlabstatus.wiert.me CNAME record pointing to namespace.gitlab.io

    2. Under leaf group gitlab.com/wiert.me/public/web/sites/wiert.me, created a new GitLab repository
    3. Chose “Create from template”
    4. Chose the template “Pages/Plain HTML”
    5. Named the project “gitlabstatus.wiert.me” (with slug “gitlabstatus.wiert.me“) so it would appear at gitlab.com/wiert.me/public/web/sites/wiert.me/gitlabstatus.wiert.me
    6. From the left sidebar, navigated to your project’s “CI/CD”, then “Pipelines”
    7. Again there was “There are currently no pipelines.”, but an enabled blue “Run pipeline” button, which I clicked
    8. That created [Wayback/Archive.is] a pipeline asking for parameters (that already had correct default values) and revealed a new blue “Run pipeline” button.
    9. Clicked that new “Run pipeline button” which created [Wayback/Archive.is] a job deployed the page.
    10. From the left sidebar, navigated to “Settings”, then “Pages” to get the links to the pages site: http://wiert.me.gitlab.io/public/web/sites/wiert.me/gitlabstatus.wiert.me and https://wiert.me.gitlab.io/public/web/sites/wiert.me/gitlabstatus.wiert.me.
      Intermediate success: working sites (see the [Archive.is http version] and [Archive.is https version]).
    11. Now it is time to get the DNS CNAME record from gitlabstatus.wiert.me to namespace.gitlab.io into operation by clicking the “New Domain” button:
      "New Domain" button in the "Pages" settings.

      “New Domain” button in the “Pages” settings.

    12. There I filled in the correct gitlabstatus.wiert.me domain name, then pressed the “Create New Domain” button:

      New domain becomes gitlabstatus.wiert.me

      New domain becomes gitlabstatus.wiert.me

    13. Then a page appeared voiding the DNS CNAME work I already did: the documentation is clearly wrong as these are the two DNS record entries to be made as shown by gitlab.com/wiert.me/public/web/sites/wiert.me/gitlabstatus.wiert.me/pages/domains/gitlabstatus.wiert.me:
      Correct instructions for the DNS records to get gitlabstatus.wiert.me working

      Correct instructions for the DNS records to get gitlabstatus.wiert.me working

      Subdomains (gitlabstatus.wiert.me) require:

      • A DNS CNAME record pointing your subdomain to the Pages server.
      • A DNS TXT record to verify your domain’s ownership.
      From DNS Record To
      gitlabstatus.wiert.me CNAME wiert.me.gitlab.io.
      _gitlab-pages-verification-code.gitlabstatus.wiert.me TXT gitlab-pages-verification-code=c5619988d386b1a36c253ce05db55dbb

      Basically the whole namespace.gitlab.io part of the documentation is a placeholder for the actual namespace that belongs to the leaf group the pages project is in (in my case wiert.me).

      So this is the new DNS entry, for which I had to wait until the DNS TTL to time out and effectuate:
      New DNS gitlabstatus.wiert.me CNAME record pointing to wiert.me.gitlab.io

      New DNS gitlabstatus.wiert.me CNAME record pointing to wiert.me.gitlab.io

      Note that this DNS administrative interface from WordPress.com does omit the final period of the CNAME destination (officially this would be wiert.me.gitlab.io.)

    14. After the CNAME DNS record, I also made the TXT DNS record:
      New DNS TXT record for verification of gitlabstatus.wiert.me

      New DNS TXT record for verification of gitlabstatus.wiert.me

      Then I waited a little for the DNS TXT record to be saved and try the verification of the TXT record.

    15. Even then, verification took some time. I had to click the refresh button a few times before verification succeeded:
      The DNS TXT record for gitlabstatus.wiert.me finally got verified

      The DNS TXT record for gitlabstatus.wiert.me finally got verified

    16. Now I could press blue “Save Changes” button below and waited for the CNAME record DNS TTL to expire so I could check the domain and – hopefully – the TLS certificate to be requested by Let’s Encrypt:
      After the gitlabstatus.wiert DNS TXT record got verified, I could save the domain information

      After the gitlabstatus.wiert DNS TXT record got verified, I could save the domain information

    17. After the old CNAME record DNS TTL expired and the new CNAME record came into effect, the domain became available as http://gitlabstatus.wiert.me/:
      Waiting for gitlabstatus.wiert.me to become active

      Waiting for gitlabstatus.wiert.me to become active

    18. After verification, the “Domains (1)” bit changed from this:
      Domain gitlabstatus.wiert.me information before verification

      Domain gitlabstatus.wiert.me information before verification

      to this:

      Domain gitlabstatus.wiert.me information after verification

      Domain gitlabstatus.wiert.me information after verification

    19. In the mean time, also the TLS certificate got issued by Let’s Encrypt, so the final sites now both worked: http://gitlabstatus.wiert.me/ and https://gitlabstatus.wiert.me/.
    20. Success: finally the gitlabstatus.wiert.me I hoped for with working sites (see the [Archive.is http version] and [Archive.is https version] for the wiert.me domain, and [Archive.is http version] and [Archive.is https version] for the wiert.me domain).
    21. Note the HTTP does not redirect to the HTTP version, as I did not tick the

      ☐ Force HTTPS (requires valid certificates)

In retrospect, this could have been shorter when I had done the DNS part later, which is contrary to how to do this with GitHub.

Conclusion

The conclusion seems this:

Gitlab Page repositories to be published as or under wiert.gitlab.io need to reside directly under user wiert. Having them reside under a different group like wiert or wiert.me won’t work.

Or in more generic terms:

When creating pages as user.gitlab.io you have to put your pages projects directly under your user account gitlab.com/user.

Putting them under groups or leaf groups fails, no matter if the (leaf) group is named user or otherwise.

In addition, you can add custom domains to any Gitlab repository (even one that never stated out as a GitLab Pages repository). It will work as soon as the domain DNS mapping is setup through both a CNAME mapping record and TXT verification record.

The steps for this in your GitLab repository are:

  1. Ensure you have a valid .gitlab-ci.yml file at the root of your repository; I used the [Wayback/Archive.is] one from [Wayback/Archive] GitLab Pages examples / plain-html · GitLab as my site is purely static
  2. Ensure you have a valid index.html file in the public directory of your repository, similar to [Wayback/Archive] GitLab Pages examples / plain-html · GitLab
  3. When both 1. and 2. are committed in your repository at GitLab, then it will automatically be deployed to a docker container on gitlab.io, which allows the outside world to visit your GitHub Pages sie, and the Let’s Encrypt Certificate to be generated (and prevents this error: [Wayback/Archive] GitLab Pages integration with Let’s Encrypt | GitLab: “Something went wrong while obtaining the Let’s Encrypt certificate”).
  4. Under “Settings” -> “Pages”, add a new domain name to the repository: now it automatically becomes a GitLab Pages repository.
  5. When adding the domain, the settings page will show both a DNS CNAME record and DNS TXT record; ensure both are applied on your primary DNS name server and replicated to all authoritative DNS name servers.
  6. Save the new page.
  7. Check if the page is available on the new domain you added.
  8. Optionally under “Settings” -> “Pages” enable the “Force HTTPS (requires valid certificates)” option and save.

TLS information

Note: I saved the TLS information – including certificates here:

More about the Let’s Encrypt certificates at [Wayback] Chain of Trust – Let’s Encrypt:

–jeroen

Read the rest of this entry »

Posted in Cloud, Communications Development, Development, DNS, Encryption, GitLab, Hosting, HTML, HTTPS/TLS security, Infrastructure, Internet, Internet protocol suite, Let's Encrypt (letsencrypt/certbot), Power User, Software Development, Source Code Management, TCP, TLS, Web Development | Leave a Comment »

capitaltg/thea: Certificate Checker and https://certchecker.app site

Posted by jpluimers on 2022/05/03

[Wayback/Archive.is] capitaltg/thea: Certificate Checker

Certificate Checker provides an easy-to-use solution to check certificates, certificate chains, and TLS configurations. To run Certificate Checker for publicly-accessible web sites you can go to: https://certchecker.app and enter in there a URL to check.
Users can easily run Certificate Checker in an internal network to validate or troubleshoot their TLS configuration. To run it on a local network you can run the Docker image as described below. You can also build the application and deploy it on an existing server.

It runs on [Wayback/Archive.is] Certificate Checker.

I used it to check various certificates and chains, including those for my GitHub Pages explained last week in Setting up a GitHub project so it is served over https as a custom subdomain.

–jeroen

Posted in Communications Development, Development, Encryption, HTTPS/TLS security, Internet protocol suite, Let's Encrypt (letsencrypt/certbot), Power User, Security, Software Development, TCP, TLS, Web Development | Leave a Comment »