2020-02-27 Django 前端应用层密码加密 RSA

背景

  • 说明

RSA算法是当今使用最广泛,安全度最高的加密算法。

  • RSA算法的安全性理论基础

根据百科介绍,对极大整数做因数分解的难度决定了RSA算法的可靠性。换言之,对一极大整数做因数分解愈困难,RSA算法愈可靠。假如有人找到一种快速因数分解的算法的话,那么用RSA加密的信息的可靠性就肯定会极度下降。但找到这样的算法的可能性是非常小的。今天只有短的RSA钥匙才可能被强力方式解破。到目前为止,世界上还没有任何可靠的攻击RSA算法的方式。只要其钥匙的长度足够长,用RSA加密的信息实际上是不能被解破的。

  • RSA算法使用

通常使用公钥进行加密,使用私钥进行解密。
如上所说,钥匙的长度尽量设置长一些,在实际应用过程中,通常设置为1024或2048

  • 其他

前端使用js库: https://github.com/travist/jsencrypt

后端使用库:pip install pycrypto

基本逻辑

浏览器请求页面---后端把公钥传递给前端--前端js代码利用公钥加密敏感信息传递给后端--后端使用私钥解密获得数据

自己生成密钥对
from Crypto import Random
from Crypto.PublicKey import RSA

random_generator = Random.new().read
rsa = RSA.generate(1024, random_generator)
rsa_private_key = rsa.exportKey()
with open('private.pem', 'w') as f:
    f.write(rsa_private_key.decode())
rsa_public_key = rsa.publickey().exportKey()
with open('public.pem', 'w') as f:
    f.write(rsa_public_key.decode())

然后从文件种拷贝密钥对到 setting.py 文件中, 按照我示例格式哦

后端配置:

settinigs.py

RSA_PUBLIC_KEY = "<自己生成的公钥 (调整为一行,不含-----包裹的部分)>"

RSA_PRIVATE_KEY = "-----BEGIN RSA PRIVATE KEY-----\n" + "<自己生成的私钥 (调整为一行,不含-----包裹的部分)>" + "\n-----END RSA PRIVATE KEY-----"

后端渲染页面
public_key = settings.RSA_PUBLIC_KEY
            return render(request, "article/login.html", {'public_key': public_key})
前端页面js
    function doLogin() {
        var password_old = $("#MemberPassword").val();
        var encrypt = new JSEncrypt();
        encrypt.setPublicKey("{{ public_key|safe }}");
        var pass_new = encrypt.encrypt(password_old);
        $("#MemberPassword").val(pass_new);
        $("#login_button").submit();
    }

把这个按钮放到表单外面

<button class="layui-btn" style="margin-top: 15px;" onclick="doLogin()">登录</button>

这样,点击登录按钮就会重新生成加密密码填写到表单中,然后提交

后端接收解密
password = request.POST.get("password", '')
password = decrypt_pass(password).decode()

其中解密函数

from Crypto import Random
from Crypto.PublicKey import RSA
from Crypto.Cipher import PKCS1_v1_5, PKCS1_OAEP
from django.conf import settings
import base64


def decrypt_pass(password):
    random_generator = Random.new().read
    RSA.generate(1024, random_generator)
    rsakey = RSA.importKey(settings.RSA_PRIVATE_KEY)
    cipher = PKCS1_v1_5.new(rsakey)
    return cipher.decrypt(base64.b64decode(password), random_generator)

接下来验证密码就好了。

参考资料

http://blog.nsfocus.net/python-js-encrypts-post-form-data-rsa-algorithm/
https://www.cnblogs.com/himismad/p/9722419.html

  • 3
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
### 回答1: 将 Vue-element-admin 与 Django 后台对接需要进行以下步骤: 1. 编写 Django 后台 API 接口,提供数据交互服务; 2. 在 Vue-element-admin 中安装 Axios,用于向后台发送请求; 3. 在 Vue-element-admin 中编写与后台 API 对接的代码; 4. 在 Vue-element-admin 中使用前端路由(vue-router)跳转到对应页面。 具体操作步骤如下: 1. 编写 Django 后台 API 接口 在 Django 中编写后台 API 接口,提供数据交互服务。可以使用 Django REST framework 来快速构建 RESTful API。 2. 安装 Axios 在 Vue-element-admin 中安装 Axios,可以使用以下命令: ``` npm install axios ``` 3. 编写与后台 API 对接的代码 在 Vue-element-admin 中编写与后台 API 对接的代码,可以使用 Axios 发送请求,例如: ``` import axios from 'axios' export default { // 获取用户列表 getUsers() { return axios.get('/api/user/') }, // 创建用户 createUser(user) { return axios.post('/api/user/', user) }, // 删除用户 deleteUser(id) { return axios.delete(`/api/user/${id}/`) } } ``` 4. 使用前端路由跳转到对应页面 在 Vue-element-admin 中使用前端路由(vue-router)跳转到对应页面,例如: ``` import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) export default new Router({ routes: [ { path: '/', name: 'Dashboard', component: () => import('@/views/dashboard/index') }, { path: '/user', name: 'User', component: () => import('@/views/user/index') }, { path: '/user/create', name: 'CreateUser', component: () => import('@/views/user/create') }, { path: '/user/:id/edit', name: 'EditUser', component: () => import('@/views/user/edit') } ] }) ``` 以上就是将 Vue-element-admin 与 Django 后台对接的基本步骤,具体实现还需要根据具体需求进行调整。 ### 回答2: Vue-element-admin是一个基于Vue.js和Element UI开发的后台管理系统框架,而Django是一个基于Python的Web开发框架。对接Vue-element-admin和Django后台,需要以下几个步骤: 1. 了解Vue-element-admin的架构和功能:首先需要熟悉Vue-element-admin的组件和页面结构,了解其提供的基本功能和接口。 2. 安装Django并配置数据库:在Django中创建一个新的项目,并配置好数据库信息,确保Django与数据库的连接正常。 3. 创建Django的URL和路由:根据Vue-element-admin的路由规则,在Django中创建对应的URL和路由,用于响应前端请求。 4. 编写Django的视图函数:编写Django的视图函数,处理前端请求并返回相应的数据。可以根据需要,操作数据库、调用其他后台服务等。 5. 前后端数据交互:根据Vue-element-admin的接口规范,与Django进行数据交互。可以使用axios库发送请求,同时使用Django的序列化器将数据转化为JSON格式返回给前端。 6. 数据权限控制:在Vue-element-admin中,可以根据用户权限动态显示菜单和路由。可以在Django中实现相应的权限控制逻辑,根据用户角色或权限限制相应的数据访问。 7. 进行前后端联调和测试:在前后端对接完成后,通过联调和测试确保系统的正常运行。可以使用开发者工具进行调试,在两端之间传递数据并检查返回结果。 总结起来,对接Vue-element-admin和Django后台,需要根据Vue-element-admin的组件和路由规则,在Django中进行相应的配置和编码,实现前后端的数据交互和权限控制。通过以上步骤,可以构建一个完整的Vue-element-admin后台管理系统,使用Django作为后台支持。 ### 回答3: vue-element-admin 是一个基于 Vue.js 和 Element UI 的后台管理系统模板。而 Django 是一个使用 Python 编写的高级 Web 开发框架。 对接 vue-element-admin 和 Django 后台的过程中,需要进行以下几个步骤: 1. 安装和配置 vue-element-admin 和 Django 工程。 - 首先,在本地搭建好 Django 工程,确保能够正常运行。 - 然后,在 vue-element-admin 的基础上建立 Vue.js 工程,配置好相关依赖。 - 将 Django 与 vue-element-admin 的工程整合在一起,确保两者可以同时运行。 2. 定义接口和数据交互方式。 - 在 Django 的工程中,根据需求定义后台接口,用于前后台数据的交互。 - 在 vue-element-admin 的工程中,使用 axios 等ajax库,通过 HTTP 请求与 Django 后台进行数据交互。 3. 配置路由和权限控制。 - 在 Django 的工程中,配置好路由,将前端请求映射到对应的后端视图函数。 - 在 vue-element-admin 的工程中,配置好前端路由,确保前端页面可以正确访问,并实现权限控制策略。 4. 前后台数据的处理和展示。 - 在 vue-element-admin 的工程中,通过获取 Django 后台的数据,对数据进行处理和展示。 - 可以使用 vue.js 的组件化开发思想,将数据展示和页面交互的逻辑进行拆分和重复利用。 通过以上步骤的对接,vue-element-admin 和 Django 后台可以实现前后台的数据交互、权限控制和页面展示。以此来构建一个完整的后台管理系统。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值