Add UI tab for specifying OpenID Connect options for proxy hosts.

This commit is contained in:
Subv 2020-05-22 11:28:30 -05:00 committed by Jamie Curnow
parent fb8f2c2f9a
commit 8e10b7da37
3 changed files with 86 additions and 8 deletions

View File

@ -11,6 +11,7 @@
<li role="presentation" class="nav-item"><a href="#locations" aria-controls="tab4" role="tab" data-toggle="tab" class="nav-link"><i class="fe fe-layers"></i> <%- i18n('all-hosts', 'locations') %></a></li>
<li role="presentation" class="nav-item"><a href="#ssl-options" aria-controls="tab2" role="tab" data-toggle="tab" class="nav-link"><i class="fe fe-shield"></i> <%- i18n('str', 'ssl') %></a></li>
<li role="presentation" class="nav-item"><a href="#advanced" aria-controls="tab3" role="tab" data-toggle="tab" class="nav-link"><i class="fe fe-settings"></i> <%- i18n('all-hosts', 'advanced') %></a></li>
<li role="presentation" class="nav-item"><a href="#openidc" aria-controls="tab3" role="tab" data-toggle="tab" class="nav-link"><i class="fe fe-settings"></i>OpenID Connect</a></li>
</ul>
<div class="tab-content">
@ -270,6 +271,54 @@
</div>
</div>
</div>
<!-- OpenID Connect -->
<div role="tabpanel" class="tab-pane" id="openidc">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="form-group">
<label class="custom-switch">
<input type="checkbox" class="custom-switch-input" name="openidc_enabled" value="1<%- openidc_enabled ? ' checked' : '' %>">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description">Use OpenID Connect authentication <span class="form-required">*</span></span>
</label>
</div>
</div>
<div class="col-sm-12 col-md-12 openidc">
<div class="form-group">
<label class="form-label">Redirect URI<span class="form-required">*</span></label>
<input type="text" name="openidc_redirect_uri" class="form-control text-monospace" placeholder="" value="<%- openidc_redirect_uri %>" autocomplete="off" maxlength="255" required>
</div>
</div>
<div class="col-sm-12 col-md-12 openidc">
<div class="form-group">
<label class="form-label">Well-known discovery endpoint<span class="form-required">*</span></label>
<input type="text" name="openidc_discovery" class="form-control text-monospace" placeholder="" value="<%- openidc_discovery %>" autocomplete="off" maxlength="255" required>
</div>
</div>
<div class="col-sm-12 col-md-12 openidc">
<div class="form-group">
<label class="form-label">Token endpoint auth method<span class="form-required">*</span></label>
<select name="openidc_auth_method" class="form-control custom-select" placeholder="client_secret_post">
<option value="client_secret_post" <%- openidc_auth_method === 'client_secret_post' ? 'selected' : '' %>>client_secret_post</option>
<option value="client_secret_basic" <%- openidc_auth_method === 'client_secret_basic' ? 'selected' : '' %>>client_secret_basic</option>
</select>
</div>
</div>
<div class="col-sm-12 col-md-12 openidc">
<div class="form-group">
<label class="form-label">Client ID<span class="form-required">*</span></label>
<input type="text" name="openidc_client_id" class="form-control text-monospace" placeholder="" value="<%- openidc_client_id %>" autocomplete="off" maxlength="255" required>
</div>
</div>
<div class="col-sm-12 col-md-12 openidc">
<div class="form-group">
<label class="form-label">Client secret<span class="form-required">*</span></label>
<input type="text" name="openidc_client_secret" class="form-control text-monospace" placeholder="" value="<%- openidc_client_secret %>" autocomplete="off" maxlength="255" required>
</div>
</div>
</div>
</div>
</div>
</form>
</div>

View File

@ -43,7 +43,9 @@ module.exports = Mn.View.extend({
dns_provider_credentials: 'textarea[name="meta[dns_provider_credentials]"]',
propagation_seconds: 'input[name="meta[propagation_seconds]"]',
forward_scheme: 'select[name="forward_scheme"]',
letsencrypt: '.letsencrypt'
letsencrypt: '.letsencrypt',
openidc_enabled: 'input[name="openidc_enabled"]',
openidc: '.openidc'
},
regions: {
@ -113,7 +115,7 @@ module.exports = Mn.View.extend({
} else {
this.ui.dns_provider.prop('required', false);
this.ui.dns_provider_credentials.prop('required', false);
this.ui.dns_challenge_content.hide();
this.ui.dns_challenge_content.hide();
}
},
@ -125,13 +127,24 @@ module.exports = Mn.View.extend({
this.ui.credentials_file_content.show();
} else {
this.ui.dns_provider_credentials.prop('required', false);
this.ui.credentials_file_content.hide();
this.ui.credentials_file_content.hide();
}
},
'change @ui.openidc_enabled': function () {
console.log('Changing');
let checked = this.ui.openidc_enabled.prop('checked');
if (checked) {
this.ui.openidc.show().find('input').prop('required', true);
} else {
this.ui.openidc.hide().find('input').prop('required', false);
}
},
'click @ui.add_location_btn': function (e) {
e.preventDefault();
const model = new ProxyLocationModel.Model();
this.locationsCollection.add(model);
},
@ -167,17 +180,18 @@ module.exports = Mn.View.extend({
data.hsts_enabled = !!data.hsts_enabled;
data.hsts_subdomains = !!data.hsts_subdomains;
data.ssl_forced = !!data.ssl_forced;
data.openidc_enabled = data.openidc_enabled === '1';
if (typeof data.meta === 'undefined') data.meta = {};
data.meta.letsencrypt_agree = data.meta.letsencrypt_agree == 1;
data.meta.dns_challenge = data.meta.dns_challenge == 1;
if(!data.meta.dns_challenge){
data.meta.dns_provider = undefined;
data.meta.dns_provider_credentials = undefined;
data.meta.propagation_seconds = undefined;
} else {
if(data.meta.propagation_seconds === '') data.meta.propagation_seconds = undefined;
if(data.meta.propagation_seconds === '') data.meta.propagation_seconds = undefined;
}
if (typeof data.domain_names === 'string' && data.domain_names) {
@ -185,7 +199,7 @@ module.exports = Mn.View.extend({
}
// Check for any domain names containing wildcards, which are not allowed with letsencrypt
if (data.certificate_id === 'new') {
if (data.certificate_id === 'new') {
let domain_err = false;
if (!data.meta.dns_challenge) {
data.domain_names.map(function (name) {
@ -203,6 +217,12 @@ module.exports = Mn.View.extend({
data.certificate_id = parseInt(data.certificate_id, 10);
}
// OpenID Connect won't work with multiple domain names because the redirect URL has to point to a specific one
if (data.openidc_enabled && data.domain_names.length > 1) {
alert('Cannot use mutliple domain names when OpenID Connect is enabled');
return;
}
let method = App.Api.Nginx.ProxyHosts.create;
let is_new = true;
@ -344,6 +364,9 @@ module.exports = Mn.View.extend({
view.ui.certificate_select[0].selectize.setValue(view.model.get('certificate_id'));
}
});
// OpenID Connect
this.ui.openidc.hide().find('input').prop('required', false);
},
initialize: function (options) {

View File

@ -22,6 +22,12 @@ const model = Backbone.Model.extend({
block_exploits: false,
http2_support: false,
advanced_config: '',
openidc_enabled: false,
openidc_redirect_uri: null,
openidc_discovery: null,
openidc_auth_method: null,
openidc_client_id: null,
openidc_client_secret: null,
enabled: true,
meta: {},
// The following are expansions: