Hello，大家好。这是我的第一篇博客，给大家分享下手机扫码上传图片到服务器实现手机pc同步.

1、自动生成二维码--> 可以去二维码生成工具网站获取api也可以直接用这个：http://qr.topscan.com/api.php?text= ？

注意：问号代表二维码访问的路径如果后面跟www.baidu.com就会跳转百度

2、这里写了个h5页面用于手机扫一扫上传文件跳转

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>load_photo</title><link rel="stylesheet" href="${basePath}/resources/css/lyj/load_photo/load_photo.css">
</head>
<body><div class="phone_container"><div class="photo_content"><div class="header">BIP产品文件上传模块</div><div class="business_name">业务名称：测试业务</div><div class="material_name">材料名称：身份证</div><img src="" alt="" class="showImg" width="90%"><div class="low_bottom"><div class="bottom"><p>选择</p><p>文件</p></div><div class="bottom_sure"><p>确认</p><p>上传</p></div></div><div class="load_btn"><form  enctype="multipart/form-data"><input type="file" class='inp_btn'accept="image/png,image/jpeg,image/jpg"><input type="button" value="提交" class="btn_empty"></form></div></div></div>
</body>
<script src="${basePath}/resources/js/plugins/jquery/jquery.js"></script>
<script type='text/javascript'>
//type 的值为1:选择文件,2选择文件&确认上传
$(document).ready(function(){$('.bottom_sure').css('display','none');$('.btn_empty').css('display','none');$('.inp_btn').change(function(){$('.bottom_sure').css('display','inline-block');$('.btn_empty').css('display','inline-block');//展示图片file=$('.inp_btn').get(0).files[0];var img_photo=$('.showImg');var reader=new FileReader();if(file){reader.readAsDataURL(file);reader.οnlοad=function(){$('.showImg').get(0).src=reader.result;localStorage.setItem('img_data',reader.result);}}else{console.log('文件为空')}})
$('.btn_empty').click(function(){if(localStorage.getItem('img_data')!==''){console.log(localStorage.getItem("img_data"));//    发起ajax请求$.ajax({url:'/phone/pic',data:{file:localStorage.getItem("img_data")},method:'post',success:function(res_data){console.log(res_data)}})}
})
})
</script>
</html>

h5 效果：

3、给二维码生成唯一标识（这里通过路由跳转给当前h5页面二维码路径变量上赋值UUID->一打开页面二维码uuid刷新）

  @RequestMapping(value = "/lyjSanWang")public String lyjSanWang(Model model,Integer ordId,Integer compId) {String front = UUID.randomUUID().toString();String back = UUID.randomUUID().toString();model.addAttribute("front",front);model.addAttribute("back",back);model.addAttribute("ordId",ordId);model.addAttribute("compId",compId);return "lyj/check/check.ftl";}

4、二维码check.ftl页面：

<!-- 手机上传 -->
<div id="open_window"><div class="img-erweima"><div><p>扫一扫上传身份证正面</p><img class="erweima_face" src="http://qr.topscan.com/api.php?text=http://localhost:8087/phone/page?flag=${front}" alt="">//由二维码路径可以看出，二维码跳转的就是h5页面的路由</div><div>  <#--flag=${back}-->
<p>扫一扫上传身份证背面</p><img class="erweima_back"  src="http://qr.topscan.com/api.php?text=http://localhost:8087/phone/page?flag=${back}" alt=""></div></div><div><button οnclick="closes_window()" class="close_window">返回信息填写</button></div>
</div>

5、服务器这块

1、这个处理器用于扫二维码的展示---h5页面

@RequestMapping(value = "/phone")
@Controller
public class PhonePicController extends BaseController{@Autowired
PhonePicService pic;protected static String PHONEURL = "http://localhost:8087/flag=";private static final Log logger = LogFactory.getLog(PhonePicController.class);//展示页面
@RequestMapping(value = "/page", method = RequestMethod.GET)public String page(HttpServletRequest request) {logger.info(request.getParameter("flag"));return "upload/load_photo.ftl";}

6、最后写个处理器就可以用于接收h5页面图片了

注意：因为前台传过来的图片是base64二进制，所以我这边后台进行了处理转化了图片路径存服务器

    //手机上传图片图片@RequestMapping(value = "/pic", method = RequestMethod.POST)@ResponseBodypublic ResultInfo pic(HttpServletRequest request, String file,String flag,Integer side) {side=1;if (file == null && StringUtil.isEmptyTrim(file)) {logger.error("web图片单独上传异常");}System.out.println("图片----------" + file);//写个路径,把base64转路径String fileprex = "/resources/upload";String filename = UUID.randomUUID().toString() + ".jpg";String picpath = request.getSession().getServletContext().getRealPath(fileprex) + filename;System.out.println(picpath);System.out.println(flag);System.out.println(side);if (file != null) {Base64Utils.Base64ToImage(file, picpath);}Integer i = pic.save(fileprex + filename,flag);if (i < 0) {logger.error("失败");}return ResultInfo.success("上传图片成功",i);}//获取数据库路径，回显数据@RequestMapping(value = "/byurl", method = RequestMethod.POST)@ResponseBodypublic ResultInfo findbypic(HttpServletRequest request,String flag) {if (flag == null && StringUtil.isEmptyTrim(flag)) {logger.error("web图片单独上传异常");}System.out.println(flag);String url = pic.findbypic(flag);System.out.println(url);String path="http://localhost:8087";String data=path+url;return ResultInfo.success("ok",data);}//
    @RequestMapping(value = "/bycomid", method = RequestMethod.POST)@ResponseBodypublic ResultInfo bycomid(HttpServletRequest request,String tokenId, String file,String flag,Integer compId) {UserInfo userInfo;try {userInfo = getUserInfo(tokenId);} catch (Exception e) {return ResultInfo.reLogin();}if (file == null && StringUtil.isEmptyTrim(file)) {logger.error("web图片单独上传异常");}System.out.println("图片----------" + file);//写个路径,把base64转路径String fileprex = "/resources/upload/";String filename = UUID.randomUUID().toString() + ".jpg";String picpath = request.getSession().getServletContext().getRealPath(fileprex) + filename;if (file != null) {Base64Utils.Base64ToImage(file, picpath);}Integer i = pic.saveComid(userInfo, fileprex + filename, flag, compId);if (i < 0) {logger.error("失败");}return ResultInfo.success("ok", 200);}

转载于:https://www.cnblogs.com/zrboke/p/11192458.html

通过二维码上传手机文件到服务器相关推荐

java+vue的二维码生成，二维码上传服务器，二维码的压缩包下载
一. vue页面生成二维码 <template><div class="app-container">//在页面放着二维码的div<div id=&q ...
二维码上传失败如何处理？怎么解决无法解析的二维码？
有些小伙伴可能会遇到过想要对二维码美化处理,但是上传二维码之后出现解析失败的提示,那么遇到这个问题该如何处理呢?今天小编给大家分享一下二维码生成器处理这个问题的方法,而且还可以同步对二维码图片做美化处 ...
php上传手机文件到服务器,安卓上传文件至PHP服务器(示例代码)
前两个月有幸参加一次免费培训,开发了一款小软件.发现AsyncHttpClient还真是好用. 直奔主题,安卓上传文件至PHP服务器: 1.PHP端服务器: //链接数据库 include (&quo ...
上传手机文件ftp服务器,从android手机上传文件到FTP服务器？
您可以使用Simple Java FTP Client,并将其添加为您的项目外部JAR,您也可以参考这个link public class FileUpload { /** * Upload a fi ...
Unity3D:问题(已解决):如何:实现手机扫描电脑二维码，然后手机上显示此二维码对应的图片
目录一.目的 1.想知道:如何:实现手机扫描电脑二维码,然后手机上显示此二维码对应的图片二.参考 1. 三.注意四.操作:1:失败:草料二维码官方不提供API.SDK等 1. 四.操作:2:失败 ...
uniapp中qrcode生成二维码后传的参数不见了_阿虚教你制作动态二维码，超详细教程！
这篇教程很早之前就答应几个粉丝要写,拖的有点久了. 内容比较多,先上个目录阿虚的教程会迟到,但永远不会缺席.hahahahhaha... 一. 先说一下今天要教的内容 ʕ•̫͡•ོʔ•̫͡•ཻʕ•̫ ...
常见二维码上那些奇怪的图案是什么
专题:神奇二维码改变生活方式的黑白方块常见的二维码上为啥三个角上有方块这是三个定位点,图形旋转也不影响识别要了解二维码的原理,我们先要来好好认识一下它.现在最常见的二维码是QR二维码(QR是 ...
识别二维码、并保存二维码链接至csv文件
识别二维码上一篇博文已经制作了一个二维码,现在是如何把它识别出来,(当然识别出来的是一个链接,并把它保存起来) 使用的工具是pycharm 识别二维码无非就是调用open cv 来识别,代码大同小异 ...
用 java 读取获取二维码上的文字内容
最近公司做一个物联网的项目,由于设备硬件编码复杂,因此业务人员提出能否使用手机扫一扫识别设备上二维码获取二维码上的编号,进而录入设备信息,在手机app上操作.因此写了如下的程序,希望对大家有帮助. 1 ...

通过二维码上传手机文件到服务器

Hello，大家好。这是我的第一篇博客，给大家分享下手机扫码上传图片到服务器实现手机pc同步.

1、自动生成二维码--> 可以去二维码生成工具网站获取api也可以直接用这个：http://qr.topscan.com/api.php?text= ？

2、这里写了个h5页面用于手机扫一扫上传文件跳转

h5 效果：

3、给二维码生成唯一标识（这里通过路由跳转给当前h5页面二维码路径变量上赋值UUID->一打开页面二维码uuid刷新）

4、二维码check.ftl页面：

5、服务器这块

6、最后写个处理器就可以用于接收h5页面图片了

通过二维码上传手机文件到服务器相关推荐

最新文章

热门文章