微信小程序请求接口返回的二维码(图片),本地工具和真机测试都能显示,上线之后不显示问题

请求后端接口返回的图片:

页面展示:

代码实现:

:show-menu-by-longpress="true" 是长按保存图片

base64Code 是转为base64的地址

html 复制代码
<image class="code" :src="base64Code" alt="" :show-menu-by-longpress="true" />

BASE_URL 是拼接接口地址的

javascript 复制代码
const base64Code = ref('');
onLoad(() => {
  //route.value.query.scene是扫描二维码后跳转链接传过来的参数(二维码携带链接是后端处理的),也就是id名称(因为我这个是扫描二维码还是跳到当前这个页面的,而后端传过来的参数名和我上个页面跳转过来传的参数名不一样)
  //route.value.query.id是上个页面跳转传过来的参数
  const id = route.value.query.id || route.value.query.scene;
  uni.request({
    url: BASE_URL + '/api/Product/GetCode?id=' + id,
    responseType: 'arraybuffer',
    success: (res: any) => {
      base64Code.value =
        'data:image/png;base64,' + uni.arrayBufferToBase64(res.data);
    },
    fail: (err) => {
      console.log(err);
    },
  });
});

这样写的话好像本地和真机调试是可以出来的,但到体验版和正式版上就是空白了,经过测试,把转成base64后的地址中的换行清除一下就可以了;

base64Code.value =

'data:image/png;base64,' + uni.arrayBufferToBase64(res.data).replace(/\\r\\n/g, '');

相关推荐
vx-程序开发1 小时前
django医院预约挂号系统---附源码23353
java·javascript·spring boot·python·eclipse·django·php
宿6742 小时前
tsconfig.node.json
前端·javascript·vue.js
小杨互联网2 小时前
Cursor 前端 Dist 自动化逆向框架:/fr 流水线 · 4 脚本 · Vite/Webpack
前端·webpack·自动化·前端逆向框架·ai前端逆向框架
瑞码空间2 小时前
Web应用的多端部署之道:浏览器 · Electron · Docker
前端·docker·electron·浏览器·web
徐奥雯XUAOWEN2 小时前
Codex官网前端可抄吗?从技术视角深度解析与借鉴指南
前端
文艺理科生2 小时前
3 年,8 种方案,1 次重构:LangChain 记忆方案如何从混乱走向清晰
前端·后端·架构
lilian2332 小时前
Harmony os 技术实战|拼豆制图10:把取消、解析失败和保存失败写成可恢复状态机
java·javascript·华为·harmonyos
只会cv的小前端2 小时前
七巧低代码表单JS脚本教学
开发语言·javascript·低代码
huabuyu2 小时前
SourceMap:从「看不懂线上报错」到「让 AI 定位真根因」
前端·javascript
এ慕ོ冬℘゜2 小时前
前端树形二级列表渲染 + 页面传参完整实战解析(附原生jQuery源码)
前端·javascript·jquery