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

这篇具有很好参考价值的文章主要介绍了微信小程序请求接口返回的二维码(图片),本地工具和真机测试都能显示,上线之后不显示问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

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

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

页面展示: 

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

代码实现:

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

base64Code 是转为base64的地址

<image class="code" :src="base64Code" alt="" :show-menu-by-longpress="true" />

 BASE_URL 是拼接接口地址的

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, '');文章来源地址https://www.toymoban.com/news/detail-685270.html

到了这里,关于微信小程序请求接口返回的二维码(图片),本地工具和真机测试都能显示,上线之后不显示问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序显示二维码

    在请求接口的success下面写入这段代码。 在他的上一个请求数据的打他下面创建一个空的用于存放数据的东西比如obj:\\\" \\\"用于存放数据。 将它放到一个一个点击事件中,通过触发点击事件执行代码 如果窒息看代码的话const tupian 这个变量让他等有一张网络图片。 这段代码是使

    2024年02月11日
    浏览(36)
  • 微信小程序 — 生成二维码功能

    微信小程序实现生成二维码功能。需要用到canvas组件,设置 type为2d.  需要使用js包 weapp-qrcode-canvas-2d https://github.com/DoctorWei/weapp-qrcode-canvas-2d weapp-qrcode-canvas-2d 是使用新版canvas-2d接口在微信小程序中生成二维码(外部二维码)的js包。canvas 2d 接口支持同层渲染且性能更佳,可大

    2024年02月09日
    浏览(43)
  • 微信小程序之生成二维码

     var context = wx.createCanvasContext(\\\'mycanvas\\\'); // 获取画布 CanvasContext.fillText string text 在画布上输出的文本 number x 绘制文本的左上角 x 坐标位置 number y 绘制文本的左上角 y 坐标位置 number maxWidth 需要绘制的最大宽度,可选 CanvasContext.drawImage string imageResource 所要绘制的图片资源(网络

    2024年02月10日
    浏览(38)
  • 微信小程序——二维码推广海报

    😊博主:小猫娃来啦 😊本文核心: 本地图片和接口返回二维码制作一体化canvas海报 在微信小程序中,我们使用 canvas 标签来创建一个画布 wxml 文件: 确立基本样式 wxss文件: 我们先使用 wx.createCanvasContext 创建一个 canvas 的上下文对象,然后通过调用 drawImage 方法分别绘制背

    2024年02月16日
    浏览(45)
  • 微信小程序中长按识别二维码

    属性 类型 默认值 必填 说明 show-menu-by-longpress boolean false 否 长按图片显示发送给朋友、收藏、保存图片、搜一搜、打开名片/前往群聊/打开小程序(若图片中包含对应二维码或小程序码)的菜单。 支持长按识别的码 ✅ 小程序码 ✅ 微信个人码 ✅ 企业微信个人码 ✅ 普通群码

    2023年04月15日
    浏览(30)
  • 微信小程序实现预约生成二维码

    业务需求 :点击预约按钮即可生成二维码凭码入校参观~ 如下是博主自己写的wxml: 以及wxss: 去Gitee下载工具包: 二维码工具包 http://​ https://gitee.com/WeiDoctor/weapp-qrcode-canvas-2d ​ 下载zip:     将dist文件夹中的js文件全部复制到utils目录下: 如下代码必须完整的导入再页面

    2024年04月15日
    浏览(41)
  • 微信小程序使用--如何生成二维码

    一、生成二维码 1.获取token 参照官方文档说明: https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/mp-access-token/getAccessToken.html 其中grant_type是写死的,appid和secret是注册小程序的时候获取的,然后会得到一个默认两小时失效的token 2.获取二维码 参照官方文档说明: https://developers.

    2024年02月04日
    浏览(40)
  • 微信小程序生成二维码的 方式

    一:生成普通的二维码 https://open.weixin.qq.com/sns/getexpappinfo?appid=xxxpath=xxx?a=123 appid:小程序的appid path: 小程序的路径 a:小程序需要携带的参数,不传可以不写 二:在微信开发文档内生成 步骤1.登录微信公众平台 2.找到工具菜单 3.选择生成小程序码 具体里面的有生成规则,不懂得

    2024年02月12日
    浏览(40)
  • 【微信小程序付款转二维码付款】

    需要的参数:session_id, timeStamp, nonceStr, package, paySign, appid,uuid session_id是协议获取 timeStamp, nonceStr, package, paySign, appid是订单数据 uuid是调用接口获取 第一步要获取小程序的sessionId 基于pc协议不风控 获取订单数据timeStamp, nonceStr, package, paySign, appid 调用https://open.weixin.qq.com/wxarunti

    2024年02月16日
    浏览(45)
  • 【小程序】动态生成微信小程序二维码

    官方文档中给我们提供了三个接口,分别应用于不同的场景 wxacode.createQRCode - - 接口文档地址-点击跳转 该接口需慎用,因为文档描述,该接口可生成的二维码是有限制的。 总共生成的码数量限制为 100,000 wxacode.get - - 接口文档地址-点击跳转 该接口需慎用,因为文档描述,该

    2024年02月09日
    浏览(47)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包