SciPost Code Repository

Skip to content
Snippets Groups Projects
Commit fbed9ede authored by Jean-Sébastien Caux's avatar Jean-Sébastien Caux
Browse files

Clean up 2FA pages

parent f3bb3f96
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
scipost/forms.py
+ 2
− 0
View file @ fbed9ede
...@@ -425,6 +425,8 @@ class TOTPDeviceForm(forms.ModelForm): ...@@ -425,6 +425,8 @@ class TOTPDeviceForm(forms.ModelForm):
self.current_user = kwargs.pop('current_user') self.current_user = kwargs.pop('current_user')
super().__init__(*args, **kwargs) super().__init__(*args, **kwargs)
self.initial['token'] = pyotp.random_base32() self.initial['token'] = pyotp.random_base32()
self.fields['name'].widget.attrs.update(
{'placeholder': 'Your choice of a simple memorable name for your device'})
@property @property
def secret_key(self): def secret_key(self):
......
scipost/templates/scipost/totpdevice_confirm_delete.html
+ 2
− 2
View file @ fbed9ede
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
{% block breadcrumb_items %} {% block breadcrumb_items %}
{{block.super}} {{block.super}}
<a href="{% url 'scipost:totp' %}" class="breadcrumb-item">Two factor authentication</a> <a href="{% url 'scipost:totp' %}" class="breadcrumb-item">Two-factor authentication</a>
<span class="breadcrumb-item">Delete {{ object.name }}</span> <span class="breadcrumb-item">Delete {{ object.name }}</span>
{% endblock %} {% endblock %}
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h1 class="highlight">Delete two factor authentication device</h1> <h1 class="highlight">Delete two-factor authentication device</h1>
<br> <br>
<form method="post"> <form method="post">
{% csrf_token %} {% csrf_token %}
......
scipost/templates/scipost/totpdevice_form.html
+ 35
− 30
View file @ fbed9ede
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
{% block breadcrumb_items %} {% block breadcrumb_items %}
{{block.super}} {{block.super}}
<a href="{% url 'scipost:totp' %}" class="breadcrumb-item">Two factor authentication</a> <a href="{% url 'scipost:totp' %}" class="breadcrumb-item">Two-factor authentication</a>
<span class="breadcrumb-item">New device</span> <span class="breadcrumb-item">New device</span>
{% endblock %} {% endblock %}
...@@ -15,35 +15,40 @@ ...@@ -15,35 +15,40 @@
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h1 class="highlight">Set up two factor authentication device</h1> <h1 class="highlight">Set up a device for two-factor authentication</h1>
<p>First of all, make sure you have an authenticator app installed on your mobile device. We recommend the following (many others are possible):</p>
<p> <ul>
An authenticator app lets you generate time dependent security codes on your phone. This adds an important layer of security to your SciPost account. If you don’t already have one, please install a mobile authentication app, for example: <li><a href="http://support.google.com/accounts/bin/answer.py?hl=en&answer=1066447" target="_blank">Google Authenticator</a> (Android/iOS)</li>
<ul> <li><a href="http://guide.duosecurity.com/third-party-accounts" target="_blank">Duo Mobile</a> (Android/iOS)</li>
<li><a href="http://support.google.com/accounts/bin/answer.py?hl=en&answer=1066447" target="_blank">Google Authenticator</a> (Android/iOS)</li> <li><a href="http://aka.ms/dbauthenticator" target="_blank">Authenticator</a> (Windows Phone 7)</li>
<li><a href="http://guide.duosecurity.com/third-party-accounts" target="_blank">Duo Mobile</a> (Android/iOS)</li> </ul>
<li><a href="http://aka.ms/dbauthenticator" target="_blank">Authenticator</a> (Windows Phone 7)</li> <br>
</ul> <p>
<br> To configure two-factor authentication with this device:
To configure your authenticator app: </p>
</p> <ul>
<ul> <li>Go to mobile authentication app on your device, and activate the function to add a new time-based token.</li>
<li>Add a new time-based token.</li> <li>
<li>Use your app to scan the barcode below, or <a href="javascript:;" data-toggle="toggle" data-target="#secret-key">enter your secret key manually</a>.</li> Use your device's camera to scan the barcode below, or <a href="javascript:;" data-toggle="toggle" data-target="#secret-key">enter your secret key manually</a>.
</ul> <br/>
<form method="post"> Your mobile device's authenticator app will then generate a security code.
{% csrf_token %} <br/>
<div class="text-center"> Enter this code in the form here under (also choosing a memorable name for your device).
<img id="qr" data-toggle="qr" data-qr-value="{{ form.get_QR_data }}"> <br/>
<h3 class="p-3" id="secret-key" style="display: none;"><code>{{ form.secret_key }}</code></h3> Clicking on the "Add device" button then completes the 2FA configuration of your account.
</div> <br/>
<p> <strong><em>Next time you log in, make sure you have your device ready at hand!</em></strong>
Enter the security code generated by your mobile authenticator app to make sure it’s configured correctly. <form method="post">
</p> {% csrf_token %}
<div class="text-center">
{{ form|bootstrap }} <img id="qr" data-toggle="qr" data-qr-value="{{ form.get_QR_data }}">
<input type="submit" class="btn btn-primary" value="Add device" /> <h3 class="p-3" id="secret-key" style="display: none;"><code>{{ form.secret_key }}</code></h3>
</form> </div>
{{ form|bootstrap }}
<input type="submit" class="btn btn-primary" value="Add device" />
</form>
</li>
</ul>
</div> </div>
</div> </div>
......
scipost/templates/scipost/totpdevice_list.html
+ 18
− 12
View file @ fbed9ede
{% extends 'scipost/_personal_page_base.html' %} {% extends 'scipost/_personal_page_base.html' %}
{% block pagetitle %}: Two factor authentication{% endblock pagetitle %} {% block pagetitle %}: Two-factor authentication{% endblock pagetitle %}
{% load bootstrap %} {% load bootstrap %}
{% block breadcrumb_items %} {% block breadcrumb_items %}
{{block.super}} {{block.super}}
<span class="breadcrumb-item">Two factor authentication</span> <span class="breadcrumb-item">Two-factor authentication</span>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<h1 class="highlight">Two factor authentication</h1> <h1 class="highlight">Two-factor authentication</h1>
<p> <p>
We strongly recommend to use two factor authentication that adds an extra layer of protection to your SciPost account. Two-factor authentication (2FA, see <a href="https://en.wikipedia.org/wiki/Multi-factor_authentication" target="_blank">Wikipedia</a>) adds an important layer of security to your SciPost account: the logging in procedure verifies something your <em>know</em> (your password) and something your <em>possess</em> (your mobile device). Our 2FA setup makes it nigh impossible for your account to be hijacked. We highly recommend it to all our users.
You will need a mobile device capable or running a mobile authentication application, for example: </p>
<ul> <p>
<li><a href="http://support.google.com/accounts/bin/answer.py?hl=en&answer=1066447" target="_blank">Google Authenticator</a> (Android/iOS)</li> Our implementation requires you to use an authenticator app on your mobile device, which generates time-dependent security codes on your phone. Such a code is then required together with your password upon logging in (the codes get renewed at short time intervals, so don't procrastinate when logging in). If you don’t already have one, you will need to install a mobile authentication app, for example:
<li><a href="http://guide.duosecurity.com/third-party-accounts" target="_blank">Duo Mobile</a> (Android/iOS)</li> <ul>
<li><a href="http://aka.ms/dbauthenticator" target="_blank">Authenticator</a> (Windows Phone 7)</li> <li><a href="http://support.google.com/accounts/bin/answer.py?hl=en&answer=1066447" target="_blank">Google Authenticator</a> (Android/iOS)</li>
</ul> <li><a href="http://guide.duosecurity.com/third-party-accounts" target="_blank">Duo Mobile</a> (Android/iOS)</li>
<a href="{% url 'scipost:totp_create' %}">Set up a new two factor authentication device</a> <li><a href="http://aka.ms/dbauthenticator" target="_blank">Authenticator</a> (Windows Phone 7)</li>
</ul>
(many other choices are available, depending on your device's operating system).
</p>
<p>
Ready to go?
<a class="btn btn-primary m-1 px-1 py-0" href="{% url 'scipost:totp_create' %}">Click here to set up a new two-factor authentication device</a>
</p> </p>
<h3 class="mt-5 mb-3">Your devices</h3> <h3 class="mt-5 mb-3">Your devices</h3>
...@@ -48,7 +54,7 @@ ...@@ -48,7 +54,7 @@
<td colspan="3"> <td colspan="3">
<div class="py-2"> <div class="py-2">
<i class="fa fa-exclamation-triangle text-danger"></i> <i class="fa fa-exclamation-triangle text-danger"></i>
You are not using two factor authentication yet. We strongly recommend to <a href="{% url 'scipost:totp_create' %}">set up two factor authentication</a>. You are not yet using two-factor authentication. We strongly recommend you to <a href="{% url 'scipost:totp_create' %}">set it up</a>.
</div> </div>
</td> </td>
</tr> </tr>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

SciPost Code Repository