微信小程序扫描二维码带参数请求网络并储存二维码信息到数据库,适合初学者最简单的方法 |
您所在的位置:网站首页 › 表格生成二维码方法有哪些软件 › 微信小程序扫描二维码带参数请求网络并储存二维码信息到数据库,适合初学者最简单的方法 |
前端代码 图片自己随便找个扫码的就行了
wxml:
点击扫码上传
{{show}}
css:
.container {
display: flex;
flex-direction: column;
}
.scan {
width: 60%;
height:400rpx;
margin-bottom: 200rpx;
vertical-align: middle;
}
.font{
font-size: 64rpx;
color: red;
font-display: top;
}
js(两次请求,第一次是请求的储存数据的接口,第二次是关联,只存数据的话可以删除第二次wx.request const app = getApp() Page({ data: { //在这里面定义一下你二维码里面的字段 show: "", description:"", instruction:"", riskLevel:"", processMethod:"", d:'' }, onLoad: function () { template.tabbar("tabBar", 0, this); console.log('onLoad') }, scanCode: function (options) { var that = this; var show; wx.scanCode({ success: (res) => { // this.show = "结果:" + res.result + "二维码类型:" + res.scanType + "字符集:" + res.charSet + "路径:" + res.path; that.setData({ result:res.result }) var userInfo=wx.getStorageSync('user'); var username=userInfo.username; var txt =that.data.result; //此处是扫码成功的核心,用一个“?”来分隔请求和数据,该符号后面的使我们需要的参数,也就是d[1] var d = txt.split('?'); var e =d[1]; console.log(e); wx.showToast({ title: '扫码成功', icon: 'success', duration: 2000 }) wx.request({ url:'http://localhost:8080/scan/productionAdd?'+e, method: 'GET', success: function (res) { var result = res.statusCode; var toastText = "请求成功"; if (result != 200) { toastText = "请求失败"; } wx.showToast({ title: toastText, icon: '', duration: 2000 }); }, }), wx.request({ url: 'http://localhost:8080/scan/connect?username=' + username + '&&' + e, method: 'GET', }) }, fail: (res) => { wx.showToast({ title: '请选择二维码类型的图片', icon: 'success', duration: 2000 }) }, complete: (res) => { } }) } }) 后端接收,可以直接用类的对象进行接收,没必要像我这样写的这么麻烦,我前端进行了两次请求,第一次是扫码入库,第二次是将二维码信息对应的产品和当前用户关联,两次请求接收的代码如下。 @RestController @RequestMapping("/scan") public class ScanEntryController extends BaseController { @GetMapping("/productionAdd") public int addProduction(Integer id,String description, String instruction, String riskLevel, String processMethod,Integer amount,String username){ //将二维码信息上传到数据库(二维码中包含id且生成的二维码id不重复) Production production=new Production(); production.setId(id); production.setDescription(description); production.setInstruction(instruction); production.setRisklevel(riskLevel); production.setProcessmethod(processMethod); production.setAmount(amount); System.out.println("添加成功--->" +"产品id:"+id+",产品名:"+description+",注意事项:"+instruction+",危险程度:"+riskLevel+",处理方式:"+processMethod); return productionMapper.insert(production); } //将上面添加的产品和用户进行关联,前台请求扫码成功后请求该方法 @GetMapping("/connect") public void connect(String username,Integer id){ Integer production_id=id; System.out.println(production_id); System.out.println(username); Producer producer= producerMapper.ByProducerName(username); Integer producer_id=producer.getId(); Producerandproduction producerandproduction=new Producerandproduction(); producerandproduction.setProducerId(producer_id); producerandproduction.setProductionId(production_id); //通过自定义方法 producerandproductionMapper.insert(producerandproduction); } }最最最最最最重要的来了,二维码可以去草料二维码直接生成,格式大概是: ?id=1&&name=sure&&description=*********写上自己需要的数据,扫出来就像这样: |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |