ershisan99/coolify
1
0
Fork 0
mirror of https://github.com/ershisan99/coolify.git synced 2025-12-31 05:09:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Implement basic auth for applications

Browse Source
This commit is contained in:
Pascal Klesse
2023-05-15 09:27:49 +02:00
parent f3beb5d8db
commit d14ca724e9
9 changed files with 1861 additions and 1720 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
apps/ui/src/lib/locales/en.json
View File

@@ -196,6 +196,9 @@
"domain_fqdn": "Domain (FQDN)",
"https_explainer": "If you specify <span class='text-settings '>https</span>, the application will be accessible only over https. SSL certificate will be generated for you.<br>If you specify <span class='text-settings '>www</span>, the application will be redirected (302) from non-www and vice versa.<br><br>To modify the domain, you must first stop the application.<br><br><span class='text-white '>You must set your DNS to point to the server IP in advance.</span>",
"ssl_www_and_non_www": "Generate SSL for www and non-www?",
"basic_auth": "Basic Auth",
"basic_auth_user": "User",
"basic_auth_pw": "Password",
"ssl_explainer": "It will generate certificates for both www and non-www. <br>You need to have <span class=' text-settings'>both DNS entries</span> set in advance.<br><br>Useful if you expect to have visitors on both.",
"install_command": "Install Command",
"build_command": "Build Command",

92
apps/ui/src/routes/applications/[id]/index.svelte
View File

@@ -29,27 +29,27 @@
export let application: any;
export let settings: any;
import yaml from 'js-yaml';
import { goto } from '$app/navigation';
import { page } from '$app/stores';
import { onMount } from 'svelte';
import Select from 'svelte-select';
import { get, getAPIUrl, post } from '$lib/api';
import cuid from 'cuid';
import { errorNotification, getDomain, notNodeDeployments, staticDeployments } from '$lib/common';
import Beta from '$lib/components/Beta.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import Setting from '$lib/components/Setting.svelte';
import {
addToast,
appSession,
checkIfDeploymentEnabledApplications,
setLocation,
status,
features,
isDeploymentEnabled,
features
setLocation,
status
} from '$lib/store';
import { t } from '$lib/translations';
import { errorNotification, getDomain, notNodeDeployments, staticDeployments } from '$lib/common';
import Setting from '$lib/components/Setting.svelte';
import Explainer from '$lib/components/Explainer.svelte';
import { goto } from '$app/navigation';
import Beta from '$lib/components/Beta.svelte';
import cuid from 'cuid';
import yaml from 'js-yaml';
import { onMount } from 'svelte';
import Select from 'svelte-select';
import { saveForm } from './utils';
const { id } = $page.params;
@@ -77,6 +77,7 @@
let isCustomSSL = application.settings?.isCustomSSL;
let autodeploy = application.settings?.autodeploy;
let isBot = application.settings?.isBot;
let basicAuth = application.settings?.basicAuth;
let isDBBranching = application.settings?.isDBBranching;
let htmlUrl = application.gitSource?.htmlUrl;
let isHttp2 = application.settings.isHttp2;
@@ -186,6 +187,10 @@
if (name === 'isCustomSSL') {
isCustomSSL = !isCustomSSL;
}
if (name === 'basicAuth') {
basicAuth = !basicAuth;
// TODO: Set user and password
}
if (name === 'isBot') {
if ($status.application.overallStatus !== 'stopped') return;
isBot = !isBot;
@@ -210,7 +215,10 @@
isCustomSSL,
isHttp2,
branch: application.branch,
projectId: application.projectId
projectId: application.projectId,
basicAuth,
basicAuthUser: application.basicAuthUser,
basicAuthPw: application.basicAuthPw
});
return addToast({
message: $t('application.settings_saved'),
@@ -232,6 +240,9 @@
if (name === 'isBot') {
isBot = !isBot;
}
if (name === 'basicAuth') {
basicAuth = !basicAuth;
}
if (name === 'isDBBranching') {
isDBBranching = !isDBBranching;
}
@@ -498,7 +509,7 @@
<div class="title font-bold pb-3">General</div>
{#if $appSession.isAdmin}
<button
class="btn btn-sm btn-primary"
class="btn btn-sm btn-primary"
type="submit"
class:loading={loading.save}
class:bg-orange-600={forceSave}
@@ -751,7 +762,56 @@
on:click={() => !isDisabled && changeSettings('dualCerts')}
/>
</div>
<div class="grid grid-cols-2 items-center">
<Setting
id="basicAuth"
dataTooltip={$t('forms.must_be_stopped_to_modify')}
disabled={isDisabled}
isCenter={false}
bind:setting={basicAuth}
title={$t('application.basic_auth')}
description="Activate basic authentication for your application. <br>Useful if you want to protect your application with a password. <br><br>Use the <span class='font-bold text-settings'>username</span> and <span class='font-bold text-settings'>password</span> fields to set the credentials."
on:click={() => !isDisabled && changeSettings('basicAuth')}
/>
</div>
{#if basicAuth}
<div class="grid grid-cols-2 items-center">
<label for="basicAuthUser">{$t('application.basic_auth_user')}</label>
<input
bind:this={fqdnEl}
class="w-full"
required={!application.settings?.basicAuth}
readonly={isDisabled}
disabled={isDisabled}
name="basicAuthUser"
id="basicAuthUser"
class:border={!application.settings?.basicAuth && !application.basicAuthUser}
class:border-red-500={!application.settings?.basicAuth &&
!application.basicAuthUser}
bind:value={application.basicAuthUser}
placeholder="eg: admin"
/>
</div>
<div class="grid grid-cols-2 items-center">
<label for="basicAuthPw">{$t('application.basic_auth_pw')}</label>
<input
bind:this={fqdnEl}
class="w-full"
required={!application.settings?.basicAuth}
readonly={isDisabled}
disabled={isDisabled}
name="basicAuthPw"
id="basicAuthPw"
class:border={!application.settings?.basicAuth && !application.basicAuthPw}
class:border-red-500={!application.settings?.basicAuth && !application.basicAuthPw}
bind:value={application.basicAuthPw}
placeholder="**********"
/>
</div>
{/if}
{#if isHttps && application.buildPack !== 'compose'}
<div class="grid grid-cols-2 items-center pb-4">
<Setting
@@ -782,7 +842,7 @@
</div>
<div class="grid grid-flow-row gap-2 px-4 pr-5">
<div class="grid grid-cols-2 items-center pt-4">
<div class="grid grid-cols-2 items-center pt-4">
<label for="simpleDockerfile">Dockerfile</label>
<div class="flex gap-2">
<textarea