前端如何把背景图作为参数

Posted 2023-03-26

参考技术A 前端更换背景图，传递到后端

后端接收的参数：HttpServletRequest request, MultipartFile uploadImg

uploadImg是图片文件，可以根据需求对图片文件的大小和图片格式作自定义要求。

File tempFile = File.createTempFile("temp", ".png");
uploadImg.transferTo(tempFile);
登录后复制
创建临时文件，MulipartFile通过transferTo存入到临时文件中。

2.本地图片的更换

通过Apache的FileUtils操作旧文件，将旧文件删除；

// 获取旧文件
File oldFile = new File(targetFilePath);
FileUtils.forceDeleteOnExit(oldFile);
FileUtils.copyFile(tempFile, new File(targetFilePath));
登录后复制
首先通过request获取到当前背景图片的位置即targetFilePath;获取到旧文件，并通过FileUtils删除掉旧文件。

将临时文件放到目标文件目录即可，copyFile.

3.调用接口，更新其他服务节点下的图片--图片文件转换

@Override
public String getImageByte(HttpServletRequest request)
String targetFilePath = getTargetPath(request);
try (InputStream inputStream = new FileInputStream(targetFilePath);)
byte[] data = new byte[inputStream.available()];
inputStream.read(data);
return new String(Base64.getEncoder().encode(data));
catch (FileNotFoundException e)
LOG.error("Get background image fail.", e);
catch (IOException e)
LOG.error("Get background image fail.", e);

return new String();

登录后复制

图片的传递是将图片转换为byte[]，然后通过Base64编码获得参数；

4.接口接收图片参数，对本地文件进行更新

try
byte[] image = Base64.getDecoder().decode(imageData.getString("imageData"));
InputStream inputStream = new ByteArrayInputStream(image);
try
File tempFile = File.createTempFile("temp", ".png");
try (FileOutputStream fos = new FileOutputStream(tempFile))
byte[] buf = new byte[1024];
while (inputStream.read(buf) != -1)
fos.write(buf);

catch (Exception e)
LOG.debug("Parse image data failed.", e);

this.backgroundImageService.background(request, tempFile);
catch (IOException e)
LOG.debug("Parse image data failed.", e);

return ResultBuilder.success(ResultCodeEnum.SUCCESS, ResultMessage.SUCCESS);
catch (Exception e)
LOG.error("Base64 decode image data error,check request param.", e);

登录后复制

5.遇到报错

Caused by: java.lang.IllegalArgumentException: Illegal base64 character 7b

Caused by:java.lang.IllegalArgumentException: Illegal base64 character 5b

原因：原因就是base64解密参数不正确，一般注意byte[]直接toString转换成字符串，实际得到的是byte[]数组的内存地址。

应该new String(byte);这样来转换类型。

6.这样做目前来说可以正常实现功能，后续问题，后续更新

 

交流QQ:740273040

精灵宝可梦4
精选推荐
广告

API实现窗口背景颜色变换
53下载·3评论
2011年8月20日
php随机调用百度背景图片,如何在网页中调用岁月小筑随机图片API——背景图片...
185阅读·0评论·0点赞
2021年4月23日
vue 通过接口设置背景图，图片不能直接访问，已解决
183阅读·0评论·0点赞
2022年10月21日
php刷新一次换一次背景图,新浪随机图片壁纸API接口 刷新网页换背景接口
178阅读·0评论·0点赞
2021年5月8日
OpenCV C++案例实战六《绿幕视频背景替换》
3143阅读·2评论·6点赞
2021年12月11日
调用第三方接口获取图片的方法-静态图片的部署
2627阅读·0评论·0点赞
2018年11月21日
高清播放机，图片大全，点击查看详情！

精选推荐
广告
新浪随机图片壁纸API接口 刷新网页换背景接口
7307阅读·2评论·3点赞
2019年8月27日
更改端口或修改api文件内容，记得重启项目
415阅读·0评论·1点赞
2022年4月6日
需要动态更换图片的接口处理技巧
322阅读·0评论·0点赞
2016年7月19日
把图片作为参数POST到服务器
932阅读·0评论·0点赞
2015年10月22日
一键实现证件照背景的替换，Python 制作可视化GUI界面真香啊
244阅读·1评论·0点赞
2022年7月25日
python-调用API接口移除照片背景，分分钟变抠图高手
1289阅读·0评论·0点赞
2020年6月1日
接口参数为图片或文件
590阅读·0评论·0点赞
2019年11月25日
微信朋友圈api接口调用源码
1462阅读·0评论·2点赞
2020年12月15日
接口中图片的接收
693阅读·0评论·0点赞
2017年11月23日
使用接口函数替换，实现网页背景色
681阅读·0评论·0点赞
2007年12月25日
去首页
看看更多热门内容