AX3 OTP Auth

AX3 OTP Auth 是一个遵循HTOP指南生成和验证一次性密码的非常简单的Django库。

安装

Axes可以从PyPI包轻松安装

$ pip install django-axes

安装包后，需要配置项目设置。

1. 将 ax3_OTP 添加到您的 INSTALLED_APPS:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',

    # Axes app can be in any position in the INSTALLED_APPS list.
    'ax3_OTP_Auth',
]

2. 将 ax3_OTP_Auth.backends.OTPAuthBackend 添加到 AUTHENTICATION_BACKENDS 的顶部

AUTHENTICATION_BACKENDS = [
    'ax3_OTP_Auth.backends.OTPAuthBackend',

    # Django ModelBackend is the default authentication backend.
    'django.contrib.auth.backends.ModelBackend',
]

3. 将以下内容添加到您的 urls.py

urlpatterns = [
    path('OTP-Auth/', include('ax3_OTP_Auth.urls', namespace='otp_auth')),
]

4. 在模板中创建html按钮

<button class="js-otp-auth" type="button" otp-login="{% url 'otp_auth:start' %}" otp-redirect="{% url 'login' %}">
    Login
</button>

5. 创建打开OTP窗口的JavaScript

$(() => {
    $('.js-otp-auth').on('click', function () {
        let redirect = $(this).attr('otp-redirect');
        let OTPLoginUrl = $(this).attr('otp-login');

        let width = 420;
        let height = 470;
        let top = (screen.height / 2) - (height / 2);
        let left = (screen.width / 2) - (width / 2);

        window.open(`${window.origin}${OTPLoginUrl}?redirect=${redirect}`, '_blank', `location=yes, scrollbars=yes, status=yes, width=${width}, height=${height}, top=${top}, left=${left}`);
    });
});

配置

如果您需要为整个流程传递任何参数，可以使用 OTP_AUTH_PARAMS

`OTP_AUTH_PARAMS = ['param']`

如果您需要更改生命周期缓存值，可以使用 OTP_AUTH_TTL

`OTP_AUTH_TTL = 60 * 60 * 5  # 5 minutes`

如果您需要更改短信消息

`OTP_AUTH_MESSAGE = 'Utiliza {} como código de inicio de sesión.`

配置允许的国家列表：哥伦比亚 = 57 阿根廷 = 54 玻利维亚 = 591 智利 = 56 哥斯达黎加 = 506 古巴 = 53 多米尼加共和国 = 809 厄瓜多尔 = 593 危地马拉 = 502 墨西哥 = 52 秘鲁 = 51

OTP_AUTH_COUNTRIES_CODES = [57, 54]

使用以下变量更改颜色、品牌名称和标志

OTP_PRIMARY_COLOR = '#eb6806'
OTP_BACKGROUND_BTN = '#eb6806'
OTP_BACKGROUND_BTN_HOVER = '#000'
OTP_COLOR_TEXT_BTN = '#fff'
OTP_COLOR_TEXT_BTN_HOVER = '#fff'
OTP_BRAND_NAME = 'Axiacore'
OTP_BRAND_IMG = 'user-relative-path'

NSN配置

AX3 OTP使用NSN AWS服务发送消息，请创建一个组和具有以下策略的AIM用户

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "sns:Publish",
                "sns:SetSMSAttributes",
                "sns:GetSMSAttributes"
            ],
            "Resource": "*"
        }
    ]
}

将AIM用户凭证设置为您自己的设置

OTP_AUTH_AWS_ACCESS_KEY_ID = ''
OTP_AUTH_AWS_SECRET_ACCESS_KEY = ''
OTP_AUTH_AWS_DEFAULT_REGION = 'us-west-2'

身份验证和授权

经过身份验证的用户需要一个OTP，此OTP由AWS SNS服务发送，一旦代码有效，系统将返回一个令牌，然后必须使用该令牌来获取请求的电话号码。为此，您可以使用'get_phone_number'

hotp = HOTP(session_key=request.session.session_key)
phone_number = htop.get_phone_number(code='123')

自定义短信网关

将OTP_CUSTOM_SMS_GATEWAY设置为您自己的设置，并包含您函数的路径，函数必须接收country_code、phone_number和message

OTP_CUSTOM_SMS_GATEWAY = 'app.utils.send_sms'

样式SASS

在提交任何更改之前，必须先编译SASS文件，以便用于开发目的。

从此链接安装node

https://node.org.cn/en/

然后安装sass

$ sudo npm install -g sass

会要求您输入密码，请输入计算机用户的密码。

编译SASS

要更改网页的样式，您需要编辑Sass文件，然后在项目的根目录下运行此命令以将其编译为CSS

$ sass --watch ax3_OTP_Auth/static/otp_auth/sass/styles.sass ax3_OTP_Auth/static/otp_auth/css/styles.css