ASP.NET Core:使用 JavaScript 加密并在控制器中解密

目录

[CryptoJS AES JavaScript 库](#CryptoJS AES JavaScript 库)

命名空间

Controller

View

HTML标记

Encryption


如果您喜欢此文章,请收藏、点赞、评论,谢谢,祝您快乐每一天。

示例代码:https://download.csdn.net/download/hefeng_aspnet/92599971

本文将通过示例解释如何在 ASP.Net Core 的控制器中使用JavaScript进行加密和解密。

本文使用CryptoJS AES库通过JavaScript进行加密。

CryptoJS AES JavaScript 库

CryptoJS AES JavaScript库是一个基于JavaScript的加密库,用于在客户端执行加密。完整文档请参见以下链接。

https://cryptojs.gitbook.io/docs

++命名空间++

您需要导入以下命名空间。

C#

using System.Text;

using System.Security.Cryptography;

VB.Net

Imports System.Text

Imports System.Security.Cryptography

Controller

控制器由以下操作方法组成。

处理 GET 操作的操作方法

在这个 Action 方法内部,只会返回 View。

用于处理 POST 操作的操作方法

在这个 Action 方法内部,使用Decrypt方法 解密加密文本,并将其设置到ViewBag对象中。

public class HomeController : Controller

{

public IActionResult Index()

{

return View();

}

HttpPost

public IActionResult Index(string encrypted)

{

ViewBag.DecryptedValue = this.Decrypt(encrypted);

return View();

}

private string Decrypt(string encryptedText)

{

//Secret Key.

string secretKey = "$ASPcAwSNIgcPPEoTSa0ODw#";

//Secret Bytes.

byte[] secretBytes = Encoding.UTF8.GetBytes(secretKey);

//Encrypted Bytes.

byte[] encryptedBytes = Convert.FromBase64String(encryptedText);

//Decrypt with AES Alogorithm using Secret Key.

using (Aes aes = Aes.Create())

{

aes.Key = secretBytes;

aes.Mode = CipherMode.ECB;

aes.Padding = PaddingMode.PKCS7;

byte[] decryptedBytes = null;

using (ICryptoTransform decryptor = aes.CreateDecryptor())

{

decryptedBytes = decryptor.TransformFinalBlock(encryptedBytes, 0, encryptedBytes.Length);

}

return Encoding.UTF8.GetString(decryptedBytes);

}

}

}

View

++HTML标记++

++该视图由使用 ASP.Net TagHelpers++ 创建的 HTML 表单组成,并具有以下属性。
++asp-action++ -- 操作名称。在本例中,名称为 Index。
++asp-controller++ -- 控制器的名称。在本例中,名称为 Home。
++method++ -- 它指定表单方法,即 GET 或 POST。在本例中,它将被设置为 POST。
该表单由一个文本框、一个++提交++按钮和一个 HTML SPAN 元素组成。

Encryption

在 HTML 表单下方,继承了以下 JS 文件。

1.crypto-js.min.js

注意 :加密和解密将使用++AES 加密算法++,其中加密和解密过程将使用对称(相同)密钥。
然后,定义用于加密和解密的密钥,并使用++CryptoJS JavaScript库的++ ++parse++方法将其转换为 BYTE 数组。
单击++"提交"++ 按钮 时,将执行++加密++ JavaScript,并从文本框中捕获纯文本,并将其作为参数传递给++CryptoJS++ JavaScript库的++加密++方法,其中设置以下属性。
模式 -- 它定义了操作模式。这里是++CryptoJS.mode.ECB++(电子密码本)。
填充-- 它指定填充模式。
最后,将加密文本设置到文本框中,并将其值发送到控制器的操作方法。

@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers

@{

Layout = null;

}

<!DOCTYPE html>

<html>

<head>

<meta name="viewport" content="width=device-width" />

<title>Index</title>

</head>

<body>

<form method="post" asp-controller="Home" asp-action="Index">

<input id="txtPlain" type="text" name="encrypted" />

<input type="submit" value="Submit" onclick="Encrypt()" />

<hr />

<span>@ViewBag.DecryptedValue</span>

</form>

<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.2.0/crypto-js.min.js" integrity="sha512-a+SUDuwNzXDvz4XrIcXHuCf089/iJAoN4lmrXJg18XnduKK6YlDHNRalv4yd1N40OKI80tFidF+rqTFKGPoWFQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script type="text/javascript">

//Secret Key.

var secretKey = "$ASPcAwSNIgcPPEoTSa0ODw#";

//Secret Bytes.

var secretBytes = CryptoJS.enc.Utf8.parse(secretKey);

function Encrypt() {

//Read the Plain text.

var txtPlain = document.getElementById("txtPlain");

//Encrypt with AES Alogorithm using Secret Key.

var encrypted = CryptoJS.AES.encrypt(txtPlain.value, secretBytes, {

mode: CryptoJS.mode.ECB,

padding: CryptoJS.pad.Pkcs7

});

//Set the encrypted Text in TextBox.

txtPlain.value = encrypted;

}

</script>

</body>

</html>

如果您喜欢此文章,请收藏、点赞、评论,谢谢,祝您快乐每一天。

相关推荐
Front思2 小时前
electron桌面开发
前端·javascript·electron
前端飞行手册2 小时前
electron应用开发模板,集成多种解决方案
前端·javascript·学习·electron·前端框架·vue
wuhen_n3 小时前
案例分析:从“慢”到“快”,一个后台管理页面的优化全记录
前端·javascript·vue.js
早點睡3904 小时前
ReactNative项目OpenHarmony三方库集成实战:react-native-dropdown-picker
javascript·react native·react.js
武藤一雄11 小时前
从零构建C# OOP 知识体系
windows·microsoft·c#·.net·.netcore·oop
跟着珅聪学java11 小时前
js编写中文转unicode 教程
前端·javascript·数据库
英俊潇洒美少年12 小时前
Vue3 深入响应式系统
前端·javascript·vue.js
颜酱12 小时前
回溯算法实战练习(3)
javascript·后端·算法
我命由我1234513 小时前
React Router 6 - 概述、基础路由、重定向、NavLink、路由表
前端·javascript·react.js·前端框架·ecmascript·html5·js