来源:https://blog.csdn.net/morninghapppy/article/details/79044026

案例:https://blog.csdn.net/zhihua_w/article/details/79388297?utm_source=copy

php 案例:https://blog.csdn.net/zhemejinnameyuanxc/article/details/83383434

注意!!!

由于前端的加密库关系,后端加密的“明钥”只能是16位的,但是如果你只是在后端使用或前端只是,没有前后交互,你就当我没说。

前端加密之后,后端解密出来的会有看不见的空白符,php 用trim($data)就可以了。

前端页面:

<!--
|| =========================================================
|| Created by ZHIHUA·WEI.
|| Author: ZHIHUA·WEI <zhihua_wei@foxmail.com>
|| Date: 2018/2/27
|| Time: 10:16
|| Project: 基于PHP和JS的AES相互加密解密方法详解(CryptoJS)
|| Power: index.html
|| =========================================================
--> <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="ZHIHUA·WEI,基于PHP和JS的AES相互加密解密方法详解,AES加密解密">
<meta name="description" content="基于PHP和JS的AES相互加密解密方法详解,AES加密解密,PHP开发,ZHIHUA· WEI">
<meta name="author" content="ZHIHUA·WEI">
<meta name="version" content="1.0.0">
<title>基于PHP和JS的AES相互加密解密方法详解(CryptoJS)</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script src="node_modules/crypto-js/crypto-js.js"></script>
</head>
<body>
<div style="margin: 0;text-align:center;">
<h2>基于PHP和JS的AES相互加密解密方法详解(CryptoJS)</h2>
</div>
<div style="margin:0 18%;">
<h4>注意说明:</h4>
<ul>
<li>1. 首先引入CryptoJS包中的aes.js和pad-zeropadding.js</li>
<li>2. 其次引入了jquery.min.js和自己封装的function.js(内容主要是加密解密函数)</li>
<li>3. 加密解密过程中的向量和密钥必须保持一致</li>
<li>4. 进行加密的数据(字符串类型):{"username":"1001","password":"123456","terminal":"PC"}</li>
<li>5. 加密结果是变化的在这不写(变化的原因是因为密钥取得是当前时间)</li>
<li>6. 具体详情可读代码(注释完整)</li>
</ul>
</div> <div style="margin:0 18%;">
<h4>加密测试:</h4>
<ul>
<li>进行加密的数据(字符串类型):{"username":"1001","password":"123456","terminal":"PC"}</li>
<li id="encrypt_key"></li>
<li id="encrypt_string"></li>
</ul>
</div>
<div style="margin:0 18%;">
<h4>解密测试:</h4>
<ul>
<li>
进行解密密的数据(字符串类型、PHP端生成):8bkd/doBOrG3+pTEGkRwk9A3ZLrzXtf10E6Nn9CSoHXRXHydM7xt7PllPhUSItuK8ciF5g6UZ7DruCPQCVNZIJzI4ZHyUMJlV2aHyqMhbEoyS3pK6lPs1MsOeU/H7BZ5
</li>
<li id="decrypt_key">解密的密钥(PHP端生成):</li>
<li id="decrypt_string">JS解密后字符串:</li>
</ul>
</div>
<script> /**
* 接口数据加密函数
* @param str string 需加密的json字符串
* @param key string 加密key(16位)
* @param iv string 加密向量(16位)
* @return string 加密密文字符串
*/
function encrypt(str, key, iv) {
//密钥16位
var key = CryptoJS.enc.Utf8.parse(key);
//加密向量16位
var iv = CryptoJS.enc.Utf8.parse(iv);
var encrypted = CryptoJS.AES.encrypt(str, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.ZeroPadding
});
return encrypted;
} /**
* 接口数据解密函数
* @param str string 已加密密文
* @param key string 加密key(16位)
* @param iv string 加密向量(16位)
* @returns {*|string} 解密之后的json字符串
*/
function decrypt(str, key, iv) {
//密钥16位
var key = CryptoJS.enc.Utf8.parse(key);
//加密向量16位
var iv = CryptoJS.enc.Utf8.parse(iv);
var decrypted = CryptoJS.AES.decrypt(str, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.ZeroPadding
});
return CryptoJS.enc.Utf8.stringify(decrypted);
}
</script>
<script>
//********************************加密**********************************
//获取当前时间戳13位 + 3位字符
var timestamp = new Date().getTime().toString() + "WZH";
//加密密钥16位
var encrypt_key = timestamp;
//加密向量16位
var iv = 'ZZWBKJ_ZHIHUAWEI';
//要加密的数据
var encrypt_string = '{"username":"1001","password":"123456","terminal":"PC"}';
//加密后密文(加密函数在function.js文件中)
var encrypted_string = encrypt(encrypt_string, encrypt_key, iv);
$("#encrypt_key").text("JS加密密钥:" + encrypt_key);
$("#encrypt_string").text("JS加密后字符串:" + encrypted_string);
//********************************结束**********************************
//********************************解密**********************************
//解密密钥16位(解密向量同上)
var decrypt_key = '20180227110419WB';
//解密密文字符串
var decrypt_string = "8bkd/doBOrG3+pTEGkRwk9A3ZLrzXtf10E6Nn9CSoHXRXHydM7xt7PllPhUSItuK8ciF5g6UZ7DruCPQCVNZIJzI4ZHyUMJlV2aHyqMhbEoyS3pK6lPs1MsOeU/H7BZ5";
var decrypted_string = decrypt(decrypt_string, decrypt_key, iv);
$("#decrypt_key").text("解密的密钥(PHP端生成):" + decrypt_key);
$("#decrypt_string").text("JS解密后字符串:" + decrypted_string);
//********************************结束**********************************
</script>
</body>
</html>

php:

<?php

header("Content-type:text/html;charset=utf-8");

//加密向量16位
$iv = "ZZWBKJ_ZHIHUAWEI";
//********************************解密**********************************
//js加密秘钥16位
$decrypt_key = "1572329129539WZH";
//js加密密文字符串
$decrypt_data = "SBItvk+il2X+b4A69xJNOIVN78Ty+G2fBfmQvEbtmw2jWWTMJ24lP21vm+mV0qCK13iAgQoiA/g4NCH/8iNZeA==";
$decrypted = openssl_decrypt($decrypt_data, 'AES-128-CBC',$decrypt_key,OPENSSL_ZERO_PADDING, $iv);
//解密结果
//echo $decrypted;
//********************************结束********************************** //********************************加密********************************** $data = "你好";
$method = 'AES-128-CBC';//加密方法
$result = openssl_encrypt($data, $method, $decrypt_key, 0,$iv);
var_dump($result); $a = openssl_decrypt($result,$method,$decrypt_key,0,$iv);
var_dump($a); //********************************结束**********************************

js前端加密,php后端解密(crypto-js,openssl_decrypt)的更多相关文章

  1. JS前端加密JAVA后端解密详解

    最近有一个加解密的需求,其实没有什么难度,但是实践过程中踩了很多坑,把踩坑过程分享出来. 1.前端JS加密 /** * 加密(需要先加载aes.min.js文件) * @param word * @r ...

  2. Java 前端加密传输后端解密以及验证码功能

    目录(?)[-] 加密解密 1 前端js加密概述 2 前后端加密解密 21 引用的js加密库 22 js加密解密 23 Java端加密解密PKCS5Padding与js的Pkcs7一致 验证码 1 概 ...

  3. 转发:RSA实现JS前端加密,PHP后端解密

    web前端,用户注册与登录,不能直接以明文形式提交用户密码,容易被截获,这时就引入RSA. 前端加密 需引入4个JS扩展文件,jsbn.js.prng4.js.rng.js和rsa.js. <h ...

  4. RSA实现JS前端加密,PHP后端解密

    web前端,用户注册与登录,不能直接以明文形式提交用户密码,容易被截获,这时就引入RSA. 前端加密 需引入4个JS扩展文件,jsbn.js.prng4.js.rng.js和rsa.js. <h ...

  5. rsa实现js前台加密java后台解密

    前段时间写了一个rsa前台加密到后台用java解密,下面共享下实现思路: 准备工作:第三方包是必须的 bcprov-jdk15on-148.jar commons-codec-1.7.jar comm ...

  6. js base64加密,后台解密

    这是为了解决页面发送post请求,传输密码,在页面的控制台可以看到密码的明文,所以先用base64把要传输的密码转换为非明文,然后在后台解密处理. base64encode.js // base64加 ...

  7. angular.js前端分层开发(页面和js代码分离,并将js代码分层)

    一. 抽取模块成base.js文件// 定义模块: var app = angular.module("eshop",['pagination']); 二. 抽取服务成brandS ...

  8. 【转】JS前台加密,java后台解密实现

    因项目需求,需要一些敏感信息进行加密,不能以明文暴露到浏览器. 然后后台进行解密操作 先看一下效果图 未对其加密传输 1.前台JS <script type="text/javascr ...

  9. json传参 js前端和java后端 的简单例子

    下面讲解了从前端js对象-->json字符串-->java字符串---->java map的过程 1,初始化js对象 var param = {}; param.krel = kre ...

随机推荐

  1. iOS提审笔记

    查看苹果各大系统的服务状态:中国区服务:https://www.apple.com/cn/support/systemstatus/美国区服务:https://developer.apple.com/ ...

  2. class-dump的安装和使用

    安装步骤 1.下载地址:http://stevenygard.com/projects/class-dump/ 2.打开终端输入 open /usr/local/bin 3.把dmg文件中的class ...

  3. ASP.NET Core技术研究-探秘Host主机启动过程

    当我们将原有ASP.NET 应用程序升级迁移到ASP.NET Core之后,我们发现代码工程中多了两个类Program类和Startup类. 接下来我们详细探秘一下通用主机Host的启动过程. 一.P ...

  4. python之xlrd和xlwt模块读写excel使用详解

    一.xlrd模块和xlwt模块是什么      xlrd模块是python第三方工具包,用于读取excel中的数据:      xlwt模块是python第三方工具包,用于往excel中写入数据: 二 ...

  5. B 【ZJOI2007】时态同步

    时间限制 : - MS   空间限制 : 265536 KB  评测说明 : 1s 256m 问题描述 小Q在电子工艺实习课上学习焊接电路板.一块电路板由若干个元件组成,我们不妨称之为节点,并将其用数 ...

  6. C 苟富贵

    时间限制 : 15000 MS   空间限制 : 524288 KB 问题描述 你最近买六合彩赚了很多钱,导致一个银行账户存不下了,于是你开设了 N 个账户,第 i 个账户里存有 Ai 元. 你的好友 ...

  7. Prism+MaterialDesign+EntityFramework Core+Postgresql WPF开发总结 之 中级篇

    本着每天记录一点成长一点的原则,打算将目前完成的一个WPF项目相关的技术分享出来,供团队学习与总结. 总共分三个部分: 基础篇主要争对C#初学者,巩固C#常用知识点: 中级篇主要争对WPF布局与Mat ...

  8. Chrome截图截满滑动栏,QQ截长屏,录屏

    1.Chrome截图截满滑动栏 一般我们截图都是用QQ的Ctrl+shift+A,但是网页不好截,这里我们可以用Chrome控制台来截全网页: F12或Ctrl+shift+i打开控制台: 点击一下控 ...

  9. jenkins 脱机下 安装插件失败

    1.首次进入,提示离线 2.网上给出了绝大部分答案是进入Manage Plugins 中在高级下将升级站点的https换成http,但是都没解决我的问题  还是报错,用了大部分时间查阅 最终才发现问题 ...

  10. LeetCode | 第180场周赛--5356矩阵中的幸运数

    给你一个 m * n 的矩阵,矩阵中的数字 各不相同 .请你按 任意 顺序返回矩阵中的所有幸运数. 幸运数是指矩阵中满足同时下列两个条件的元素: 在同一行的所有元素中最小 在同一列的所有元素中最大 示 ...