Implemented OIDC using authlib
This commit is contained in:
Chris Pritchard
2018-10-21 23:38:12 +01:00
committed by GitHub
parent 4540d9a293
commit 396ce14b9f
8 changed files with 189 additions and 9 deletions

View File

@ -37,6 +37,7 @@
<li class="active"><a href="#tabs-ldap" data-toggle="tab">LDAP</a></li>
<li><a href="#tabs-google" data-toggle="tab">Google OAuth</a></li>
<li><a href="#tabs-github" data-toggle="tab">Github OAuth</a></li>
<li><a href="#tabs-oidc" data-toggle="tab">OpenID Connect OAuth</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tabs-general">
@ -325,8 +326,63 @@
<legend>Help</legend>
<p>Fill in all the fields in the left form.</p>
</div>
</div>
</div>
<div class="tab-pane" id="tabs-oidc">
<div class="row">
<div class="col-md-4">
<form role="form" method="post" data-toggle="validator">
<input type="hidden" value="oidc" name="config_tab" />
<fieldset>
<legend>GENERAL</legend>
<div class="form-group">
<input type="checkbox" id="oidc_oauth_enabled" name="oidc_oauth_enabled" class="checkbox" {% if SETTING.get('oidc_oauth_enabled') %}checked{% endif %}>
<label for="oidc_oauth_enabled">Enable OpenID Connect OAuth</label>
</div>
<div class="form-group">
<label for="oidc_oauth_key">Client key</label>
<input type="text" class="form-control" name="oidc_oauth_key" id="oidc_oauth_key" placeholder="OIDC OAuth client ID" data-error="Please input Client key" value="{{ SETTING.get('oidc_oauth_key') }}">
<span class="help-block with-errors"></span>
</div>
<div class="form-group">
<label for="oidc_oauth_secret">Client secret</label>
<input type="text" class="form-control" name="oidc_oauth_secret" id="oidc_oauth_secret" placeholder="OIDC OAuth client secret" data-error="Please input Client secret" value="{{ SETTING.get('oidc_oauth_secret') }}">
<span class="help-block with-errors"></span>
</div>
</fieldset>
<fieldset>
<legend>ADVANCE</legend>
<div class="form-group">
<label for="oidc_oauth_scope">Scope</label>
<input type="text" class="form-control" name="oidc_oauth_scope" id="oidc_oauth_scope" placeholder="e.g. email" data-error="Please input scope" value="{{ SETTING.get('oidc_oauth_scope') }}">
<span class="help-block with-errors"></span>
</div>
<div class="form-group">
<label for="oidc_oauth_api_url">API URL</label>
<input type="text" class="form-control" name="oidc_oauth_api_url" id="oidc_oauth_api_url" placeholder="e.g. https://api.oidc.com/user" data-error="Please input API URL" value="{{ SETTING.get('oidc_oauth_api_url') }}">
<span class="help-block with-errors"></span>
</div>
<div class="form-group">
<label for="oidc_oauth_token_url">Token URL</label>
<input type="text" class="form-control" name="oidc_oauth_token_url" id="oidc_oauth_token_url" placeholder="e.g. https://oidc.com/login/oauth/access_token" data-error="Please input Token URL" value="{{ SETTING.get('oidc_oauth_token_url') }}">
<span class="help-block with-errors"></span>
</div>
<div class="form-group">
<label for="oidc_oauth_authorize_url">Authorize URL</label>
<input type="text" class="form-control" name="oidc_oauth_authorize_url" id="oidc_oauth_authorize_url" placeholder="e.g. https://oidc.com/login/oauth/authorize" data-error="Plesae input Authorize URL" value="{{ SETTING.get('oidc_oauth_authorize_url') }}">
<span class="help-block with-errors"></span>
</div>
</fieldset>
<div class="form-group">
<button type="submit" class="btn btn-flat btn-primary">Save</button>
</div>
</form>
</div>
<div class="col-md-8">
<legend>Help</legend>
<p>Fill in all the fields in the left form.</p>
</div>
</div>
</div>
</div>
</div>
@ -487,9 +543,8 @@
$('#github_oauth_authorize_url').prop('required', false);
}
});
// init validation requirement at first time page load
{% if SETTING.get('google_oauth_enabled') %}
{% if SETTING.get('github_oauth_enabled') %}
$('#github_oauth_key').prop('required', true);
$('#github_oauth_secret').prop('required', true);
$('#github_oauth_scope').prop('required', true);
@ -499,5 +554,38 @@
{% endif %}
// END: Github tab js
// START: OIDC tab js
$('#oidc_oauth_enabled').iCheck({
checkboxClass : 'icheckbox_square-blue',
increaseArea : '20%'
}).on('ifChanged', function(e) {
var is_enabled = e.currentTarget.checked;
if (is_enabled){
$('#oidc_oauth_key').prop('required', true);
$('#oidc_oauth_secret').prop('required', true);
$('#oidc_oauth_scope').prop('required', true);
$('#oidc_oauth_api_url').prop('required', true);
$('#oidc_oauth_token_url').prop('required', true);
$('#oidc_oauth_authorize_url').prop('required', true);
} else {
$('#oidc_oauth_key').prop('required', false);
$('#oidc_oauth_secret').prop('required', false);
$('#oidc_oauth_scope').prop('required', false);
$('#oidc_oauth_api_url').prop('required', false);
$('#oidc_oauth_token_url').prop('required', false);
$('#oidc_oauth_authorize_url').prop('required', false);
}
});
// init validation requirement at first time page load
{% if SETTING.get('oidc_oauth_enabled') %}
$('#oidc_oauth_key').prop('required', true);
$('#oidc_oauth_secret').prop('required', true);
$('#oidc_oauth_scope').prop('required', true);
$('#oidc_oauth_api_url').prop('required', true);
$('#oidc_oauth_token_url').prop('required', true);
$('#oidc_oauth_authorize_url').prop('required', true);
{% endif %}
//END: OIDC Tab JS
</script>
{% endblock %}

View File

@ -83,14 +83,17 @@
<!-- /.col -->
</div>
</form>
{% if SETTING.get('google_oauth_enabled') or SETTING.get('github_oauth_enabled') %}
{% if SETTING.get('google_oauth_enabled') or SETTING.get('github_oauth_enabled') or SETTING.get('oidc_oauth_enabled') %}
<div class="social-auth-links text-center">
<p>- OR -</p>
{% if SETTING.get('oidc_oauth_enabled') %}
<a href="{{ url_for('oidc_login') }}" class="btn btn-block btn-social btn-openid btn-flat"><i class="fa fa-openid"></i> Sign in using
OpenID Connect</a>
{% endif %}
{% if SETTING.get('github_oauth_enabled') %}
<a href="{{ url_for('github_login') }}" class="btn btn-block btn-social btn-github btn-flat"><i class="fa fa-github"></i> Sign in using
Github</a>
{% endif %}
{% if SETTING.get('google_oauth_enabled') %}
<a href="{{ url_for('google_login') }}" class="btn btn-block btn-social btn-google btn-flat"><i class="fa fa-google-plus"></i> Sign in using
Google</a>