榆林网站seo,建设手机网站包括哪些费用,wordpress绑定wap域名,手工艺品网站模板需求
最近想做一个小工具#xff0c;大概要实现这样的效果#xff1a;后端生成条形码后#xff0c;不保存到服务器#xff0c;直接返回给前端展示。
大概思路是#xff0c;通过 python-barcode库 生成条码的字节流#xff0c;生成字节流后直接编码成base64格式返回给前…需求
最近想做一个小工具大概要实现这样的效果后端生成条形码后不保存到服务器直接返回给前端展示。
大概思路是通过 python-barcode库 生成条码的字节流生成字节流后直接编码成base64格式返回给前端前端通过img标签展示base64格式的图片。 代码示例
后端代码
以flask为例其他web框架实现的方法类似。
这里使用Code128格式的条码可以去python-barcode官网看看该工具还支持生成其他格式的条码。
app.route(/barcode, methods[POST])
def bar_code():param_code request.get_json()[barCode]buffer BytesIO()Code128(param_code, writerSVGWriter()).write(buffer)res base64.b64encode(buffer.getvalue()).decode(utf-8)return {code: 200,message: success,data: res}
前端代码
以vue为例
templateimg :srcimgUrl /
/templatescript setup
import { onMounted, ref, inject } from vue
const axios inject($axios)const imgUrl ref(null)const load_barcode async () {// 请求后台const param {barCode: 100000902922}let res await axios.post(http://127.0.0.1:5000/barcode, param);// 获取base64格式的图片const b4 res.data.data// 绑定到img的srcimgUrl.value data:image/svgxml;base64, b4
}onMounted(() {load_barcode()
})/script
最后的效果 如有问题欢迎指正。