fix: 个人微信二维码改为后端生成真正可扫的 PNG(前端 <img> 原渲染 HTML URL 失效)

This commit is contained in:
WorkBuddy committed 2026-07-09 21:29:50 +08:00
1 parent 75a708a14d
commit 950f86325a
2 files changed
+19 -4

No files matched your search

+16 -1
View File
@@ -249,9 +249,24 @@ async def wechat_qrcode(user: User = Depends(get_current_user)):
if not resp.ok: if not resp.ok:
return {"success": False, "error": f"获取二维码失败 HTTP {resp.status_code}"} return {"success": False, "error": f"获取二维码失败 HTTP {resp.status_code}"}
j = resp.json() if resp.content else {} j = resp.json() if resp.content else {}
qr_url = j.get("qrcode_img_content") or ""
qr_img = None
try:
import io as _io
import qrcode as _qrcode
_buf = _io.BytesIO()
_q = _qrcode.QRCode(box_size=10, border=2)
_q.add_data(qr_url)
_q.make(fit=True)
_img = _q.make_image(fill_color="black", back_color="white")
_img.save(_buf, format="PNG")
qr_img = "data:image/png;base64," + base64.b64encode(_buf.getvalue()).decode()
except Exception:
qr_img = None
return {"success": True, "data": { return {"success": True, "data": {
"qrcode": j.get("qrcode"), "qrcode": j.get("qrcode"),
"qrcode_img_content": j.get("qrcode_img_content"), "qrcode_img_content": qr_url,
"qrcode_img": qr_img,
}} }}
except Exception as e: except Exception as e:
raise HTTPException(status_code=500, detail=str(e)) raise HTTPException(status_code=500, detail=str(e))
+3 -3
View File
@@ -146,11 +146,11 @@ const WechatBot: React.FC = () => {
</div> </div>
) : ( ) : (
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '12px' }}> <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '12px' }}>
{qrcode.qrcode_img_content ? ( {qrcode.qrcode_img ? (
<img src={qrcode.qrcode_img_content} alt="微信扫码" style={{ width: '220px', height: '220px', background: '#fff', borderRadius: '8px', border: '1px solid #E5E7EB' }} /> <img src={qrcode.qrcode_img} alt="微信扫码" style={{ width: '220px', height: '220px', background: '#fff', borderRadius: '8px', border: '1px solid #E5E7EB' }} />
) : ( ) : (
<div style={{ width: '220px', height: '220px', display: 'flex', alignItems: 'center', justifyContent: 'center', background: '#fff', borderRadius: '8px', border: '1px solid #E5E7EB', fontSize: '12px', color: '#9CA3AF', textAlign: 'center', padding: '12px' }}> <div style={{ width: '220px', height: '220px', display: 'flex', alignItems: 'center', justifyContent: 'center', background: '#fff', borderRadius: '8px', border: '1px solid #E5E7EB', fontSize: '12px', color: '#9CA3AF', textAlign: 'center', padding: '12px' }}>
二维码数据缺失,请重新获取。 二维码图片生成失败,<a href={qrcode.qrcode_img_content} target="_blank" rel="noreferrer" style={{color:'#6C63FF'}}>请点击此处在新标签页打开</a>。
</div> </div>
)} )}
<div style={{ fontSize: '13px', color: polling ? '#f59e0b' : '#6B7280' }}> <div style={{ fontSize: '13px', color: polling ? '#f59e0b' : '#6B7280' }}>