DataEase-V1.18版本源码通过Docker镜像部署与静态资源通过阿里云OSS存储实现看这一篇就够了

2024-04-09 12:36
文章标签 镜像 阿里 实现 源码 部署 docker 存储 一篇 版本 资源 oss 静态 就够 dataease v1.18

本文主要是介绍DataEase-V1.18版本源码通过Docker镜像部署与静态资源通过阿里云OSS存储实现看这一篇就够了，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

修改DataEase实现静态资源阿里云OSS存储

后端源码文件读取配置类配置

1.阿里云OSS配置类
/*** ClassName AliyunConfig.java* author shuyixiao* version 1.0.0* Description 阿里云OSS配置* createTime 2024年04月03日 10:03:00*/
@Data
@Configuration
public class AliyunConfig {// 地域节点@Value("${aliyun.oss.endpoint}")private String endpoint;@Value("${aliyun.accessKeyId}")private String accessKeyId;@Value("${aliyun.accessKeySecret}")private String accessKeySecret;@Value("${aliyun.oss.bucketName}")private String bucketName;@Value("${aliyun.oss.urlPrefix}")private String urlPrefix;}
2.图片文件上传base64转MultipartFile工具类
public class Base64DecodedMultipartFile implements MultipartFile {private final byte[] imgContent;private final String header;public Base64DecodedMultipartFile(byte[] imgContent, String header) {this.imgContent = imgContent;this.header = header;}@Overridepublic String getName() {return System.currentTimeMillis() + Math.random() + "." + header.split("/")[1].split(";")[0];}@Overridepublic String getOriginalFilename() {return getName();}@Overridepublic String getContentType() {return header.split(":")[1].split(";")[0];}@Overridepublic boolean isEmpty() {return imgContent == null || imgContent.length == 0;}@Overridepublic long getSize() {return imgContent.length;}@Overridepublic byte[] getBytes() {return imgContent;}@Overridepublic InputStream getInputStream() {return new ByteArrayInputStream(imgContent);}@Overridepublic void transferTo(File dest) throws IOException, IllegalStateException {try (FileOutputStream fos = new FileOutputStream(dest)) {fos.write(imgContent);}}}
3.图片静态文件解析工具类
public class Base64DecodedStaticFile implements MultipartFile {private byte[] imgContent;public Base64DecodedStaticFile(byte[] imgContent) {this.imgContent = imgContent;}@Overridepublic String getName() {return "filename";}@Overridepublic String getOriginalFilename() {return "originalFilename.jpg";}@Overridepublic String getContentType() {return "image/jpeg";}@Overridepublic boolean isEmpty() {return imgContent == null || imgContent.length == 0;}@Overridepublic long getSize() {return imgContent.length;}@Overridepublic byte[] getBytes() throws IOException {return imgContent;}@Overridepublic InputStream getInputStream() throws IOException {return new ByteArrayInputStream(imgContent);}@Overridepublic void transferTo(java.io.File dest) throws IOException, IllegalStateException {// 这里根据你的需求实现文件传输的逻辑}}
4.阿里云oos响应配置类
@Getter
@Setter
public class PicUploadResult {private String uid;private String name;private String status;private String response;private String linkProps;}
5.文件上传工具类
@Component
public class FileUtil {@Autowiredprivate AliyunConfig aliyunConfig;// 允许上传的格式private static final String[] IMAGE_TYPE = new String[]{".bmp", ".jpg", ".jpeg", ".gif", ".png"};public PicUploadResult upload(MultipartFile multipartFile) {// 1. 对上传的图片进行校验: 这里简单校验后缀名// 另外可通过ImageIO读取图片的长宽来判断是否是图片,校验图片的大小等。// TODO 图片校验boolean isLegal = false;for (String type : IMAGE_TYPE) {if (StringUtils.endsWithIgnoreCase(multipartFile.getOriginalFilename(), type)) {isLegal = true;break;  // 只要与允许上传格式其中一个匹配就可以}}PicUploadResult picUploadResult = new PicUploadResult();// 格式错误, 返回与前端约定的errorif (!isLegal) {picUploadResult.setStatus("error");return picUploadResult;}// 生成唯一的文件名String originalFileName = multipartFile.getOriginalFilename();String fileExtension = originalFileName.substring(originalFileName.lastIndexOf("."));String uniqueFileName = UUID.randomUUID().toString() + fileExtension; // 包含UUID的文件名// 3. 上传至阿里OSStry {// 初始化OSSClientOSS ossClient = new OSSClientBuilder().build(aliyunConfig.getEndpoint(), aliyunConfig.getAccessKeyId(), aliyunConfig.getAccessKeySecret());ossClient.putObject(aliyunConfig.getBucketName(), uniqueFileName, new ByteArrayInputStream(multipartFile.getBytes()));} catch (IOException e) {e.printStackTrace();// 上传失败picUploadResult.setStatus("error");return picUploadResult;}// 上传成功picUploadResult.setStatus("done");// 文件名(即直接访问的完整路径)picUploadResult.setName(aliyunConfig.getUrlPrefix() + uniqueFileName);// uidpicUploadResult.setUid(String.valueOf(System.currentTimeMillis()));return picUploadResult;}}
6.DataEase源码部分适配OSS修改
1.修改应用管理功能逻辑（PanelAppTemplateService类）
  • 注入文件上传工具类
@Autowired
private FileUtil fileUtil;
  • 修改原有代码逻辑
//Store static resource into the server// 缩略图处理String snapshotName = "app-template-" + request.getId() + ".jpeg";String base64Image = request.getSnapshot().split(",")[1];String imageType = request.getSnapshot().split(";")[0].split(":")[1];byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(base64Image);MultipartFile multipartFile = new Base64DecodedMultipartFile(imageBytes, imageType);// 调用上传方法PicUploadResult uploadResult = fileUtil.upload(multipartFile);staticResourceService.saveSingleFileToServe(snapshotName, request.getSnapshot().replace("data:image/jpeg;base64,", "").replace("data:image/png;base64,", ""));requestTemplate.setSnapshot("/" + UPLOAD_URL_PREFIX + '/' + snapshotName);
//            requestTemplate.setSnapshot("/" + UPLOAD_URL_PREFIX + '/' + snapshotName);requestTemplate.setSnapshot(uploadResult.getName());// 静态资源小图处理Gson gson = new Gson();PanelGroupRequest panelGroupRequest = gson.fromJson(request.getPanelInfo(), PanelGroupRequest.class);
//            panelGroupRequest.setPanelData(JSON.toJSONString(jsonArray));Map<String, String> resource = gson.fromJson(panelGroupRequest.getStaticResource(), Map.class);Map<String, String> imageUrl = new HashMap<>();for (String s : resource.keySet()) {String imageCode = resource.get(s);byte[] bytes = DatatypeConverter.parseBase64Binary(imageCode);PicUploadResult picUploadResult = fileUtil.upload(new Base64DecodedStaticFile(bytes));imageUrl.put(s, picUploadResult.getName());}// 数据库缩略图存储处理String staticResource = panelGroupRequest.getStaticResource();Map<String,String> staticResourceMap= gson.fromJson(staticResource, Map.class);for (String s : staticResourceMap.keySet()) {String s1 = staticResourceMap.get(s);if (s.contains("static-resource")) {// 找到匹配项，修改为阿里云oos存储地址for (String string : imageUrl.keySet()) {if (string.equals(s)){staticResourceMap.remove(s);staticResourceMap.put(imageUrl.get(s), s1);}}}}String panelData = panelGroupRequest.getPanelData();JSONArray jsonArray = JSON.parseArray(panelData);// 遍历数组，寻找特定的 propValue 值for (int i = 0; i < jsonArray.size(); i++) {JSONObject obj = jsonArray.getJSONObject(i);if (obj.containsKey("propValue") && obj.getString("propValue").contains("/static-resource/")) {// 找到匹配项，添加前缀obj.put("propValue", imageUrl.get(obj.get("propValue")));}}panelGroupRequest.setPanelData(JSON.toJSONString(jsonArray));panelGroupRequest.setStaticResource(gson.toJson(staticResourceMap));requestTemplate.setPanelInfo(gson.toJson(panelGroupRequest));
2.修改模板管理功能逻辑（PanelTemplateService类）
  • 注入文件上传工具类
@Autowired
private FileUtil fileUtil;
  • 修改原有逻辑代码
//Store static resource into the serverstaticResourceService.saveFilesToServe(request.getStaticResource());// 缩略大图处理String snapshotName = "template-" + request.getId() + ".jpeg";String base64Image = request.getSnapshot().split(",")[1];String imageType = request.getSnapshot().split(";")[0].split(":")[1];byte[] imageBytes = javax.xml.bind.DatatypeConverter.parseBase64Binary(base64Image);MultipartFile multipartFile = new Base64DecodedMultipartFile(imageBytes, imageType);// 调用上传方法PicUploadResult uploadResult = fileUtil.upload(multipartFile);staticResourceService.saveSingleFileToServe(snapshotName, request.getSnapshot().replace("data:image/jpeg;base64,", "").replace("data:image/png;base64,", ""));request.setSnapshot("/" + UPLOAD_URL_PREFIX + '/' + snapshotName);// 文件中静态资源小图处理String staticResource = request.getStaticResource();Gson gson = new Gson();Map<String, String> resource = gson.fromJson(staticResource, Map.class);Map<String, String> imageCode = new HashMap<>();for (String s : resource.keySet()) {String base64Picture = resource.get(s);byte[] bytes = DatatypeConverter.parseBase64Binary(base64Picture);PicUploadResult picUploadResult = fileUtil.upload(new Base64DecodedStaticFile(bytes));imageCode.put(s, picUploadResult.getName());}String templateData = request.getTemplateData();JSONArray jsonArray = JSON.parseArray(templateData);for (int i = 0; i < jsonArray.size(); i++) {JSONObject obj = jsonArray.getJSONObject(i);if (obj.containsKey("propValue") && obj.getString("propValue").contains("/static-resource/")) {// 找到匹配项，添加前缀obj.put("propValue", imageCode.get(obj.get("propValue")));}}request.setTemplateData(JSON.toJSONString(jsonArray));
//                request.setSnapshot("/" + UPLOAD_URL_PREFIX + '/' + snapshotName);request.setSnapshot(uploadResult.getName());
7.配置文件中添加阿里云OSS配置

阿里云oss配置

# 阿里云oss配置
# Aliyun OSS 配置
# 访问密钥ID，用于标识用户
aliyun.accessKeyId=xxxxxxxxxxxxxx
# 访问密钥密文，用于验证用户的身份
aliyun.accessKeySecret=xxxxxxxxxxxxxx
# OSS服务的访问域名
aliyun.oss.endpoint=xxxxxxxxxxxxxx
# OSS中的存储桶名称
aliyun.oss.bucketName=xxxxxxxxxxxxxx
#访问OSS服务的URL前缀
aliyun.oss.urlPrefix=xxxxxxxxxxxxxx

前端源码样式修改为自己喜欢的即可

前后端不分离单体部署

1.源码获取

GitHub地址
在这里插入图片描述
Gitee地址

在这里插入图片描述

2.配置源码信息
后端代码

注意事项：

注意V1.18代码的配置方式为JDK11版本
需要后端POM文件中有的资源依赖拉取不下来，可以链接：https://pan.baidu.com/s/1UYKk9R96B6dBUEqsRgjJhA 提取码：x8wr 这里获取然后直接替换即可
在这里插入图片描述
配置启动类配置处的配置文件信息，由于是在windows的环境中，下图是Linux中的文件写法，因此偷懒一些可以直接就是在windows的项目的根路径下建立相似的路径文件信息即可，详情见下图
在这里插入图片描述
在这里插入图片描述
配置配置文件中的数据库信息，数据库信息比较私密因此直接打马赛克了~
在这里插入图片描述

前端代码

注意事项：由于使用的是V1.18版本左右的前端代码，因此node版本不宜太高16.0.0左右即可。

查看前端项目的打包配置信息可以得到，运行需要的指令信息
在这里插入图片描述

3.Docker打包部署
首先在项目根文件夹下面添加数据库信息的配置文件

在这里插入图片描述

去除后端POM文件中移动端部分资源

在这里插入图片描述##### 修改前端POM文件中node和npm版本
在这里插入图片描述

分别打包前后端文件资源

在这里插入图片描述

执行Docker打包指令得到镜像文件
 # 这里我需要说明一下就是版本号随着DataEase官方版本给就可以，这里我写的时候使用1.18.15就写这个了docker build --build-arg IMAGE_TAG=1.18.15 -t your-image-name:tag .

在这里插入图片描述
在这里插入图片描述

运行镜像文件得到前端展示页面

在这里插入图片描述

附录一下打包和启动命令
docker build --build-arg IMAGE_TAG=1.18.15 -t core-backend-image-v1.18.15:1.18.15 .
docker run -d -p 8181:8181 core-backend-image-v1.18.15:1.18.15

前后端分离单体部署

后端代码
1.修改后端代码添加对应上下文

在这里插入图片描述##### 2.修改后端短链共享代码部分
在这里插入图片描述

3.pom文件中去除掉前端资源打包内容

在这里插入图片描述

4.执行Docker打包，步骤和上述前端后不分离单体部署命令一致不赘述了

前端代码修改

前端代码修改下面两处配置信息完成接口路径上下文配置

在这里插入图片描述
在这里插入图片描述

执行前端打包后放置与nginx服务器
# 打包命令：
npm run build

这篇关于DataEase-V1.18版本源码通过Docker镜像部署与静态资源通过阿里云OSS存储实现看这一篇就够了的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/888168。

相关文章

SpringBoot+Docker+Graylog 如何让错误自动报警

SpringBoot+Docker+Graylog 如何让错误自动报警

《SpringBoot+Docker+Graylog如何让错误自动报警》SpringBoot默认使用SLF4J与Logback,支持多日志级别和配置方式,可输出到控制台、文件及远程服务器,集成ELK... 目录01 Spring Boot 默认日志框架解析02 Spring Boot 日志级别详解03 Sp
阅读更多...
Python使用python-can实现合并BLF文件

Python使用python-can实现合并BLF文件

《Python使用python-can实现合并BLF文件》python-can库是Python生态中专注于CAN总线通信与数据处理的强大工具,本文将使用python-can为BLF文件合并提供高效灵活... 目录一、python-can 库：CAN 数据处理的利器二、BLF 文件合并核心代码解析1. 基础合
阅读更多...
Python使用OpenCV实现获取视频时长的小工具

Python使用OpenCV实现获取视频时长的小工具

《Python使用OpenCV实现获取视频时长的小工具》在处理视频数据时,获取视频的时长是一项常见且基础的需求,本文将详细介绍如何使用Python和OpenCV获取视频时长,并对每一行代码进行深入解析... 目录一、代码实现二、代码解析1. 导入 OpenCV 库2. 定义获取视频时长的函数3. 打开视频文
阅读更多...
golang版本升级如何实现

golang版本升级如何实现

《golang版本升级如何实现》：本文主要介绍golang版本升级如何实现问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录golanwww.chinasem.cng版本升级linux上golang版本升级删除golang旧版本安装golang最新版本总结gola
阅读更多...
SpringBoot中SM2公钥加密、私钥解密的实现示例详解

SpringBoot中SM2公钥加密、私钥解密的实现示例详解

《SpringBoot中SM2公钥加密、私钥解密的实现示例详解》本文介绍了如何在SpringBoot项目中实现SM2公钥加密和私钥解密的功能,通过使用Hutool库和BouncyCastle依赖,简化... 目录一、前言1、加密信息(示例)2、加密结果(示例)二、实现代码1、yml文件配置2、创建SM2工具
阅读更多...
Mysql实现范围分区表(新增、删除、重组、查看)

Mysql实现范围分区表(新增、删除、重组、查看)

《Mysql实现范围分区表(新增、删除、重组、查看)》MySQL分区表的四种类型（范围、哈希、列表、键值）,主要介绍了范围分区的创建、查询、添加、删除及重组织操作,具有一定的参考价值,感兴趣的可以了解... 目录一、mysql分区表分类二、范围分区（Range Partitioning1、新建分区表：2、分
阅读更多...
MySQL 定时新增分区的实现示例

MySQL 定时新增分区的实现示例

《MySQL定时新增分区的实现示例》本文主要介绍了通过存储过程和定时任务实现MySQL分区的自动创建,解决大数据量下手动维护的繁琐问题,具有一定的参考价值,感兴趣的可以了解一下... mysql创建好分区之后，有时候会需要自动创建分区。比如，一些表数据量非常大，有些数据是热点数据，按照日期分区MululbU
阅读更多...
MySQL中查找重复值的实现

MySQL中查找重复值的实现

《MySQL中查找重复值的实现》查找重复值是一项常见需求,比如在数据清理、数据分析、数据质量检查等场景下,我们常常需要找出表中某列或多列的重复值,具有一定的参考价值,感兴趣的可以了解一下... 目录技术背景实现步骤方法一：使用GROUP BY和HAVING子句方法二：仅返回重复值方法三：返回完整记录方法四：
阅读更多...
IDEA中新建/切换Git分支的实现步骤

IDEA中新建/切换Git分支的实现步骤

《IDEA中新建/切换Git分支的实现步骤》本文主要介绍了IDEA中新建/切换Git分支的实现步骤,通过菜单创建新分支并选择是否切换,创建后在Git详情或右键Checkout中切换分支,感兴趣的可以了... 前提：项目已被Git托管1、点击上方栏Git->NewBrancjsh...2、输入新的分支的
阅读更多...
Python实现对阿里云OSS对象存储的操作详解

Python实现对阿里云OSS对象存储的操作详解

《Python实现对阿里云OSS对象存储的操作详解》这篇文章主要为大家详细介绍了Python实现对阿里云OSS对象存储的操作相关知识,包括连接,上传,下载,列举等功能,感兴趣的小伙伴可以了解下... 目录一、直接使用代码二、详细使用1. 环境准备2. 初始化配置3. bucket配置创建4. 文件上传到os
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2