Django拓展 圖片驗證碼與redis簡單實現

Django框架

拓展 圖片驗證碼與redis簡單實現

前言

需要額外安裝下面兩個庫

pip install pillow
pip install django-redis

生成圖形驗證碼源代碼下載

redis配置

在項目的settings.py中配置redis數據庫的連接

CACHES = {
    "default": {
        "BACKEND": "django_redis.cache.RedisCache",
        "LOCATION": "redis://127.0.0.1:6379/3",
        "OPTIONS": {
            "CLIENT_CLASS": "django_redis.client.DefaultClient",
        }
    },
    "verification_code": {
        "BACKEND": "django_redis.cache.RedisCache",
        "LOCATION": "redis://127.0.0.1:6379/4",
        "OPTIONS": {
            "CLIENT_CLASS": "django_redis.client.DefaultClient",
        }
    },

}

redis://127.0.0.1:6379/3 其中6379是redis的端口號,3指的是第三個數據庫
default,verification_code是自己命的名,在後文中使用

視圖設置

from tool.verification import ValidCodeImg # 從本地導入我們已經寫好的創建圖片驗證碼的代碼
from django_redis import get_redis_connection	# 導入redis數據庫操作相關的寶
def verification_code(request,uuid_id):
    img_obj = ValidCodeImg('./tool/kumo.TTF')
    img_data,verification_str = img_obj.getValidCodeImg()
    try: # 避免發生異常
        img_conn = get_redis_connection('verification_code')
        img_conn.setex(str(uuid_id),60,verification_str) # 60指的是過期時間
    except:
        pass
    return HttpResponse(img_data,content_type='image/png') # 使用HttpResponse返回圖片

結果展示

訪問下面的url(先使用自己知道的一個uuid,便於觀察)
http://127.0.0.1:8000/users/verification_code/57c807a3-cae8-42c6-b8a1-77dda700db29
我們可以看到網頁返回了驗證碼的圖片

接下來我們再看看數據庫中

這樣便成功的達到了我們想要的目的
我們可以簡單的修改一下原先img標籤的src屬性

<img src="{% url 'users:img_verification' '57c807a3-cae8-42c6-b8a1-77dda700db29'%}" alt="驗證碼" title="點擊刷新">

如下圖,我們所要的驗證碼就出現在了框框中,只需要簡單的一些css樣式處理即可

我們只做到了把圖片顯示出來,我們還需調整其css樣式,以及點擊切換的效果等,這些細節部分先不介紹,包括uuid的隨機生成,需要結合前端的js代碼來實現真正的圖片驗證碼\