触动精灵将图片转成base64字符串后通过post方式上传给服务器
觸動精靈使用lua實現(xiàn)對手機的自動化操作, 比按鍵精靈好用, 現(xiàn)在有個小需求就是對手機截屏后將圖片通過post方式提交到服務(wù)器端.
lua代碼
python用習(xí)慣了, 再寫lua的代碼總感覺有點別扭, 有些語法還得再翻翻文檔,這里再復(fù)習(xí)一下常用的操作:
- 字符串拼接使用.., 例如"hello".." world"
- 調(diào)用對象對應(yīng)的方法需要用冒號,比如var_a:func()
- 表(字典)定義語法和python唯一的區(qū)別是key不用加引號,后面=值, 例如table={id=1, value="wtf"}
- 代碼注釋開頭用--
服務(wù)器Python代碼
服務(wù)器端用flask隨便擼一個處理post請求的api, 這里需要注意的是, 觸動精靈在發(fā)送post數(shù)據(jù)的時候,會將base64編碼里面的+加號替換成空格,所以如果直接用post過來的數(shù)據(jù)扔給<img>標簽進行解析的話會顯示不出來的, 因此必須在服務(wù)器端再將接受到的base64字符串里面的空格替換回+
from flask import Flask, jsonify, request, render_templateapp = Flask(__name__) app.config['JSON_AS_ASCII'] = False@app.route('/', methods=['GET', 'POST']) def index():if request.method == 'POST':# 觸動精靈發(fā)送post請求時會將+加號替換成空格,這里需要回轉(zhuǎn)一下img_data = request.form.get('img').replace(' ', '+') # 接收到的base64數(shù)據(jù)存到文件里with open('img.base', 'w') as f:f.write(img_data)return jsonify({'code': 0,'msg': 'OJBK成功'})else:# 從文件里面讀出來base64數(shù)據(jù), 扔給前端模板渲染成<img>with open('img.base', 'r') as f:img_data = f.read()return render_template('index.html', img=img_data)if __name__ == '__main__':app.run()模板里面注意使用<img>標簽渲染base64格式數(shù)據(jù)的時候,要在前面加上data:image/png;base64,
<!DOCTYPE html> <html lang="zh"> <head><meta charset="UTF-8"><title>Title</title><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> </head> <body> <img src="https://img-blog.csdnimg.cn/2022010703251530080.png"> </body> </html>優(yōu)化服務(wù)器端, png轉(zhuǎn)成webp格式
由于觸動精靈上傳過來的png格式圖片比較大, 下面用python把png轉(zhuǎn)成webp格式的base64編碼進行存儲和前端渲染
def png2webp(base_data):"""png轉(zhuǎn)webp, 需要用到Pillow包, `pip install Pillow`:param base_data: png格式的base64字符串:return: webp格式的base64字符串"""# 先將base64字符串解碼成BytesIO對象bytes_io = io.BytesIO(base64.b64decode(base_data))# 轉(zhuǎn)換成Image類型對象im = Image.open(bytes_io)# 定義內(nèi)存中使用的字節(jié)類型對象用來存放轉(zhuǎn)碼后的圖片數(shù)據(jù)output = io.BytesIO()# 轉(zhuǎn)換成webp格式后存入二進制對象im.save(output, format='webp')# 二進制對象再轉(zhuǎn)成base64字符串返回return base64.b64encode(output.getvalue()).decode('utf8')對比一下轉(zhuǎn)換前后的大小:
- 原始PNG格式: 101,064 字節(jié)
- WebP格式: 43,928 字節(jié)
轉(zhuǎn)換后的大小只有原來的43%, 可以說療效是相當顯著的了! 注意模板渲染的時候需要將<img src="https://img-blog.csdnimg.cn/2022010703251530080.png">改成<img src="https://img-blog.csdnimg.cn/2022010703251519722.webp">
總結(jié)
以上是生活随笔為你收集整理的触动精灵将图片转成base64字符串后通过post方式上传给服务器的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 在网页输出10的阶乘.php,VB 用f
- 下一篇： android9叫什么名字,白猜这么多名