上传富文本插入文件时报错:JSON parse error: Unexpected character解决办法

embedded/2024/9/20 11:19:43/ 标签: json

方式一(加密解密):

1.前端

(1)安装 crypto-js

npm install crypto-js

(2)util下引入asc.js

asc.js

import CryptoJS from 'crypto-js'// 需要和后端一致
const KEY = CryptoJS.enc.Utf8.parse('genePiCloudSecre');
const IV = CryptoJS.enc.Utf8.parse('genePiCloudSecre');export default {/*** 加密* @param {*} word* @param {*} keyStr* @param {*} ivStr*/encrypt (word, keyStr, ivStr) {let key = KEY;let iv = IV;if (keyStr) {key = CryptoJS.enc.Utf8.parse(keyStr);iv = CryptoJS.enc.Utf8.parse(ivStr);}let srcs = CryptoJS.enc.Utf8.parse(word);var encrypted = CryptoJS.AES.encrypt(srcs, key, {iv: iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.ZeroPadding});return CryptoJS.enc.Base64.stringify(encrypted.ciphertext);},/*** 解密* @param {*} word* @param {*} keyStr* @param {*} ivStr*/decrypt (word, keyStr, ivStr) {let key = KEY;let iv = IV;if (keyStr) {key = CryptoJS.enc.Utf8.parse(keyStr);iv = CryptoJS.enc.Utf8.parse(ivStr);}let base64 = CryptoJS.enc.Base64.parse(word);let src = CryptoJS.enc.Base64.stringify(base64);let decrypt = CryptoJS.AES.decrypt(src, key, {iv: iv,mode: CryptoJS.mode.CBC,padding: CryptoJS.pad.ZeroPadding});let decryptedStr = decrypt.toString(CryptoJS.enc.Utf8);return decryptedStr.toString();}
}

在这里插入图片描述

(3)页面引用

import asc from '@/utils/asc';/** 提交按钮 */
submitForm() {this.$refs["form"].validate(valid => {if (valid) {this.form.content = asc.encrypt(this.form.content,null,null);//加密}});
},

2.后端

(1)SecurityUtils

/*** 安全服务工具类** @author ruoyi*/
public class SecurityUtils {/**** key和iv值需要和前端一致*/public static final String KEY = "genePiCloudSecre";public static final String IV = "genePiCloudSecre";/*** 加密方法** @param data 要加密的数据* @param key  加密key* @param iv   加密iv* @return 加密的结果*/public static String encrypt(String data, String key, String iv) {if (StringUtils.isBlank(key)){key=KEY;iv=IV;}try {//"算法/模式/补码方式"NoPadding PkcsPaddingCipher cipher = Cipher.getInstance("AES/CBC/NoPadding");int blockSize = cipher.getBlockSize();byte[] dataBytes = data.getBytes();int plaintextLength = dataBytes.length;if (plaintextLength % blockSize != 0) {plaintextLength = plaintextLength + (blockSize - (plaintextLength % blockSize));}byte[] plaintext = new byte[plaintextLength];System.arraycopy(dataBytes, 0, plaintext, 0, dataBytes.length);SecretKeySpec keyspec = new SecretKeySpec(key.getBytes(), "AES");IvParameterSpec ivspec = new IvParameterSpec(iv.getBytes());cipher.init(Cipher.ENCRYPT_MODE, keyspec, ivspec);byte[] encrypted = cipher.doFinal(plaintext);return new Base64().encodeToString(encrypted);} catch (Exception e) {e.printStackTrace();return null;}}/*** 解密方法** @param data 要解密的数据* @param key  解密key* @param iv   解密iv* @return 解密的结果*/public static String desEncrypt(String data, String key, String iv) {if (StringUtils.isBlank(key)){key=KEY;iv=IV;}try {byte[] encrypted1 = new Base64().decode(data);Cipher cipher = Cipher.getInstance("AES/CBC/NoPadding");SecretKeySpec keySpec = new SecretKeySpec(key.getBytes(), "AES");IvParameterSpec ivSpec = new IvParameterSpec(iv.getBytes());cipher.init(Cipher.DECRYPT_MODE, keySpec, ivSpec);byte[] original = cipher.doFinal(encrypted1);return new String(original).trim();} catch (Exception e) {e.printStackTrace();return null;}}
}

(2)使用

/**
* 新增学生信息测试
*/
@PostMapping
public AjaxResult add(@RequestBody TStudentTest tStudentTest) {tStudentTest.setContent(SecurityUtils.desEncrypt(tStudentTest.getContent(), null, null));return toAjax(tStudentTestService.save(tStudentTest));
}/**
* 修改学生信息测试
*/
@PutMapping
public AjaxResult edit(@RequestBody TStudentTest tStudentTest) {tStudentTest.setContent(SecurityUtils.desEncrypt(tStudentTest.getContent(), null, null));return toAjax(tStudentTestService.updateById(tStudentTest));
}

http://www.ppmy.cn/embedded/114141.html

相关文章

前端开发规范

前端开发规范 编写背景:当前项目前端开发过程中,每个人有不同的编码风格,这就导致同一个模块不同人开发时可能产生阅读不方便的情况,这对于项目的长久开发是不利的,所以编写这套前端开发规范。 编写目的:避…

google map小叉号不显示

背景需求 需要在uniapp中接入google地图,研究了一番,都没有找到合适的,现在说一下教程。 效果图 前期工作 这两点缺一不可,否则你啥也看不到。 1、电脑安装L-O-U梯 用于访问G-OO-G-LE的API或者创建google map key。 2、手机安装L-O-U梯 用于显示google地图。我就是手…

C++ ——string的模拟实现

目录 前言 浅记 1. 构造函数 2. 拷贝构造函数 2.1 拷贝构造传统写法 2.2 拷贝构造现代写法 3. swap 4. 赋值重载 4.1 赋值重载的传统写法 4.2 赋值重载的现代写法1 4.3 赋值重载的现代写法2 5. 析构函数 6. reserve(扩容) 7. push_back&am…

Windows10安装cuda11.3.0+cudnn8.5.0,以及创建conda虚拟环境(pytorch)

1、检查电脑驱动版本为561.09&#xff0c;选择cuda版本&#xff0c;下图可知cuda版本<12.6。 nvidia-smi #查看驱动版本&#xff0c;以及最大可以安装的cuda版本 2、Anaconda3-2024.06-1-Windows-x86_64.exe下载&#xff1a; 官网&#xff1a;https://www.baidu.com/link?…

Unity教程(十五)敌人战斗状态的实现

Unity开发2D类银河恶魔城游戏学习笔记 Unity教程&#xff08;零&#xff09;Unity和VS的使用相关内容 Unity教程&#xff08;一&#xff09;开始学习状态机 Unity教程&#xff08;二&#xff09;角色移动的实现 Unity教程&#xff08;三&#xff09;角色跳跃的实现 Unity教程&…

如何利用 Visual Studio 和 AI 工具实现高效编程

哪个编程工具让你的工作效率翻倍? 在现代软件开发的世界中,编程效率的提升对开发者来说至关重要。高效编程不仅仅是编写更多的代码,还包括如何减少重复劳动、提高代码质量、加快调试和测试流程等。而 Visual Studio 作为一个功能强大的开发环境(IDE),配合各种 AI 工具,…

Java入门:09.Java中三大特性(封装、继承、多态)02

2 继承 需要两个类才能实现继承的效果。 比如&#xff1a;类A 继承 类B A类 称为 子类 &#xff0c; 衍生类&#xff0c;派生类 B类 称为 父类&#xff0c;基类&#xff0c;超类 继承的作用 子类自动的拥有父类的所有属性和方法 &#xff08;父类编写&#xff0c;子类不需要…

基于vue框架的宠物领养管理系统88v55(程序+源码+数据库+调试部署+开发环境)系统界面在最后面。

系统程序文件列表 项目功能&#xff1a;用户,宠物分类,宠物信息,领养信息,宠物动态,捐赠物资,领养进度,友情链接 开题报告内容 基于Vue框架的宠物领养管理系统开题报告 一、项目背景与意义 随着社会的进步和人们生活水平的提高&#xff0c;宠物已成为许多家庭不可或缺的一部…

node+express部署多套vue3项目,总404页面由node控制,子404页面由子vue控制,node路由重定向

const express require(express) const history require(connect-history-api-fallback) const { createProxyMiddleware } require(http-proxy-middleware) const cors require(cors)let app express()app.use(cors()) app.use(history())// //匹配api开头的请求&#xf…

利用Leaflet.js和turf.js创建交互式地图:航道路线绘制

引言 在现代Web应用中&#xff0c;地图的交互性是提供丰富用户体验的关键。Leaflet.js是一个轻量级的开源JavaScript库&#xff0c;它提供了简单易用的API来构建交云的地图。与此同时&#xff0c;turf.js作为一个强大的地理空间分析库&#xff0c;能够处理复杂的地理数据操作。…

【前端基础篇】JavaScript之DOM介绍

文章目录 前言WebAPI背景知识什么是WebAPI什么是APIAPI参考文档 DOM基本概念什么是DOMDOM树查找HTML元素方法概览1. document.getElementById(id)2.document.getElementsByTagName(name)3. document.getElementsByClassName(name)4. document.querySelector(CSS选择器)5. docum…

C++ std::find函数 容器元素查找

简介 std::find函数是C标准库内非常实用的一个函数&#xff0c;主要用于在给定范围内查找某个元素&#xff0c;如果找到该元素&#xff0c;则返回指向该元素的迭代器&#xff1b;如果没有找到&#xff0c;则返回指向范围末尾的迭代器&#xff08;即 end() &#xff09;。 fin…

解锁定位服务:Flutter应用中的高德地图定位

前言 在现代移动应用开发中&#xff0c;定位服务已成为一项基本功能&#xff0c;它使得应用能够获取用户的地理位置信息&#xff0c;为用户提供更加个性化的服务。 Flutter 作为跨平台的移动应用开发框架&#xff0c;支持集成多种服务&#xff0c;包括定位服务。 本文将介绍如…

Golang | Leetcode Golang题解之第405题数字转换为十六进制数

题目&#xff1a; 题解&#xff1a; func toHex(num int) string {if num 0 {return "0"}sb : &strings.Builder{}for i : 7; i > 0; i-- {val : num >> (4 * i) & 0xfif val > 0 || sb.Len() > 0 {var digit byteif val < 10 {digit 0…

Bio-Linux-shell详解-1-从0开始

21世纪是数据的世纪&#xff0c;蓬勃发展的生物学积累了大量的数据&#xff0c;急需计算生物学、生物信息学及系统生物学等交叉学科大放异彩&#xff0c;而windows作为我们最熟悉的操作平台&#xff0c;并不能承担如此巨大的工作量&#xff0c;课题组的服务器因此承担了这个责任…

前端开发之原型模式

介绍 原型模式本质就是借用一个已有的实例做原型&#xff0c;在这原型基础上快速复制出一个和原型一样的一个对象。 class CloneDemo {name clone democlone(): CloneDemo {return new CloneDemo()} } 原型原型链 函数&#xff08;class&#xff09;都有显示原型 prototyp…

【算法篇】栈与队列类(笔记)

目录 一、用栈实现队列 二、用队列实现栈 三、有效的括号 四、删除字符串中的所有相邻重复项 五、逆波兰表达式求值 六、滑动窗口最大值 七、前 K 个高频元素 一、用栈实现队列 232. 用栈实现队列 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/proble…

vue3常用的组件间通信

一 props props 可以实现父子组件通信&#xff0c;props数据是只读。 1. 基本用法 在父组件中&#xff0c;你可以这样传递 props&#xff1a; <template><ChildComponent message"Hello, Vue 3!" /> </template><script setup> import C…

C++STL之stack和queue容器适配器: 相关习题解析

1. 最小栈 . - 力扣&#xff08;LeetCode&#xff09; 思路: 一、整体架构 使用两个栈 st 和 min_st 分别实现不同的功能。 st 用于存放插入的数据&#xff0c;即主要的数据存储栈&#xff0c;模拟常规的数据存储结构。min_st 用于存放最小的元素&#xff0c;通过特定的插入…

力扣438 找到字符串中所有字母异位词 Java版本

文章目录 题目描述代码 题目描述 给定两个字符串 s 和 p&#xff0c;找到 s 中所有 p 的 异位词 的子串&#xff0c;返回这些子串的起始索引。不考虑答案输出的顺序。 异位词 指由相同字母重排列形成的字符串&#xff08;包括相同的字符串&#xff09;。 示例 1: 输入: s …