Skip to content

Commit

Permalink
added new blog post
Browse files Browse the repository at this point in the history
  • Loading branch information
downIoads committed Jun 8, 2024
1 parent 07ebf50 commit 016e36c
Show file tree
Hide file tree
Showing 112 changed files with 2,320 additions and 1,677 deletions.
Binary file modified .DS_Store
Binary file not shown.
Binary file modified content/.DS_Store
Binary file not shown.
112 changes: 112 additions & 0 deletions content/posts/nginx-selfsigned-certs-tutorial.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,112 @@
---
title: "Using nginx with self-signed certificates to encrypt local communications"
date: 2024-06-07T20:00:00+02:00
description: Learn how to use self-signed certs in an example with a self-hosted Gitlab server.
draft: false
tags: [tutorial, linux, raspberrypi, gitlab, nginx]
---

## Introduction

When you run local servers on your Raspberry Pi, you by default only get unencrypted http communications which makes it trivial for anyone in your LAN to snoop the traffic. This post is a brief tutorial how to get free encrypted https communications without having to purchase a real domain name. I use the example of a self-hosted Gitlab server as this was my actual use-case, but this tutorial should be useful even if you do not care about the Gitlab part.

## Assumptions

* You have a Raspberry Pi running their official OS
* You have Gitlab installed and running already (but it still uses http)

## Installing nginx
```bash
sudo apt install nginx
```
and then to create the directory where we will be putting our self-signed certificate
```bash
mkdir /etc/nginx/certs
```

## Getting a self-signed certificate
Just run the following command:
```bash
sudo openssl req -x509 -nodes -days 9999 -newkey rsa:4096 -keyout /etc/nginx/certs/selfSignedCert.key -out /etc/nginx/certs/selfSignedCert.crt
```
It doesn't matter which values you put in the fields you are asked to fill. Congrats, now you have an RSA certificate that is valid for 9999 days.

## Configuring nginx
Let's create our custom config called "mylocalserver" with:
```bash
sudo nano /etc/nginx/sites-available/mylocalserver
```
Here, put the following content:
```text
server {
listen 80;
server_name _;
location /gitlab { # if you want server to only be reachable via https://<localIP>/gitlab
return 301 https://$host$request_uri;
}
# just add another location block if you have another service (must have new location path)
}
server {
listen 443 ssl;
server_name _;
ssl_certificate /etc/nginx/certs/selfSignedCert.crt;
ssl_certificate_key /etc/nginx/certs/selfSignedCert.key;
location /gitlab { # if you want server to only be reachable via https://<localIP>/gitlab
proxy_pass http://127.0.0.1:8084;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
# just add another location block if you have another service (change location path and port to reflect actual)
}
```
Also create a symbolic link by running:
```bash
sudo ln -s /etc/nginx/sites-available/mylocalserver /etc/nginx/sites-enabled/
```
If you now test the current config using
```bash
sudo nginx -t
```
it should say success.

Ok, so now enable nginx at startup and also restart it now to apply new config:
```bash
sudo systemctl enable nginx

sudo systemctl restart nginx
```

In this config, we have specified that when we access
```text
https://<localIP>/gitlab
```
in the browser we should be encrypting all traffic with the self-signed cert we have created and be forwarded to Gitlab which is running at port 8084. For Gitlab specifically, you now also need to adjust your gitlab.rb by running
```bash
sudo nano /etc/gitlab/gitlab.rb
```
Here you want to have the following three lines (external_url already exists and must be adjusted, the other two lines can just be added):
```text
external_url 'https://localhost/gitlab' # adding the /gitlab part is important as this is how it was specified in the nginx config
nginx['listen_port'] = 8084 # must match port in nginx config
nginx['listen_https'] = false # avoid gitlab clashing with nginx, this does not mean that the traffic is not encrypted
```
Now apply the new Gitlab config by running
```bash
sudo gitlab-ctl reconfigure
```
Congrats, if you wait a minute or two you can now visit your Gitlab in the browser at the address:
```text
https://<localIP>/gitlab
```
You will get a warning (because the certificate is self-signed), so just once tell the browser to ignore the warning and continue.

## Conclusion
I wrote the tutorial because when searching online how to encrypt local traffic you get the craziest suggestions, ranging from "you should pay for an actual domain name" to "you should use this shady free service that does it for free". None of these things are necessary, the nginx approach is simple, and the only downside is that one time you have to tell your browser to ignore a warning. I am happy with my free setup, and it is nice that I do not have to rely on some third-party.
40 changes: 20 additions & 20 deletions public/about/index.html
Original file line number Diff line number Diff line change
@@ -1,37 +1,40 @@
<!DOCTYPE html>
<html><head>
<html><head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"><title>All about me - Blog for Tech Enjoyers</title><link rel="icon" type="image/png" href=https://www.pngmart.com/files/23/Nerd-Emoji-PNG.png /><meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Who am I? Wouldn&rsquo;t you like to know, weatherboy?
How often do you add new content? I try to post new blog entries whenever I have something to say." />
<meta property="og:image" content=""/>
<meta property="og:title" content="All about me" />
<meta property="og:description" content="Who am I? Wouldn&rsquo;t you like to know, weatherboy?
How often do you add new content? I try to post new blog entries whenever I have something to say." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://example.com/about/" /><meta property="article:section" content="" />
<meta property="article:published_time" content="2023-07-02T00:00:00+00:00" />
<meta property="article:modified_time" content="2023-07-02T00:00:00+00:00" />
<meta property="og:url" content="http://localhost:1313/about/">
<meta property="og:site_name" content="Blog for Tech Enjoyers">
<meta property="og:title" content="All about me">
<meta property="og:description" content="Who am I? Wouldn’t you like to know, weatherboy?
How often do you add new content? I try to post new blog entries whenever I have something to say.">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="article">
<meta property="article:published_time" content="2023-07-02T00:00:00+00:00">
<meta property="article:modified_time" content="2023-07-02T00:00:00+00:00">

<meta name="twitter:card" content="summary"/><meta name="twitter:title" content="All about me"/>
<meta name="twitter:description" content="Who am I? Wouldn&rsquo;t you like to know, weatherboy?
How often do you add new content? I try to post new blog entries whenever I have something to say."/>
<script src="https://example.com/js/feather.min.js"></script>
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="All about me">
<meta name="twitter:description" content="Who am I? Wouldn’t you like to know, weatherboy?
How often do you add new content? I try to post new blog entries whenever I have something to say.">
<script src="http://localhost:1313/js/feather.min.js"></script>

<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@1,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">


<link rel="stylesheet" type="text/css" media="screen" href="https://example.com/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="https://example.com/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />
<link rel="stylesheet" type="text/css" media="screen" href="http://localhost:1313/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="http://localhost:1313/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />



</head><body>
<div class="content"><header>
<div class="main">
<a href="https://example.com/">Blog for Tech Enjoyers</a>
<a href="http://localhost:1313/">Blog for Tech Enjoyers</a>
</div>
<nav>

Expand All @@ -42,7 +45,7 @@
<a href="/tags">Tags</a>

| <a id="dark-mode-toggle" onclick="toggleTheme()" href=""></a>
<script src="https://example.com/js/themetoggle.js"></script>
<script src="http://localhost:1313/js/themetoggle.js"></script>

</nav>
</header>
Expand Down Expand Up @@ -90,9 +93,6 @@ <h2 id="how-often-do-you-add-new-content">How often do you add new content?</h2>
2024 <a
href="https://github.com/athul/archie">Archie Theme</a> | Built with <a href="https://gohugo.io">Hugo</a>
</div>
</footer>


</div>
</footer></div>
</body>
</html>
32 changes: 15 additions & 17 deletions public/categories/index.html
Original file line number Diff line number Diff line change
@@ -1,33 +1,34 @@
<!DOCTYPE html>
<html><head>
<html><head><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"><title>Categories - Blog for Tech Enjoyers</title><link rel="icon" type="image/png" href=https://www.pngmart.com/files/23/Nerd-Emoji-PNG.png /><meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="" />
<meta property="og:image" content=""/>
<link rel="alternate" type="application/rss+xml" href="https://example.com/categories/index.xml" title="Blog for Tech Enjoyers" />
<meta property="og:title" content="Categories" />
<meta property="og:description" content="" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://example.com/categories/" />
<link rel="alternate" type="application/rss+xml" href="http://localhost:1313/categories/index.xml" title="Blog for Tech Enjoyers" />
<meta property="og:url" content="http://localhost:1313/categories/">
<meta property="og:site_name" content="Blog for Tech Enjoyers">
<meta property="og:title" content="Categories">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="website">

<meta name="twitter:card" content="summary"/><meta name="twitter:title" content="Categories"/>
<meta name="twitter:description" content=""/>
<script src="https://example.com/js/feather.min.js"></script>
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Categories">
<script src="http://localhost:1313/js/feather.min.js"></script>

<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@1,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">


<link rel="stylesheet" type="text/css" media="screen" href="https://example.com/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="https://example.com/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />
<link rel="stylesheet" type="text/css" media="screen" href="http://localhost:1313/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="http://localhost:1313/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />



</head><body>
<div class="content"><header>
<div class="main">
<a href="https://example.com/">Blog for Tech Enjoyers</a>
<a href="http://localhost:1313/">Blog for Tech Enjoyers</a>
</div>
<nav>

Expand All @@ -38,7 +39,7 @@
<a href="/tags">Tags</a>

| <a id="dark-mode-toggle" onclick="toggleTheme()" href=""></a>
<script src="https://example.com/js/themetoggle.js"></script>
<script src="http://localhost:1313/js/themetoggle.js"></script>

</nav>
</header>
Expand All @@ -62,9 +63,6 @@ <h1 class="page-title">All tags</h1>
2024 <a
href="https://github.com/athul/archie">Archie Theme</a> | Built with <a href="https://gohugo.io">Hugo</a>
</div>
</footer>


</div>
</footer></div>
</body>
</html>
6 changes: 3 additions & 3 deletions public/categories/index.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>Categories on Blog for Tech Enjoyers</title>
<link>https://example.com/categories/</link>
<link>http://localhost:1313/categories/</link>
<description>Recent content in Categories on Blog for Tech Enjoyers</description>
<generator>Hugo -- gohugo.io</generator>
<generator>Hugo</generator>
<language>en-us</language>
<atom:link href="https://example.com/categories/index.xml" rel="self" type="application/rss+xml" />
<atom:link href="http://localhost:1313/categories/index.xml" rel="self" type="application/rss+xml" />
</channel>
</rss>
52 changes: 25 additions & 27 deletions public/index.html
Original file line number Diff line number Diff line change
@@ -1,28 +1,29 @@
<!DOCTYPE html>
<html>
<head>
<meta name="generator" content="Hugo 0.121.1">
<meta name="generator" content="Hugo 0.127.0"><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=1313&amp;path=livereload" data-no-instant defer></script>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"><title>Blog for Tech Enjoyers | Home </title><link rel="icon" type="image/png" href=https://www.pngmart.com/files/23/Nerd-Emoji-PNG.png /><meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="" />
<meta property="og:image" content=""/>
<link rel="alternate" type="application/rss+xml" href="https://example.com/index.xml" title="Blog for Tech Enjoyers" />
<meta property="og:title" content="Blog for Tech Enjoyers" />
<meta property="og:description" content="" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://example.com/" />
<link rel="alternate" type="application/rss+xml" href="http://localhost:1313/index.xml" title="Blog for Tech Enjoyers" />
<meta property="og:url" content="http://localhost:1313/">
<meta property="og:site_name" content="Blog for Tech Enjoyers">
<meta property="og:title" content="Blog for Tech Enjoyers">
<meta property="og:locale" content="en_us">
<meta property="og:type" content="website">

<meta name="twitter:card" content="summary"/><meta name="twitter:title" content="Blog for Tech Enjoyers"/>
<meta name="twitter:description" content=""/>
<script src="https://example.com/js/feather.min.js"></script>
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Blog for Tech Enjoyers">
<script src="http://localhost:1313/js/feather.min.js"></script>

<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@1,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">


<link rel="stylesheet" type="text/css" media="screen" href="https://example.com/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="https://example.com/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />
<link rel="stylesheet" type="text/css" media="screen" href="http://localhost:1313/css/main.af0932513936b0cde7d4a0d5917aa65438df9a57b01fb2769e2be4bdc492944f.css" />
<link id="darkModeStyle" rel="stylesheet" type="text/css" href="http://localhost:1313/css/dark.726cd11ca6eb7c4f7d48eb420354f814e5c1b94281aaf8fd0511c1319f7f78a4.css" disabled />



Expand All @@ -31,7 +32,7 @@
<div class="content">
<header>
<div class="main">
<a href="https://example.com/">Blog for Tech Enjoyers</a>
<a href="http://localhost:1313/">Blog for Tech Enjoyers</a>
</div>
<nav>

Expand All @@ -42,7 +43,7 @@
<a href="/tags">Tags</a>

| <a id="dark-mode-toggle" onclick="toggleTheme()" href=""></a>
<script src="https://example.com/js/themetoggle.js"></script>
<script src="http://localhost:1313/js/themetoggle.js"></script>

</nav>
</header>
Expand All @@ -52,6 +53,17 @@



<section class="list-item">
<h1 class="title"><a href="/posts/nginx-selfsigned-certs-tutorial/">Using nginx with self-signed certificates to encrypt local communications</a></h1>
<time>Jun 7, 2024</time>
<br><div class="description">

Learn how to use self-signed certs in an example with a self-hosted Gitlab server.

</div>
<a class="readmore" href="/posts/nginx-selfsigned-certs-tutorial/">Read more ⟶</a>
</section>

<section class="list-item">
<h1 class="title"><a href="/posts/win98-se-vmware/">Running Windows 98 SE in Vmware Workstation on modern hardware</a></h1>
<time>Feb 13, 2024</time>
Expand Down Expand Up @@ -129,17 +141,6 @@ <h1 class="title"><a href="/posts/hackintosh-xps9370/">Hackintosh #3: Running So
<a class="readmore" href="/posts/hackintosh-xps9370/">Read more ⟶</a>
</section>

<section class="list-item">
<h1 class="title"><a href="/posts/stable-diffusion-gopher/">Using Stable Diffusion as Discord Emote Generator</a></h1>
<time>Oct 20, 2023</time>
<br><div class="description">

Short introduction to Stable Diffusion and example pictures.

</div>
<a class="readmore" href="/posts/stable-diffusion-gopher/">Read more ⟶</a>
</section>



<ul class="pagination">
Expand All @@ -162,9 +163,6 @@ <h1 class="title"><a href="/posts/stable-diffusion-gopher/">Using Stable Diffusi
href="https://github.com/athul/archie">Archie Theme</a> | Built with <a href="https://gohugo.io">Hugo</a>
</div>
</footer>



</div>

</body>
Expand Down
Loading

0 comments on commit 016e36c

Please sign in to comment.