The function block of user login authentication is used in many projects. As a project separated from the front end, it is necessary to ensure the encryption of sensitive data on the interface.

RSA

RSA public key cryptosystem is a cryptosystem that uses different encryption keys and decryption keys. “It is computationally infeasible to derive decryption keys from known encryption keys” baike.baidu.com/item/RSA%E7…

We use Python server to generate the key pair (public key and private key), the client obtains the public key through API for data encryption, and the server decrypts and verifies the encrypted data through the private key.

The service side

Generate key pair code block:

#! /usr/bin/env python
# _*_ Coding: UTF-8 _*_
from Crypto.PublicKey import RSA

if __name__ == '__main__':
    rsa = RSA.generate(1024)
    private_pem = str(rsa.exportKey(), encoding='utf-8')
    with open('private.pem'.'w') as f:
        f.write(private_pem)
        f.close()
    public_pem = str(rsa.publickey().exportKey(), encoding='utf-8')
    with open('public.pem'.'w') as f:
        f.write(public_pem)
        f.close()
Copy the code

Verify encryption character code block:

#! /usr/bin/env python
# _*_ Coding: UTF-8 _*_
import base64

from Cryptodome.Cipher import PKCS1_v1_5
from Cryptodome.PublicKey import RSA

if __name__ == '__main__':
    string = "Encrypted string"
    with open('private.pem') as file:
        key = file.read().encode()
        file.close()
    cipher = PKCS1_v1_5.new(RSA.importKey(key))
    print(cipher.decrypt(base64.b64decode(string.encode()), 'error').decode())
Copy the code

The client

The demo used here uses static data, which you can modify, and you can copy the following code blocks and save them in index.html with your browser:

<! doctypehtml>
<html>
<head>
    <title>RSA, MedusaSorcerer</title>
    <script src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://passport.cnblogs.com/scripts/jsencrypt.min.js"></script>
    <script type="text/javascript">
        $(function () {$('#submit').click(function () {
                var data = [];
                data['username'] = $('#username').val();
                data['password'] = $('#password').val();
                var publickey = $('#publickey').val();
                encryptSend(data, publickey);
            });
        });

        function encryptSend(data, publicKey) {
            var jsencrypt = new JSEncrypt();
            jsencrypt.setPublicKey(publicKey);
            var enData = new Object(a);for (var key in data) {
                enData[key] = jsencrypt.encrypt(data[key]);
            }
            $('.content').html(JSON.stringify(enData));
        }
    </script>
</head>
<body>
<label for="publickey">Public Key</label><br>
<textarea id="publickey" rows="10" cols="80">
-----BEGIN PUBLIC KEY-----
MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCe89pxqVioNubktqWd/1aNc+C+
IbyWB9Cuqux1ds6QTg35JDKFSUOB6VR9FoK6fDeD3DfN7UifVfAkgOz2MRq1oPJD
6+VnbjYzA6DVaN3gZ/9FjU7ZkhL+eHAgi48lALPJTGwO5nEIZIETSegpZW8HBA1k
Z9Iw0gR9zC7S0imIGQIDAQAB
-----END PUBLIC KEY-----
</textarea>
<span style="float: right;">
    <a href="https://juejin.cn/user/2805609406139950">
        <img src="https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/10/13/16dc5444a4bb2dac~tplv-t2oaga2asx-image.image"><br>Return to MedusaSorcerer to dig gold</a>
</span>
<br>
<label for="input">jsencrypt:</label><br>
username: <input id="username" name="username" type="text"><br>
password: <input id="password" name="password" type="password"><br>
<input id="submit" type="button" value="submit"/>
<div style="padding-top:20px">Output content:</div>
<div class="content" style="width:200px; height:300px;">no</div>
</body>
</html>
Copy the code

Error resolution

When the client returns false:

  • The server considers the encryption key pair format
  • The server tried to change the key pair generation mode. Procedure
  • The server considers encryptionBase64.encodeBase64()Methods the right