mirror of
https://github.com/caddyserver/website.git
synced 2025-04-22 13:06:16 -04:00
Rewrite quick assist with AlpineJS, use markdown for contents
This commit is contained in:
Francis Lavoie
parent
36841d57d4
commit
48645cedc1
7 changed files with 566 additions and 504 deletions
|
|
@ -5,13 +5,12 @@
|
|||
{{import "/includes/head.html"}}
|
||||
{{template "head"}}
|
||||
<link rel="stylesheet" href="/resources/css/docs.css{{template "cacheBust"}}">
|
||||
<link rel="stylesheet" href="/resources/css/docs-home.css{{template "cacheBust"}}">
|
||||
<!-- <meta property="og:title" content="Caddy 2 - The Ultimate Server with Automatic HTTPS">
|
||||
<meta name="twitter:title" value="Caddy 2 - The Ultimate Server with Automatic HTTPS"> -->
|
||||
|
||||
<script src="/resources/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/resources/js/vendor/marked.min.js{{template "cacheBust"}}"></script>
|
||||
<script src="/resources/js/docs.js{{template "cacheBust"}}"></script>
|
||||
<script src="/resources/js/docs-home.js{{template "cacheBust"}}"></script>
|
||||
</head>
|
||||
<body>
|
||||
{{include "/includes/header.html" ""}}
|
||||
|
|
@ -99,16 +98,7 @@
|
|||
<h1>Documentation</h1>
|
||||
|
||||
<div class="fullspan">
|
||||
<div class="box box-filled box-capped quick-assist">
|
||||
<div class="box-cap quick-assist-history">
|
||||
<a title="Click quick for slick trick (not AI)">Quick Assist</a>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="quick-assist-question"></h3>
|
||||
<div class="quick-assist-content"></div>
|
||||
<div class="quick-assist-options"></div>
|
||||
</div>
|
||||
</div>
|
||||
{{ include "/includes/quick-assist/core.html" }}
|
||||
|
||||
<div class="box">
|
||||
<h3>Getting Started</h3>
|
||||
|
|
|
|||
136
new/includes/quick-assist/content.md
Normal file
136
new/includes/quick-assist/content.md
Normal file
|
|
@ -0,0 +1,136 @@
|
|||
<!--
|
||||
All the markdown content is hidden by default, and loaded by ID.
|
||||
The HTML ID should start with qa-content- followed by the state ID.
|
||||
Make sure to leave empty lines after the opening of the div and before the end,
|
||||
otherwise the markdown parsing will not work.
|
||||
-->
|
||||
|
||||
<div id="qa-content-install_dpkg">
|
||||
|
||||
<pre><code class="cmd"><span class="bash">sudo apt install -y debian-keyring debian-archive-keyring apt-transport-https</span>
|
||||
<span class="bash">curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/gpg.key' | sudo gpg --dearmor -o /usr/share/keyrings/caddy-stable-archive-keyring.gpg</span>
|
||||
<span class="bash">curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/debian.deb.txt' | sudo tee /etc/apt/sources.list.d/caddy-stable.list</span>
|
||||
<span class="bash">sudo apt update</span>
|
||||
<span class="bash">sudo apt install caddy</span></code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_rpm">
|
||||
|
||||
<pre><code class="cmd"><span class="bash">dnf install 'dnf-command(copr)'</span>
|
||||
<span class="bash">dnf copr enable @caddy/caddy</span>
|
||||
<span class="bash">dnf install caddy</span></code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_arch">
|
||||
|
||||
<pre><code class="cmd"><span class="bash">pacman -Syu caddy</span></code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_mac">
|
||||
|
||||
<pre><code class="cmd bash">brew install caddy</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_windows">
|
||||
|
||||
<p>Chocolatey:</p> <pre><code class="cmd">choco install caddy</code></pre>
|
||||
<p>Scoop:</p> <pre><code class="cmd">scoop install caddy</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_nix">
|
||||
|
||||
- Package name: [`caddy`](https://search.nixos.org/packages?channel=unstable&show=caddy&query=caddy)
|
||||
- NixOS module: [`services.caddy`](https://search.nixos.org/options?channel=unstable&show=services.caddy.enable&query=services.caddy)
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_android">
|
||||
|
||||
In Termux: <pre><code class="cmd">pkg install caddy</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_other">
|
||||
|
||||
<h4>Webi</h2>
|
||||
<p>Linux and macOS:</p>
|
||||
<pre><code class="cmd bash">curl -sS https://webi.sh/caddy | sh</code></pre>
|
||||
<p>Windows:</p>
|
||||
<pre><code class="cmd">curl.exe https://webi.ms/caddy | powershell</code></pre>
|
||||
<h4>Ansible</h4>
|
||||
<pre><code class="cmd bash">ansible-galaxy install nvjacobo.caddy</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_docker">
|
||||
|
||||
<pre><code class="cmd bash">docker pull caddy</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_build">
|
||||
|
||||
Make sure to have `git` and the latest version of [Go](https://go.dev) installed.
|
||||
|
||||
<pre><code class="cmd"><span class="bash">git clone "https://github.com/caddyserver/caddy.git"</span>
|
||||
<span class="bash">cd caddy/cmd/caddy/</span>
|
||||
<span class="bash">go build</span></code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_with_plugins">
|
||||
|
||||
|
||||
[`xcaddy`](https://github.com/caddyserver/xcaddy) is a command line tool that helps you build Caddy with plugins. A basic build looks like:
|
||||
|
||||
<pre><code class="cmd bash">xcaddy build</code></pre>
|
||||
|
||||
To build with plugins, use `--with`:
|
||||
|
||||
<pre><code class="cmd bash">xcaddy build \
|
||||
--with github.com/caddyserver/nginx-adapter
|
||||
--with github.com/caddyserver/ntlm-transport@v0.1.1</code></pre>
|
||||
|
||||
</div>
|
||||
<div id="qa-content-install_binary">
|
||||
|
||||
1. Obtain a Caddy binary:
|
||||
- [from releases on GitHub](https://github.com/caddyserver/caddy/releases) (expand "Assets")
|
||||
- Refer to [Verifying Asset Signatures](/docs/signature-verification) for how to verify the asset signature
|
||||
- [from our download page](/download)
|
||||
- [by building from source](/docs/build) (either with `go` or `xcaddy`)
|
||||
2. [Install Caddy as a system service.](/docs/running#manual-installation) This is strongly recommended, especially for production servers.
|
||||
|
||||
Place the binary in one of your `$PATH` (or `%PATH%` on Windows) directories so you can run `caddy` without typing the full path of the executable file. (Run `echo $PATH` to see the list of directories that qualify.)
|
||||
|
||||
You can upgrade static binaries by replacing them with newer versions and restarting Caddy. The [`caddy upgrade` command](/docs/command-line#caddy-upgrade) can make this easy.
|
||||
|
||||
</div>
|
||||
<div id="qa-content-cfg_ondemand_smallscale">
|
||||
|
||||
On-demand TLS is designed for situations when you either don't control the domain names, or you have too many certificates to load all at once when the server starts. For every other use case, standard TLS automation is likely better suited.
|
||||
|
||||
</div>
|
||||
<div id="qa-content-cfg_ondemand_caddyfile">
|
||||
|
||||
|
||||
In order to prevent abuse, you must first configure an `ask` endpoint so Caddy can check whether it should get a certificate. Add this to your global options at the top:
|
||||
|
||||
```caddy
|
||||
{
|
||||
on_demand_tls {
|
||||
ask http://localhost:5555/check
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Change that endpoint to be something you've set up that will respond with HTTP 200 if the domain given in the `domain=` query parameter is allowed to have a certificate.
|
||||
|
||||
Then create a site block that serves all sites/hosts on the TLS port:
|
||||
|
||||
```caddy
|
||||
https:// {
|
||||
tls {
|
||||
on_demand
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
This is the minimum config to enable Caddy to accept and service TLS connections for arbitrary hosts. This config doesn't invoke any handlers. Usually you'll also [`reverse_proxy`](/docs/caddyfile/directives/reverse_proxy) to your backend application.
|
||||
|
||||
</div>
|
||||
103
new/includes/quick-assist/core.html
Normal file
103
new/includes/quick-assist/core.html
Normal file
|
|
@ -0,0 +1,103 @@
|
|||
{{ include "/includes/quick-assist/structure.html" }}
|
||||
<script>
|
||||
document.addEventListener('alpine:init', () => {
|
||||
Alpine.data('quick_assist', () => ({
|
||||
current: 'start',
|
||||
crumbs: [],
|
||||
structure: quickAssistStructure,
|
||||
|
||||
getQuestion() {
|
||||
const data = this.structure[this.current];
|
||||
return data ? (data.title ?? data.prompt) : "";
|
||||
},
|
||||
getContent() {
|
||||
const content = document.getElementById(`qa-content-${this.current}`);
|
||||
return content ? content.innerHTML : "";
|
||||
},
|
||||
getOptions() {
|
||||
const data = this.structure[this.current];
|
||||
return data ? (data.options ?? []) : [];
|
||||
},
|
||||
hasNext() {
|
||||
return this.getOptions().some(opt => opt.next);
|
||||
},
|
||||
crumbTitle(crumb) {
|
||||
if (crumb.title) {
|
||||
return crumb.title;
|
||||
}
|
||||
const data = this.structure[crumb.id];
|
||||
return data ? (data.title ?? data.prompt) : "";
|
||||
},
|
||||
goto(next, title = null) {
|
||||
if (!next) return true;
|
||||
|
||||
// Do nothing if last crumb is the same as the next state
|
||||
const count = this.crumbs.length;
|
||||
if (count && this.crumbs[count - 1].id === next) return true;
|
||||
|
||||
// Change the page
|
||||
this.current = next;
|
||||
|
||||
// Read backwards through the crumbs and if we find it pop everything after it
|
||||
for (let i = count - 1; i >= 0; i--) {
|
||||
if (this.crumbs[i].id === next) {
|
||||
this.crumbs.splice(i + 1);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// Insert the crumb
|
||||
this.crumbs.push({ id: next, title: title });
|
||||
return false;
|
||||
},
|
||||
reset() {
|
||||
this.current = 'start';
|
||||
this.crumbs = [];
|
||||
}
|
||||
}));
|
||||
});
|
||||
</script>
|
||||
|
||||
<div x-data="quick_assist" class="box box-filled box-capped quick-assist">
|
||||
<div class="box-cap quick-assist-history">
|
||||
<a title="Click quick for slick trick (not AI)" @click="reset()">Quick Assist</a>
|
||||
<template x-for="crumb in crumbs">
|
||||
<a x-text="crumbTitle(crumb)" @click="goto(crumb.id)" />
|
||||
</template>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="quick-assist-question" x-text="getQuestion()"></h3>
|
||||
<div class="quick-assist-content" x-html="getContent()"></div>
|
||||
<div class="quick-assist-options">
|
||||
<template x-for="opt in getOptions()">
|
||||
<div>
|
||||
<a
|
||||
x-show="opt.href ?? false"
|
||||
:href="opt.href"
|
||||
x-text="opt.text ?? ''"
|
||||
class="button reset"
|
||||
/>
|
||||
<a
|
||||
x-show="!opt.href"
|
||||
@click.prevent="goto(opt.next, opt.crumb ?? opt.text)"
|
||||
x-text="opt.text ?? ''"
|
||||
class="button reset"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<a
|
||||
x-show="!hasNext()"
|
||||
@click="reset()"
|
||||
class="button reset"
|
||||
>
|
||||
Reset
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- All the markdown content is hidden by default and loaded by ID -->
|
||||
<div style="display: none;">
|
||||
{{ markdown (include "/includes/quick-assist/content.md") }}
|
||||
</div>
|
||||
275
new/includes/quick-assist/structure.html
Normal file
275
new/includes/quick-assist/structure.html
Normal file
|
|
@ -0,0 +1,275 @@
|
|||
<script>
|
||||
const quickAssistStructure = {
|
||||
start: {
|
||||
prompt: "What are you looking for?",
|
||||
options: [
|
||||
{
|
||||
text: "How to install Caddy",
|
||||
next: "install"
|
||||
},
|
||||
{
|
||||
text: "Help configuring Caddy",
|
||||
next: "configure"
|
||||
},
|
||||
{
|
||||
text: "A solution to a problem",
|
||||
next: "solution"
|
||||
},
|
||||
{
|
||||
text: "An example for my use case",
|
||||
next: "example"
|
||||
}
|
||||
]
|
||||
},
|
||||
install: {
|
||||
prompt: "How do you want to install Caddy?",
|
||||
options: [
|
||||
{
|
||||
text: "OS package manager",
|
||||
next: "install_pkgmgr"
|
||||
},
|
||||
{
|
||||
text: "Docker",
|
||||
next: "install_docker"
|
||||
},
|
||||
{
|
||||
text: "Build from source",
|
||||
next: "install_build"
|
||||
},
|
||||
{
|
||||
text: "Build with plugins",
|
||||
next: "install_with_plugins"
|
||||
},
|
||||
{
|
||||
text: "Pre-built binary",
|
||||
next: "install_binary"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_pkgmgr: {
|
||||
prompt: "Which OS are you using?",
|
||||
options: [
|
||||
{
|
||||
text: "Linux (Debian, Ubuntu, Raspbian)",
|
||||
next: "install_dpkg"
|
||||
},
|
||||
{
|
||||
text: "Linux (Fedora, RedHat, CentOS)",
|
||||
next: "install_rpm"
|
||||
},
|
||||
{
|
||||
text: "Linux (Arch, Manjaro, Parabola)",
|
||||
next: "install_arch"
|
||||
},
|
||||
{
|
||||
text: "macOS",
|
||||
next: "install_mac"
|
||||
},
|
||||
{
|
||||
text: "Windows",
|
||||
next: "install_windows"
|
||||
},
|
||||
{
|
||||
text: "Nix/NixOS",
|
||||
next: "install_nix"
|
||||
},
|
||||
{
|
||||
text: "Android",
|
||||
next: "install_android"
|
||||
},
|
||||
{
|
||||
text: "Other",
|
||||
next: "install_other"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_dpkg: {
|
||||
title: "Install Caddy on Debian-based systems",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#debian-ubuntu-raspbian"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_rpm: {
|
||||
title: "Install Caddy via RPM",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#fedora-redhat-centos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_arch: {
|
||||
title: "Install Caddy on Arch/Manjaro/Parabola Linux",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#arch-linux-manjaro-parabola"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_mac: {
|
||||
title: "Install Caddy on macOS",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#homebrew"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_windows: {
|
||||
title: "Install Caddy on Windows",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#windows"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_nix: {
|
||||
title: "Install Caddy on Nix/Nixpkgs/NixOS",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#nixnixpkgsnixos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_android: {
|
||||
title: "Install Caddy on Android",
|
||||
content: ``,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#termux"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_other: {
|
||||
title: "Miscellaneous install methods",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#fedora-redhat-centos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_docker: {
|
||||
title: "Official Docker image",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#docker"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_build: {
|
||||
title: "Build Caddy from source",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_with_plugins: {
|
||||
title: "Build Caddy with plugins",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build#xcaddy"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_binary: {
|
||||
title: "Install Caddy binary manually",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build#xcaddy"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
configure: {
|
||||
prompt: "What are you trying to configure?",
|
||||
options: [
|
||||
{
|
||||
text: "On-demand TLS",
|
||||
next: "cfg_ondemand"
|
||||
},
|
||||
{
|
||||
text: "Authentication",
|
||||
next: "cfg_authentication"
|
||||
},
|
||||
{
|
||||
text: "Load balancing",
|
||||
next: "cfg_loadbalancing"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand: {
|
||||
prompt: "Do you control the (DNS records of) the domain names you're serving?",
|
||||
options: [
|
||||
{
|
||||
text: "Yes",
|
||||
crumb: "I control the domains",
|
||||
next: "cfg_ondemand_havecontrol"
|
||||
},
|
||||
{
|
||||
text: "No",
|
||||
crumb: "DNS out of my control",
|
||||
next: "cfg_ondemand_ok"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_havecontrol: {
|
||||
prompt: "Do you have hundreds or thousands of your own domain names to serve?",
|
||||
options: [
|
||||
{
|
||||
text: "Yes",
|
||||
crumb: "Lots of domains",
|
||||
next: "cfg_ondemand_ok"
|
||||
},
|
||||
{
|
||||
text: "No",
|
||||
crumb: "Small scale",
|
||||
next: "cfg_ondemand_smallscale"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_smallscale: {
|
||||
title: "You likely don't need on-demand TLS.",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/automatic-https#on-demand-tls"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_ok: {
|
||||
prompt: "Are you using the Caddyfile or JSON to configure Caddy?",
|
||||
options: [
|
||||
{
|
||||
text: "Caddyfile",
|
||||
next: "cfg_ondemand_caddyfile"
|
||||
},
|
||||
{
|
||||
text: "JSON",
|
||||
next: "cfg_ondemand_json"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_caddyfile: {
|
||||
title: "Setting up On-Demand TLS",
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/automatic-https#on-demand-tls"
|
||||
}
|
||||
]
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
.quick-assist-history {
|
||||
font-size: 90%;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: .5em;
|
||||
}
|
||||
|
||||
.quick-assist-history > * {
|
||||
display: inline-block;
|
||||
color: var(--text-color-muted);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.quick-assist-history > *:hover {
|
||||
color: #216688;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.quick-assist-history > :not(:first-child):before {
|
||||
content: '>';
|
||||
margin-right: .5em;
|
||||
display: inline-block;
|
||||
color: #809783;
|
||||
}
|
||||
|
||||
h3.quick-assist-question {
|
||||
font-size: 150%;
|
||||
}
|
||||
|
||||
.quick-assist-options {
|
||||
margin-top: 1.5em;
|
||||
display: grid;
|
||||
gap: 1em;
|
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
||||
}
|
||||
|
||||
.quick-assist button,
|
||||
.quick-assist .button {
|
||||
font-size: 100%;
|
||||
min-height: 3.5em;
|
||||
}
|
||||
|
|
@ -721,6 +721,55 @@ main nav ul > li:hover #autonav {
|
|||
|
||||
|
||||
|
||||
.quick-assist-history {
|
||||
font-size: 90%;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: .5em;
|
||||
}
|
||||
|
||||
.quick-assist-history > a {
|
||||
display: inline-block;
|
||||
color: var(--text-color-muted);
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.quick-assist-history > a:hover {
|
||||
color: #216688;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.quick-assist-history > a:not(:first-child):before {
|
||||
content: '>';
|
||||
margin-right: .5em;
|
||||
display: inline-block;
|
||||
color: #809783;
|
||||
}
|
||||
|
||||
h3.quick-assist-question {
|
||||
font-size: 150%;
|
||||
}
|
||||
|
||||
.quick-assist-options {
|
||||
margin-top: 1.5em;
|
||||
display: grid;
|
||||
gap: 1em;
|
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
||||
}
|
||||
|
||||
.quick-assist-options > div {
|
||||
display: contents;
|
||||
}
|
||||
|
||||
.quick-assist button,
|
||||
.quick-assist .button {
|
||||
font-size: 100%;
|
||||
min-height: 3.5em;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -765,4 +814,4 @@ main nav ul > li:hover #autonav {
|
|||
main nav ul .heading {
|
||||
margin-top: 2.5em !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,448 +0,0 @@
|
|||
quickAssist = function() {
|
||||
let history = [];
|
||||
|
||||
const states = {
|
||||
start: {
|
||||
prompt: "What are you looking for?",
|
||||
options: [
|
||||
{
|
||||
text: "How to install Caddy",
|
||||
next: "install"
|
||||
},
|
||||
{
|
||||
text: "Help configuring Caddy",
|
||||
next: "configure"
|
||||
},
|
||||
{
|
||||
text: "A solution to a problem",
|
||||
next: "solution"
|
||||
},
|
||||
{
|
||||
text: "An example for my use case",
|
||||
next: "example"
|
||||
}
|
||||
]
|
||||
},
|
||||
install: {
|
||||
prompt: "How do you want to install Caddy?",
|
||||
options: [
|
||||
{
|
||||
text: "OS package manager",
|
||||
next: "install_pkgmgr"
|
||||
},
|
||||
{
|
||||
text: "Docker",
|
||||
next: "install_docker"
|
||||
},
|
||||
{
|
||||
text: "Build from source",
|
||||
next: "install_build"
|
||||
},
|
||||
{
|
||||
text: "Build with plugins",
|
||||
next: "install_with_plugins"
|
||||
},
|
||||
{
|
||||
text: "Pre-built binary",
|
||||
next: "install_binary"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_pkgmgr: {
|
||||
prompt: "Which OS are you using?",
|
||||
options: [
|
||||
{
|
||||
text: "Linux (Debian, Ubuntu, Raspbian)",
|
||||
next: "install_dpkg"
|
||||
},
|
||||
{
|
||||
text: "Linux (Fedora, RedHat, CentOS)",
|
||||
next: "install_rpm"
|
||||
},
|
||||
{
|
||||
text: "Linux (Arch, Manjaro, Parabola)",
|
||||
next: "install_arch"
|
||||
},
|
||||
{
|
||||
text: "macOS",
|
||||
next: "install_mac"
|
||||
},
|
||||
{
|
||||
text: "Windows",
|
||||
next: "install_windows"
|
||||
},
|
||||
{
|
||||
text: "Nix/NixOS",
|
||||
next: "install_nix"
|
||||
},
|
||||
{
|
||||
text: "Android",
|
||||
next: "install_android"
|
||||
},
|
||||
{
|
||||
text: "Other",
|
||||
next: "install_other"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_dpkg: {
|
||||
title: "Install Caddy on Debian-based systems",
|
||||
content: `<pre><code class="cmd"><span class="bash">sudo apt install -y debian-keyring debian-archive-keyring apt-transport-https</span>
|
||||
<span class="bash">curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/gpg.key' | sudo gpg --dearmor -o /usr/share/keyrings/caddy-stable-archive-keyring.gpg</span>
|
||||
<span class="bash">curl -1sLf 'https://dl.cloudsmith.io/public/caddy/stable/debian.deb.txt' | sudo tee /etc/apt/sources.list.d/caddy-stable.list</span>
|
||||
<span class="bash">sudo apt update</span>
|
||||
<span class="bash">sudo apt install caddy</span></code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#debian-ubuntu-raspbian"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_rpm: {
|
||||
title: "Install Caddy via RPM",
|
||||
content: `<pre><code class="cmd"><span class="bash">dnf install 'dnf-command(copr)'</span>
|
||||
<span class="bash">dnf copr enable @caddy/caddy</span>
|
||||
<span class="bash">dnf install caddy</span></code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#fedora-redhat-centos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_arch: {
|
||||
title: "Install Caddy on Arch/Manjaro/Parabola Linux",
|
||||
content: `<pre><code class="cmd"><span class="bash">pacman -Syu caddy</span></code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#arch-linux-manjaro-parabola"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_mac: {
|
||||
title: "Install Caddy on macOS",
|
||||
content: `<pre><code class="cmd bash">brew install caddy</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#homebrew"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_windows: {
|
||||
title: "Install Caddy on Windows",
|
||||
content: `<p>Chocolatey:</p> <pre><code class="cmd">choco install caddy</code></pre>
|
||||
<p>Scoop:</p> <pre><code class="cmd">scoop install caddy</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#windows"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_nix: {
|
||||
title: "Install Caddy on Nix/Nixpkgs/NixOS",
|
||||
content: `<ul>
|
||||
<li>Package name: <a href="https://search.nixos.org/packages?channel=unstable&show=caddy&query=caddy"><code>caddy</code></a></li>
|
||||
<li>NixOS module: <a href="https://search.nixos.org/options?channel=unstable&show=services.caddy.enable&query=services.caddy"><code>services.caddy</code></a></li>
|
||||
</ul>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#nixnixpkgsnixos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_android: {
|
||||
title: "Install Caddy on Android",
|
||||
content: `In Termux: <pre><code class="cmd">pkg install caddy</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#termux"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_other: {
|
||||
title: "Miscellaneous install methods",
|
||||
content: ` <h4>Webi</h2>
|
||||
<p>Linux and macOS:</p>
|
||||
<pre><code class="cmd bash">curl -sS https://webi.sh/caddy | sh</code></pre>
|
||||
<p>Windows:</p>
|
||||
<pre><code class="cmd">curl.exe https://webi.ms/caddy | powershell</code></pre>
|
||||
<h4>Ansible</h4>
|
||||
<pre><code class="cmd bash">ansible-galaxy install nvjacobo.caddy</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#fedora-redhat-centos"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_docker: {
|
||||
title: "Official Docker image",
|
||||
content: `<pre><code class="cmd bash">docker pull caddy</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/install#docker"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_build: {
|
||||
title: "Build Caddy from source",
|
||||
content: `<p>Make sure to have <code>git</code> and the latest version of <a href="https://go.dev">Go</a> installed.</p>
|
||||
<pre><code class="cmd"><span class="bash">git clone "https://github.com/caddyserver/caddy.git"</span>
|
||||
<span class="bash">cd caddy/cmd/caddy/</span>
|
||||
<span class="bash">go build</span></code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_with_plugins: {
|
||||
title: "Build Caddy with plugins",
|
||||
content: `
|
||||
<p>
|
||||
<code><a href="https://github.com/caddyserver/xcaddy">xcaddy</a></code> is a command line tool
|
||||
that helps you build Caddy with plugins. A basic build looks like:
|
||||
</p>
|
||||
<pre><code class="cmd bash">xcaddy build</code></pre>
|
||||
<p>
|
||||
To build with plugins, use <code>--with</code>:
|
||||
</p>
|
||||
<pre><code class="cmd bash">xcaddy build \\
|
||||
--with github.com/caddyserver/nginx-adapter
|
||||
--with github.com/caddyserver/ntlm-transport@v0.1.1</code></pre>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build#xcaddy"
|
||||
}
|
||||
]
|
||||
},
|
||||
install_binary: {
|
||||
title: "Install Caddy binary manually",
|
||||
content: `
|
||||
<ol>
|
||||
<li>
|
||||
Obtain a Caddy binary:
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://github.com/caddyserver/caddy/releases">from releases on GitHub</a> (expand
|
||||
"Assets")
|
||||
<ul>
|
||||
<li>Refer to <a href="/docs/signature-verification">Verifying Asset Signatures</a> for how to verify
|
||||
the asset signature</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="/download">from our download page</a></li>
|
||||
<li><a href="/docs/build">by building from source</a> (either with <code>go</code> or <code>xcaddy</code>)
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/docs/running#manual-installation">Install Caddy as a system service.</a> This is strongly recommended,
|
||||
especially for production servers.
|
||||
</li>
|
||||
</ol>
|
||||
<p>Place the binary in one of your <code>$PATH</code> (or <code>%PATH%</code> on Windows) directories so you can run
|
||||
<code>caddy</code> without typing the full path of the executable file. (Run <code>echo $PATH</code> to see the list
|
||||
of directories that qualify.)</p>
|
||||
<p>You can upgrade static binaries by replacing them with newer versions and restarting Caddy. The <a
|
||||
href="/docs/command-line#caddy-upgrade"><code>caddy upgrade</code> command</a> can make this easy.</p>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/build#xcaddy"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
configure: {
|
||||
prompt: "What are you trying to configure?",
|
||||
options: [
|
||||
{
|
||||
text: "On-demand TLS",
|
||||
next: "cfg_ondemand"
|
||||
},
|
||||
{
|
||||
text: "Authentication",
|
||||
next: "cfg_authentication"
|
||||
},
|
||||
{
|
||||
text: "Load balancing",
|
||||
next: "cfg_loadbalancing"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand: {
|
||||
prompt: "Do you control the (DNS records of) the domain names you're serving?",
|
||||
options: [
|
||||
{
|
||||
text: "Yes",
|
||||
breadcrumb: "I control the domains",
|
||||
next: "cfg_ondemand_havecontrol"
|
||||
},
|
||||
{
|
||||
text: "No",
|
||||
breadcrumb: "DNS out of my control",
|
||||
next: "cfg_ondemand_ok"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_havecontrol: {
|
||||
prompt: "Do you have hundreds or thousands of your own domain names to serve?",
|
||||
options: [
|
||||
{
|
||||
text: "Yes",
|
||||
breadcrumb: "Lots of domains",
|
||||
next: "cfg_ondemand_ok"
|
||||
},
|
||||
{
|
||||
text: "No",
|
||||
breadcrumb: "Small scale",
|
||||
next: "cfg_ondemand_smallscale"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_smallscale: {
|
||||
title: "You likely don't need on-demand TLS.",
|
||||
content: `On-demand TLS is designed for situations when you either don't control the domain names,
|
||||
or you have too many certificates to load all at once when the server starts. For every other
|
||||
use case, standard TLS automation is likely better suited.`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/automatic-https#on-demand-tls"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_ok: {
|
||||
prompt: "Are you using the Caddyfile or JSON to configure Caddy?",
|
||||
options: [
|
||||
{
|
||||
text: "Caddyfile",
|
||||
next: "cfg_ondemand_caddyfile"
|
||||
},
|
||||
{
|
||||
text: "JSON",
|
||||
next: "cfg_ondemand_json"
|
||||
}
|
||||
]
|
||||
},
|
||||
cfg_ondemand_caddyfile: {
|
||||
title: "Setting up On-Demand TLS",
|
||||
content: `
|
||||
<p>In order to prevent abuse, you must first configure an <code>ask</code> endpoint so Caddy
|
||||
can check whether it should get a certificate. Add this to your global options at the top:</p>
|
||||
<pre><code>on_demand_tls {
|
||||
ask http://localhost:5555/check
|
||||
}</code></pre>
|
||||
<p>Change that endpoint to be something you've set up that will respond with HTTP 200 if the
|
||||
domain given in the <code>domain=</code> query parameter is allowed to have a certificate.</p>
|
||||
<p>Then create a site block that serves all sites/hosts on the TLS port:</p>
|
||||
<pre><code>https:// {
|
||||
tls {
|
||||
on_demand
|
||||
}
|
||||
}</code></pre>
|
||||
<p>This is the minimum config to enable Caddy to accept and service TLS connections for arbitrary
|
||||
hosts. This config doesn't invoke any handlers. Usually you'll also <code>reverse_proxy</code>
|
||||
to your backend application.</p>`,
|
||||
options: [
|
||||
{
|
||||
text: "Learn more",
|
||||
href: "/docs/automatic-https#on-demand-tls"
|
||||
}
|
||||
]
|
||||
},
|
||||
};
|
||||
|
||||
// show renders the given state into the quick assist box
|
||||
function show(state) {
|
||||
// reset & show prompt/content
|
||||
$_('.quick-assist-question').innerHTML = state.prompt || state.title;
|
||||
$_('.quick-assist-content').innerHTML = state.content || '';
|
||||
$_('.quick-assist-options').innerHTML = '';
|
||||
|
||||
// render options
|
||||
let hasNext = false;
|
||||
if (state.options) {
|
||||
for (const opt of state.options) {
|
||||
if (opt.next) {
|
||||
hasNext = true;
|
||||
}
|
||||
const btn = document.createElement('a');
|
||||
btn.classList.add('button');
|
||||
btn.innerText = opt.text || "";
|
||||
if (opt.next) {
|
||||
btn.dataset.next = opt.next;
|
||||
btn.dataset.breadcrumb = opt.breadcrumb || opt.text;
|
||||
} else if (opt.href) {
|
||||
btn.href = opt.href;
|
||||
}
|
||||
$_('.quick-assist-options').append(btn);
|
||||
}
|
||||
}
|
||||
|
||||
// if there's no "next" state, then this must be the end of
|
||||
// assistance, so show a button to reset
|
||||
if (!hasNext) {
|
||||
const reset = document.createElement('a');
|
||||
reset.classList.add('button', 'reset');
|
||||
reset.innerText = "Reset";
|
||||
$_('.quick-assist-options').append(reset);
|
||||
}
|
||||
|
||||
history.push(state);
|
||||
}
|
||||
|
||||
// reset clears history and shows the start state; it does NOT delete things
|
||||
// from the UI, however.
|
||||
function reset() {
|
||||
history = [];
|
||||
show(states.start);
|
||||
}
|
||||
|
||||
// clicking breadcrumbs should take you to that point in the state machine
|
||||
on('click', '.quick-assist-history a', event => {
|
||||
// remove later breadcrumbs
|
||||
for (let sibling = event.target.nextElementSibling; sibling != null; sibling = event.target.nextElementSibling) {
|
||||
sibling.remove();
|
||||
history.pop();
|
||||
}
|
||||
|
||||
// show the state represented by the breadcrumb clicked
|
||||
if (event.target.dataset.index) {
|
||||
show(history[Number(event.target.dataset.index)]);
|
||||
} else {
|
||||
reset();
|
||||
}
|
||||
});
|
||||
|
||||
// when an option is selected, add breadcrumb and show that state
|
||||
on('click', '.quick-assist-options a[data-next]', event => {
|
||||
const link = document.createElement('a');
|
||||
link.innerText = event.target.dataset.breadcrumb || event.target.innerText;
|
||||
link.dataset.index = history.length;
|
||||
$_('.quick-assist-history').append(link);
|
||||
show(states[event.target.dataset.next]);
|
||||
});
|
||||
|
||||
on('click', '.quick-assist-options a.reset', event => {
|
||||
$_('.quick-assist-history a:first-child').dispatchEvent(new Event('click', { bubbles: true }));
|
||||
})
|
||||
|
||||
// when page loads, show the start of the quick assist
|
||||
reset();
|
||||
};
|
||||
|
||||
|
||||
|
||||
ready(() => {
|
||||
quickAssist();
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue