博客园加密登录--jsencrypt

最新推荐文章于 2022-09-14 10:08:58 发布
最新推荐文章于 2022-09-14 10:08:58 发布
阅读量256 收藏
点赞数
原文链接：http://www.cnblogs.com/wxb0328/p/4641820.html
版权
博客园加密登录--jsencrypt
 
问题由来   
前几天在做项目的时候，发现一般做登录的时候只是一个非常简单的`form`表单，但是这样肯定是不安全的！所以想去看看其他比较流行的网站是怎么实现的。说到安全，我第一个想到的就是去看支付宝，毕竟人家那么大的系统并且管理的是money啊! 结果，支付宝的登录确实复杂，chrome的F12竟然找不到。算了，看看我大博客园吧！
 
下面就是从博客园登录页面copy下来的js登录代码片段
博客园登录时采用的ajax发信http登录请求，就是采用jsencypt加密，以保护用户登录账号安全，一下是js片段代码
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
var return_url = 'http://home.cnblogs.com/u/wxb0328/' ;
        var ajax_url = '/user' + '/signin' ;
        var enable_captcha = false ;
        var is_in_progress = false ;
 
        function setFocus() {
            document.getElementById( 'input1' ).focus();
        }
 
        function check_enter(event) {
            if (event.keyCode == 13) {
                var target = event.target || event.srcElement;
                if (target.id == "input1" ) {
                    if (document.getElementById( 'input1' ).value == '' ) {
                        $( '#tip_input1' ).html( "请输入登录用户名" );
                        return ;
                    }
                    else if (document.getElementById( 'input2' ).value == '' ) {
                        document.getElementById( "input2" ).focus();
                        return ;
                    }
                }
                if (target.id == "input2" ) {
                    if (document.getElementById( 'input2' ).value == '' ) {
                        $( '#tip_input2' ).html( "请输入密码" );
                        return ;
                    }
                }
                signin_go();
            }
        }
 
        function signin_go() {
            if (is_in_progress){
                return ;
            }
 
            $( '#tip_input1' ).html( '' );
            $( '#tip_input2' ).html( '' );
 
            var input1 = $.trim($( '#input1' ).val());
            if (!input1) {
                $( '#tip_input1' ).html( "请输入登录用户名" );
                $( '#input1' ).focus();
                return ;
            }
            var input2 = $.trim($( '#input2' ).val());
            if (!input2) {
                $( '#tip_input2' ).html( "请输入密码" );
                $( '#input2' ).focus();
                return ;
            }
 
            if (enable_captcha)
            {
                var captchaCode = $.trim($( '#captcha_code_input' ).val());
                if (!captchaCode)
                {
                    $( '#tip_captcha_code_input' ).html( "请输入验证码" );
                    $( '#captcha_code_input' ).focus();
                    return ;
                }
            }
 
            $( '#tip_btn' ).html( '提交中...' );
 
            var encrypt = new JSEncrypt();
            encrypt.setPublicKey( 'MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCp0wHYbg/NOPO3nzMD3dndwS0MccuMeXCHgVlGOoYyFwLdS24Im2e7YyhB0wrUsyYf0/nhzCzBK8ZC9eCWqd0aHbdgOQT6CuFQBMjbyGYvlVYU2ZP7kG9Ft6YV6oc9ambuO7nPZh+bvXH0zDKfi02prknrScAKC0XhadTHT3Al0QIDAQAB' );
            var encrypted_input1 = encrypt.encrypt($( '#input1' ).val());
            var encrypted_input2 = encrypt.encrypt($( '#input2' ).val());
            var ajax_data = {
                input1: encrypted_input1,
                input2: encrypted_input2,
                remember: $( '#remember_me' ).prop( 'checked' )
            };
 
            if (enable_captcha){
                var captchaObj = $( "#captcha_code_input" ).get(0).Captcha;
                ajax_data.captchaId = captchaObj.Id;
                ajax_data.captchaInstanceId = captchaObj.InstanceId;
                ajax_data.captchaUserInput = $( "#captcha_code_input" ).val();
            }
            is_in_progress = true ;
            $.ajax({
                url: ajax_url,
                type: 'post' ,
                data: JSON.stringify(ajax_data),
                contentType: 'application/json; charset=utf-8' ,
                dataType: 'json' ,
                headers: {
                    'VerificationToken' : 'v8o6Zbt1bkghAprMyn-NuKazyejPBAjz21CtWG81iKijaJ5u4u37q22GSdkbB9aqIc9deUoBETwjJxGFh0jLPZTSnXc1:EnF2TIFu9G2Kd0NgQuSFsXzcWtXcEj7AdxylV6Rlt7k5rcmZOu3j9bcoPO1kiBKGjg1V0WFB9dj8rWXIW34di1ONV6c1'
                },
                success: function (data) {                   
                    if (data.success) {
                        $( '#tip_btn' ).html( '登录成功，正在重定向...' );
                        location.href = return_url;
                    } else {
                        $( '#tip_btn' ).html(data.message + "<br/><br/>联系 contact@cnblogs.com" );
                        is_in_progress = false ;
                        if (enable_captcha)
                        {
                            captchaObj.ReloadImage();
                        }
                    }
                },
                error: function (xhr) {
                    is_in_progress = false ;
                    $( '#tip_btn' ).html( '抱歉！出错！联系 contact@cnblogs.com' );
                }
            });
        }
 
        $( function () {
            $( '#signin' ).bind( 'click' , function () {
                signin_go();
            }).val( '登 录' );
 
        });
可以看到博客园使用了一个js加密类库：jsencrypt，下面就来了解一下这个类库！
 
js的一个使用OpenSSL加密，解密，秘钥生成类库      
A Javascript library to perform OpenSSL RSA Encryption, Decryption, and Key Generation
这里不对jsencrypt这个js类库做详细的介绍了，大家有兴趣可以去它的github主页学习，其实这个类库还是相对比较简单的，只要稍微看看就应该可以掌握。
 
[github主页]( https://github.com/travist/jsencrypt  )    
[官方网站]( http://travistidwell.com/jsencrypt/  )    
 
PHP关于OpenSSL相关资料
 
[PHP手册OpenSSL]( http://php.net/manual/zh/book.openssl.php  )  
 
关于后台PHP解密  
 
1. 学习PHP手册：[PHP手册OpenSSL]( http://php.net/manual/zh/book.openssl.php  )  
2. 参考博客：[php rsa加密解密实例]( http://blog.csdn.net/clh604/article/details/20224735  )   
 
下面贴出我自己写的测试demo
test.html
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!doctype html>
< html >
   < head >
     < title >JavaScript RSA Encryption</ title >
     < script src = "http://code.jquery.com/jquery-1.8.3.min.js" ></ script >
     < script src = "./jsencrypt.min.js" ></ script >
     < script type = "text/javascript" >
// 使用jsencrypt类库加密js方法，
function encryptRequest(reqUrl, data, publicKey){
     var encrypt = new JSEncrypt();
     encrypt.setPublicKey(publicKey);
     // ajax请求发送的数据对象
     var sendData = new Object();
     // 将data数组赋给ajax对象
     for(var key in data){
         sendData[key] = encrypt.encrypt(data[key]);
     }
 
       $.ajax({
             url: reqUrl,
             type: 'post',
             data: sendData,
             dataType: 'json',
             success: function (data) {                   
                 console.info(data);
             },
             error: function (xhr) {
                 console.error('出错了');
             }
         });
 
}
 
       // Call this code when the page is done loading.
       $(function() {
 
         $('#testme').click(function() {
             
             var data = [];
             data['username']= $('#username').val();
             data['passwd']= $('#passwd').val();
 
             var pkey = $('#pubkey').val();
             encryptRequest('./test.php', data, pkey);
         });
       });
     </ script >
   </ head >
   < body >
     < label for = "pubkey" >Public Key</ label >< br />
     < textarea id = "pubkey" rows = "15" cols = "65" >-----BEGIN PUBLIC KEY-----
MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCBWNoG5LJ3u44Gs8PWs1MaNUQQ
+mOmh+9zWdzSt3ORbmfCDvU+ssW/6QTTgXvWWx7+Wzq/a4fCCQp72zSqXeVhWkTV
ct9Hyp/iMo5K6qOEK76z9z+tP/u99X6qazeXGVMWKkPiyZT4mKAGd/U8Mph9Z1Z5
kOluA7g7heq8PPlE9wIDAQAB
-----END PUBLIC KEY-----</ textarea >< br />
     < label for = "input" >Text to encrypt:</ label >< br />
     name:< input id = "username" name = "username" type = "text" ></ input >< br />
     password:< input id = "passwd" name = "passwd" type = "password" ></ input >< br />
     < input id = "testme" type = "button" value = "submit" />< br />
   </ body >
</ html >
 
test.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<?php
     
// 接收客户端发送过来的经过加密的登录信息
$input = $_POST ;
// 私钥是放在服务器端的，用以验证和解密客户端经过公钥加密后的信息
$private_key = '-----BEGIN RSA PRIVATE KEY-----
MIICXAIBAAKBgQCBWNoG5LJ3u44Gs8PWs1MaNUQQ+mOmh+9zWdzSt3ORbmfCDvU+
ssW/6QTTgXvWWx7+Wzq/a4fCCQp72zSqXeVhWkTVct9Hyp/iMo5K6qOEK76z9z+t
P/u99X6qazeXGVMWKkPiyZT4mKAGd/U8Mph9Z1Z5kOluA7g7heq8PPlE9wIDAQAB
AoGABPQwNX9gznEieWM9JuXrUt+jYbsVQfWG2DYi3Pclt/YwhyAniGU0aas1Ahy9
b3JB95/q2hX2Nxo9iozUsYmzFT99dm2HBsHDnpnUgpyDtGo9sXlhLktyey53UKRx
QJkW5dWWUQfssNrCe08N3vtLiDIy04lRQ8F0eJ/iklzk1HECQQC22pOz7V2K5/50
w9LA9UBSl7wWhTTY5G1gsBEm5tNmbM/ZqCJ1FXB4uuDgz0o0N0x8T8JkkPrRWH5q
GIHFRswVAkEAtRbV8PoLnyT73hxtCw0F17aaI8W5AGhvsbjdA6nMo6byBR5xKN+7
lalfXYEfXPnStHVNSnQVFjN3T06iJV6z2wJBAKj51rLYcLBT8XbQG+vK+FUa+WrK
UGr6tQU7z63mc4dcmLtoP+d5F4XKFNRLWyRj0d+zCU5MGCzrnW7IFOxMn30CQEtv
4N3K/C5mtLmZM9+npChxfBKs2l2OJAFwFjnhcUs3T5jMTq2NTlKRRRXppUwREjJ0
ryb15pbiB7C0/Bz/L4MCQC1AOKKjnqQEpINatjZLkyay0bXBih9GXovz3T1eAxaS
QOEzIC+hGjX+2x1z5jUwwKCgjVUaZdrx470SMJM2Js8=
----- END RSA PRIVATE KEY-----';
 
// 公钥一般存放在登录页面中的一个隐藏域中，但是请注意：公钥和私钥一定要配对，且必须保证私钥的安全
$public_key = '-----BEGIN PUBLIC KEY-----
MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCBWNoG5LJ3u44Gs8PWs1MaNUQQ
+mOmh+9zWdzSt3ORbmfCDvU+ssW/6QTTgXvWWx7+Wzq/a4fCCQp72zSqXeVhWkTV
ct9Hyp/iMo5K6qOEK76z9z+tP/u99X6qazeXGVMWKkPiyZT4mKAGd/U8Mph9Z1Z5
kOluA7g7heq8PPlE9wIDAQAB
----- END PUBLIC KEY-----';
 
/**
  * 使用PHP OpenSSL时，最好先看看手册，了解如何开启OpenSSL 和 其中的一些方法的使用
  *  具体如何使用这里不做赘述，大家去看看PHP手册，什么都就解决了
  */
$pi_key =  openssl_pkey_get_private( $private_key ); //这个函数可用来判断私钥是否是可用的，可用返回资源id Resource id 
$pu_key = openssl_pkey_get_public( $public_key ); //这个函数可用来判断公钥是否是可用的 
 
$decrypted = "" ; 
openssl_private_decrypt( base64_decode ( $input [ 'username' ]), $decrypted , $pi_key ); //私钥解密 
// 这里的这个 $decrypted就是解密客户端发送过来的用户名，至于后续连接数据库验证登录信息的代码，这里也就省略了
echo json_encode( $decrypted );

效果

 
 
总结
 
使用OpenSSL的方式加密可以达到比较安全的级别，在平时项目中非常有用！在以后工作中可以多多学习、使用、积累经验。
 





转载于:https://www.cnblogs.com/wxb0328/p/4641820.html

dekai6197
关注
RSA加密解密在jsencrypt+c#的实现-博客园加密登录-附件资源
03-02
RSA加密解密在jsencrypt+c#的实现-博客园加密登录-附件资源
Cnblogs Wz(博客园网摘)-crx插件
04-02
这样，无论在何处登录博客园，用户都能访问自己收藏的文章。 3. 使用：在博客园网站上，当用户看到一篇感兴趣的文章时，插件会提供一个直观的图标或按钮，点击即可将文章添加到网摘。有些插件还可能支持自定义分类...
博客园文章密码
weixin_33695450的博客
04-08 709
大部分是 Duan2bakasb 如果不对的话那就说明该文章是沙雕文章，别试了，就算问我我也不会告诉你的(应该) 转载于:https://www.cnblogs.com/Duan2baka/p/10672756.html
一个最简单的博客园文章密码暴力破解器-python3实现
chuoweixiao6098的博客
06-15 716
一个最简单的博客园文章密码暴力破解器-python3实现 我之前想写路由器的密码暴力破解器，我手上只有极路由，发现极路由有安全限制，只能允许连续10密码错误，所以我改拿博客园练手。 博客园的博客有个功能是给博文设置一个密码，输入正确的密码才能看到文章的内容。经过测试发现这个密码验证功能，既没有...
搜集博客园邀月工作室的有关加密对称加密的文章
winggyn的专栏
05-14 851
SQL Server 2008中的代码安全（五）：非对称密钥加密 SQL Server 2008中SQL应用系列--目录索引 非对称密钥包含数据库级的内部公钥和私钥，它可以用来加密和解密SQL Server数据库中的数据，它可以从外部文件或程序集中导入，也可以在SQL Server数据库中生成。它不像证书，不可以备份到文件。这意味着一旦在SQL Server中创建了它，没有非常简单
提醒大家尽快修改博客园的密码
weixin_33751566的博客
12-21 89
博客园已经被渗透，为了确保安全，请尽快修改你的密码。
使用jsencrypt实现参数的前端加密
热门推荐
fangdengfu123的博客
04-12 3万+
在做项目中的登录功能时一般是通过form表单或者ajax方式将参数提交到服务器进行验证，在这个过程中，在前端对登录密码先进行一次加密的话，安全性肯定要优于直接提交的方式。最近在看博客园的登录页面时发现博客园的登录是用ajax发送http请求的方式，并在前端采用了加密，是采用jsencypt在前端进行加密的。后面查阅资料后了解到淘宝、京东也有用jsencypt库对登录密码进行前端加密的操作。jsenc
博客园登录 php,博客园加密登录--jsencrypt
weixin_39867212的博客
03-23 285
问题由来前几天在做项目的时候，发现一般做登录的时候只是一个非常简单的form表单，但是这样肯定是不安全的！所以想去看看其他比较流行的网站是怎么实现的。说到安全，我第一个想到的就是去看支付宝，毕竟人家那么大的系统并且管理的是money啊! 结果，支付宝的登录确实复杂，chrome的F12竟然找不到。算了，看看我大博客园吧！下面就是从博客园登录页面copy下来的js登录代码片段博客园登录时采用的aja...
RSA加密解密在jsencrypt+c#的实现-博客园加密登录
weixin_33912246的博客
09-06 649
前几天发现博客园登录时，对登录的数据进行了加密，在我这种菜鸟看来算是高大上的功能了，于是决定研究一下。 后来发现其实园子里或者网上有类似文章，但好像都是php写的demo,并没有c#的示例，所以在收集了各位大牛的文章后，进行加工，形成了今天的demo，所以严格意义上来说此文并非原创。在这里要感谢@趴在巨人肩上的矮子@dudu 首先科普一下相关技术： OpensslOpenSSL 是一...
RSA加密算法（jsencrypt）
weixin_46381556的博客
09-14 510
规则：公钥加密 私钥解密。
博客园登录机制
10-16 248
博客园的登录机制是非常安全的。 登录链接为：https://passport.cnblogs.com/user/signin 该页上主要的js为<script src="/scripts/signin_bundle.js?v=6bCaxODGR5KIkQhpigY5PlgW0FSYoJikUQ5l4hNlWIc1"></script> 主要函数为 function...
Android应用源码(精)仿博客园客户端源码-IT计算机-毕业设计.zip
04-05
这篇文档将深入解析《Android应用源码(精)仿博客园客户端源码》这个项目，旨在为Android移动开发的学习者，尤其是那些正在进行毕业设计的学生，提供详尽的知识点讲解。 一、Android应用基础架构 该项目基于Android...
基于Matlab面板版的卡尔曼小球运动跟踪[Matlab面板版].zip
10-16
大模型实战教程
Day01(1).py
10-16
Day01(1).py
面试-PHP高频面试题整理-面试题合集.zip
10-16
面试_PHP高频面试题整理_面试题合集
(最新整理)中国企业OFDI微观数据2005-2022年
最新发布
10-16
1、资源内容地址：https://blog.csdn.net/2301_79696294/article/details/142994315 2、代码特点：今年全新，手工精心整理，放心引用，数据来自权威，相对于其他人的控制变量数据准确很多,适合写论文做实证用 ，不会出现数据造假问题 3、适用对象：大学生，本科生，研究生小白可用，容易上手！！！ 3、课程引用: 经济学，地理学，城市规划与城市研究，公共政策与管理，社会学，商业与管理
毕业设计论文SpringBoot+Vue茶叶销售系统.docx
10-16
毕业设计论文
用于计算贴片天线的基本参数matlab代码.rar
10-16
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。
毕业设计论文SpringBoot+Vue二手书籍交易系统.docx
10-16
毕业设计论文
自定义JS右键菜单实现 - YoungPay的博客园文章
"非常简洁高效的JS右键菜单 - YoungPay - 博客园1" 这篇文章主要介绍了如何使用JavaScript实现一个简洁且高效的右键菜单。作者YoungPay分享了一个轻量级的解决方案，该方案允许开发者高度自定义菜单内容，适用于...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值