Skip to main content

rsa encryption with flask and javascript

I'm trying to encrypt the data twice with rsa public keys, I'm getting a false value in javascript when I try to encrypt the data.

What I'm trying to do is

generate the public and private keys in flask,

generate the client public and private keys to use unique to each call,

encrypt the data client side using jsencrypt,

decrypt the data server side using pycryptodome

here's my code in app.py

from flask import Flask
from flask import render_template
from flask import request
import Crypto
from Crypto.PublicKey import RSA
from Crypto import Random
from base64 import b64decode

application = Flask(__name__, static_url_path='/static')
random_generator = Random.new().read
key = RSA.generate(2048, random_generator) #generate public and private keys

@application.route("/")
def hello():
    return "<h1 style='color:blue'>Hello There!</h1>"

@application.route("/register")
def register():
    crypto_key = key.publickey().export_key()
    client_random_generator = Random.new().read
    client_key = RSA.generate(2048, client_random_generator) #generate for client-side encryption
    print(client_key)
    return render_template('register.html', 
        serverCrypto = crypto_key,
        clientCrypto = client_key.publickey().export_key(), 
        randomName1 = client_key.export_key(), 
        randomName2 = None, 
        randomName3 = None)

@application.route("/users", methods=['POST'])
def register_user():
    error = None
    if request.method == "POST":
        data = request.get_json()
        print(data)
        client_key = RSA.importKey(data['clientPrivateKey'])
        first_encrypted = client_key.decrypt(data['encrypted'])
        second_encrypted = key.decrypt(first_encrypted)
        print(second_encrypted)
    return render_template('login.html', error=error)

@application.route("/crypto", methods=['POST'])
def get_crypto():
    if request.method == "POST":
        return None

if __name__ == "__main__":
    application.run(ssl_context=('cert.pem', 'key.pem'))

my html code

<!DOCTYPE html>
<html>
<head>
    <title>Demo!</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jsencrypt/2.3.1/jsencrypt.min.js"></script>
    <script type="text/javascript" src="/static/js/register.js"></script>
    <style type="text/css">
            input { margin-right: 100% }
        </style>
</head>
<body>
<h2>Register</h2>
<form id="register">
    <label>Username: <input name="username" type="text"
                            id="username">
    </label>
    <label>Password: <input name="password" type="password"
                            id="password">
    </label>
    <input type="hidden" name="serverCrypto" id="serverCrypto" value=""/>
    <input type="hidden" name="clientCrypto" id="clientCrypto" value=""/>
    <input type="hidden" name="randomName1" id="randomName1" value=""/>
    <input type="hidden" name="randomName2" id="randomName2" value=""/>
    <input type="hidden" name="randomName3" id="randomName3" value=""/>
    <button type="register">Register</button>
</form>
</body>
</html>

and my javascript code

const apiUrl = 'https://localhost:5000';


function register(username, password, serverCrypto, clientCrypto, randomName1) {
    let data = {"username": username, "passwword": password}

    const encrypt = new JSEncrypt();
    encrypt.setPublicKey(serverCrypto);
    var encrypted = encrypt.encrypt(JSON.stringify(data));
    console.log(encrypted); // shows up as false
    encrypt.setPublicKey(clientCrypto);
    encrypted = encrypt.encrypt(encrypted);
    console.log(encrypted);
    dataToSend = {"cipher": encrypted, "clientPrivateKey": randomName1};

    fetch(apiUrl + '/users', {
        method: 'POST',
        body: JSON.stringify(dataToSend),
        headers: {
            'Content-Type': 'application/json',
        }
    })
    .then(res => {
       if (res.ok) {
         res.json().then(json => {
            console.log(json);
         });
       }
    })
    .catch(error => console.error('Error logging in: ', error));
}

window.addEventListener('load', function(e) {
    document.getElementById('register')
        .addEventListener('submit', processRegisterSubmit);
});

function processRegisterSubmit(e) {
    e.preventDefault();

    let username = document.getElementById('username').value;
    let password = document.getElementById('password').value;
    let serverCrypto = document.getElementById('serverCrypto').value;
    let clientCrypto = document.getElementById('clientCrypto').value;
    let randomName1 = document.getElementById('randomName1').value;
    let randomName2 = document.getElementById('randomName2').value;
    let randomName3 = document.getElementById('randomName3').value;
    

    register(username, password, serverCrypto, clientCrypto, randomName1);
    return false;
}

Via Active questions tagged javascript - Stack Overflow https://ift.tt/IfxcoWk

Comments

Popular posts from this blog

How to show number of registered users in Laravel based on usertype?

i'm trying to display data from the database in the admin dashboard i used this: <?php use Illuminate\Support\Facades\DB; $users = DB::table('users')->count(); echo $users; ?> and i have successfully get the correct data from the database but what if i want to display a specific data for example in this user table there is "usertype" that specify if the user is normal user or admin i want to user the same code above but to display a specific usertype i tried this: <?php use Illuminate\Support\Facades\DB; $users = DB::table('users')->count()->WHERE usertype =admin; echo $users; ?> but it didn't work, what am i doing wrong? source https://stackoverflow.com/questions/68199726/how-to-show-number-of-registered-users-in-laravel-based-on-usertype

Why is my reports service not connecting?

I am trying to pull some data from a Postgres database using Node.js and node-postures but I can't figure out why my service isn't connecting. my routes/index.js file: const express = require('express'); const router = express.Router(); const ordersCountController = require('../controllers/ordersCountController'); const ordersController = require('../controllers/ordersController'); const weeklyReportsController = require('../controllers/weeklyReportsController'); router.get('/orders_count', ordersCountController); router.get('/orders', ordersController); router.get('/weekly_reports', weeklyReportsController); module.exports = router; My controllers/weeklyReportsController.js file: const weeklyReportsService = require('../services/weeklyReportsService'); const weeklyReportsController = async (req, res) => { try { const data = await weeklyReportsService; res.json({data}) console...

Confusion between commands.Bot and discord.Client | Which one should I use?

Whenever you look at YouTube tutorials or code from this website there is a real variation. Some developers use client = discord.Client(intents=intents) while the others use bot = commands.Bot(command_prefix="something", intents=intents) . Now I know slightly about the difference but I get errors from different places from my code when I use either of them and its confusing. Especially since there has a few changes over the years in discord.py it is hard to find the real difference. I tried sticking to discord.Client then I found that there are more features in commands.Bot . Then I found errors when using commands.Bot . An example of this is: When I try to use commands.Bot client = commands.Bot(command_prefix=">",intents=intents) async def load(): for filename in os.listdir("./Cogs"): if filename.endswith(".py"): client.load_extension(f"Cogs.{filename[:-3]}") The above doesnt giveany response from my Cogs ...