返回顶部
首页 > 资讯 > 移动开发 >uniapp 之 扫普通二维码进入小程序
  • 799
分享到

uniapp 之 扫普通二维码进入小程序

uni-app小程序 2023-09-03 21:09:31 799人浏览 薄情痞子
摘要

目录 前言 ​编辑提示下 (☆) 问题一  问题二 代码 后续 my.vue文件 B页面 前言 因项目的需求,需要我完成 在微信的扫一扫中,扫后端定义的二维码进入小程序中 这个需求说简单也很简单,说难也不难,就是花费了我几天的时间 需要在

目录

前言

​编辑提示下 (☆)

问题一 

问题二

代码

后续

my.vue文件

B页面


前言

项目的需求,需要我完成 在微信的扫一扫中,扫后端定义的二维码进入小程序

这个需求说简单也很简单,说难也不难,就是花费了我几天的时间

需要在 开发  ---> 开发管理 下的开发设置 中的  

 一直往下滑 直到出现 扫普通链接二维码打开小程序 这一栏

 写 小程序功能页面的时候,要想好路径后在填写,毕竟以后不能修改这一栏,

只有下面红色框住的内容才能修改

我当初就是卡在 下载校验文件 这一步,因为这个校验文件下载后要放到服务器文件下面,这个我不会,最终大哥帮我弄好了,

提示下 (

测试范围的选择 要根据自己当前版本的测试进行选择,测试扫一扫这个功能没问题的话,建议 点击详情把测试范围更改到线上版本 否则后续一些用户也会跳转到体验版(吃过这个亏),最重要的一点是 全网发布这一栏,

 

问题一 

 最开始这一栏,我没有选发布,但奈何,我试了几分钟,扫码后并没有跳转至小程序,而是显示 直接打印出 操作成功,以及参数啊,状态等等 值

后 无奈下 就点击发布,发布之后,过段时间扫码后能跳转到小程序中,

这个嘛,我反省下,估计是因为 它刚发布成功,我就去测这个功能,应该给它点时间 让它反应下

问题二

因为我点击已发布,这个就会导致在体验版以及开发版这个(扫码跳转)功能使用不了,也无法检测传递的参数对不对 

这个问题好解决使用 二维码编译 可以测这个功能,还有 这个功能完成后 需发布为线上版本测试这个功能,发布后也要等待半个小时、一个小时以后在测

 接收  二维码传递的参数

我的路径是在  pages/my/my 因为在my。Vue文件中 接收

代码

官网地址

 onLoad(option) {      const {        q      } = option      console.log(decodeURIComponent(q));      if (q && uni.getStorageSync('token')) {        let str = decodeURIComponent(q).split('/')[6]        let arr = decodeURIComponent(q).split('/')[7]        console.log(str, arr); // 88000000000001        if (arr) return uni.navigateTo({          url: '/subpkg/pile/connectorDetail?code=' + arr + '&id=' + str        })        uni.navigateTo({          url: '/subpkg/pile/connectorDetail?code=' + str        })        // if (arr) {        //   if (uni.getStorageSync('token')) return uni.navigateTo({        //     url: '/subpkg/pile/connectorDetail?code=' + arr + '&id=' + str        //   })        // } else {        //   if (uni.getStorageSync('token')) return uni.navigateTo({        //     url: '/subpkg/pile/connectorDetail?code=' + str        //   })        // }      }      // let str = decodeURIComponent(q).substring(decodeURIComponent(q).lastIndexOf('/') + 1)    },

后续

扫码跳转的connectorDetail页面 

有B页面是通过点击的方式进入connectorDetail页面,还因为啥来着了 导致在connectorDetail页面不能接受相同的他们传递的值

后续 就是在my页面得到地址后直接请求地址得到数据,然后传值

在B页面就是 直接拼接地址 得到数据后点击的时候传值跳转 

my.vue文件

onLoad(option) {const {q} = optionconsole.log(decodeURIComponent(q));if (q !== null) {uni.request({url: decodeURIComponent(q),header: {Authorization: `Bearer ${uni.getStorageSync('token')}`},success: ({data: {obj,msg}}) => {console.log('成功', obj, msg);                        // 根据二维码得到的结果去判断if (obj.connectorInfoList[0].connectorStatus ==='2' || obj.connectorInfoList[1].connectorStatus === '2') {return uni.navigateTo({url: '/subpkg/pile/connectorDetail?connectorObj=' + encodeURIComponent(JSON.stringify(obj))})} else {return uni.$showMsg(msg + `,但当前状态不能进行操作`)}},fail: (err) => {console.log('失败', err);}})}}

B页面

  // 跳转至电枪详情页      electronicDetail(item) {        console.log(item, 'server传递', 'item.pileConnectorCode', item.pileConnectorCode);        console.log('当前状态码', item.status);        let arr = uni.$http.baseUrl + '/app-xcx-h5/pile/connectorDetail/' + item.pileConnectorCode        console.log('地址', arr);        if (item.status === 0) return uni.$showMsg('当前状态不可点击')        if (item.status === 2) return uni.request({          // https://api.jsowellcloud.com/app-xcx-h5/pile/connectorDetail/8800000000002101   $http.baseUrl          url: uni.$http.baseUrl + '/app-xcx-h5/pile/connectorDetail/' + item            .pileConnectorCode,          header: {            Authorization: `Bearer ${uni.getStorageSync('token')}`          },          success: ({            data: {              obj,              msg            }          }) => {            console.log('成功', obj, msg);            if (obj !== null) {              return uni.navigateTo({                url: '/subpkg/pile/connectorDetail?connectorObj=' + encodeURIComponent(JSON.stringify(obj))              })            } else {              return uni.$showMsg(msg)            }          },          fail: (err) => {            console.log('失败', err);          }        })      },

来源地址:https://blog.csdn.net/LJM51200/article/details/128332164

--结束END--

本文标题: uniapp 之 扫普通二维码进入小程序

本文链接: https://lsjlt.com/news/392829.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • uniapp 之 扫普通二维码进入小程序
    目录 前言 ​编辑提示下 (☆) 问题一  问题二 代码 后续 my.vue文件 B页面 前言 因项目的需求,需要我完成 在微信的扫一扫中,扫后端定义的二维码进入小程序中 这个需求说简单也很简单,说难也不难,就是花费了我几天的时间 需要在...
    99+
    2023-09-03
    uni-app 小程序
  • 微信小程序-扫普通链接二维码打开小程序
    类似很多饭堂扫桌面二维码点餐都是用这种方式实现扫普通链接二维码打开小程序 一、小程序设置: 链接后面带参数: 首先要在小程序管理-开发管理-开发设置:扫普通链接二维码打开小程序 添加可访问的链接,此链接要求域名已备案,并且要下载校验文件,...
    99+
    2023-10-04
    小程序 微信小程序
  • 用户扫描普通二维码进入小程序指定页面详细步骤
    用户扫描普通二维码进入小程序指定页面详细步骤 一、进入微信公众平台小程序开发管理—开发设置—扫普通链接二维码打开小程序—启用 二、添加规则:我这里二维码规则为前台项目地址,可自行修改。下载的校验文件...
    99+
    2023-09-02
    小程序 vue.js 运维
  • 微信小程序扫描普通二维码跳转到小程序指定页面
    这个功能的逻辑是什么呢? 二维码就相当于是一个链接 相当于我们点击一个链接跳转到另一个页面 只不过这里是扫码的形式 如何操作 首先我们需要在微信公众平台的开发管理——>开发设置,找到(扫普通链接二维码...
    99+
    2023-09-08
    微信小程序 小程序 javascript 前端
  • 使用uniapp生成二维码并下载,小程序扫码进入指定页面
    功能1:通过扫码链接进入小程序指定页面(带参数) 功能2:将网址链接(带参数)在微信小程序中使用二维码展示出来,并可以点击下载二维码图片  扫码链接进入指定页面并且带参数 在小程序管理后台-开发管理-开发设置-扫普通链接二维码打开小...
    99+
    2023-09-13
    小程序 uni-app 微信小程序
  • 生成普通的微信小程序二维码
    登录微信小程序后台传送门 开发管理->开发设置->扫普通链接二维码打开小程序   在这里开通此功能,然后按微信定义的规则配置具体的地址,等正式上线的时候再发布该规则  2.然后按照配置的二维码规则(上图第三项)去直接生成普通的二维码(...
    99+
    2023-09-18
    微信小程序 小程序 微信
  • 教你简单搞定小程序扫一扫以及生成普通二维码功能
    问题: 在生活中时常需要用小程序扫描识别相应的二维码(不包含小程序二维码),通过进入到相应的小程序,然后调起手机的相机进行扫一扫。那么将会更加方便简单的实现相应的功能。生成普通的二维码用weapp-qrcode.js来实现,识别二维码用wx...
    99+
    2023-10-22
    小程序 微信小程序 前端 javascript
  • 扫码跳转小程序终极方案,详细记录踩过的坑!不信进来看!扫描普通二维码进入小程序功能记录(两种方式)
    一、第一种方式 小程序管理平台:https://mp.weixin.qq.com/ 选择:开发管理->开发设置->扫普通链接二维码打开小程序 校验文件 点击添加进入配置页面 ...
    99+
    2023-09-07
    小程序 前端 uni-app Powered by 金山文档
  • 微信小程序普通链接二维码如何开发
    本文小编为大家详细介绍“微信小程序普通链接二维码如何开发”,内容详细,步骤清晰,细节处理妥当,希望这篇“微信小程序普通链接二维码如何开发”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。配置普通链接二维码规则&nbs...
    99+
    2023-06-26
  • Android中二维码的生成方法(普通二维码、中心Logo 二维码、及扫描解析二维码)
    首先声明我们通篇用的都是Google开源框架Zxing,要实现的功能有三个 ,生成普通二维码、生成带有中心图片Logo 的二维码,扫描解析二维码,直接上效果图吧 首先我们需要...
    99+
    2022-06-06
    方法 二维 二维码 Android
  • 微信小程序使用weapp-qrcode.js生成二维码以及“扫普通链接二维码打开小程序”动态传递参数实现记录
    参考文章原文链接:微信小程序使用weapp-qrcode.js完成二维码的生成_fairy_404的博客-CSDN博客 首先给需要生成二维码的页面创建一个canvas 因为我这里实现的是弹窗展示二维码,所有就把 canvas移出页面,小伙...
    99+
    2023-09-01
    小程序 微信小程序 javascript
  • 自定义带参数二维码扫码进入微信小程序获取参数
    第一步,需要进入小程序后台,开发设置里,添加二维码规则  第二步,添加好扫码进入的规则,比如扫码进去小程序的指定页面! (1)协议类型选择https (2)选择小写 (3)二维码规则,这个看文档有些人估计会比较迷糊,简单理解一下就是一个...
    99+
    2023-09-11
    微信小程序 小程序
  • 微信小程序扫描二维码概念怎么实现
    这篇“微信小程序扫描二维码概念怎么实现”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“微信小程序扫描二维码概念怎么实现”文章吧...
    99+
    2023-06-26
  • 使用微信小程序实现二维码扫描功能
    使用微信小程序实现二维码扫描功能随着移动互联网的快速发展,二维码已经成为了一种非常方便的信息交互方式。微信小程序作为一种新的应用形式,也提供了二维码扫描功能。本文将介绍如何使用微信小程序实现二维码扫描,并提供具体的代码示例。一、准备工作在开...
    99+
    2023-11-21
    二维码 微信小程序 扫描
  • java生成小程序二维码
    这篇文章将为大家详细讲解有关java生成小程序二维码,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Java生成小程序二维码 引言 小程序二维码是访问小程序的一种便捷方式,可用于宣传推广、用户引导等场景。本...
    99+
    2024-04-02
  • 微信小程序中如何实现二维码分享和扫码功能
    在微信小程序中实现二维码分享和扫码功能,可以通过以下步骤来实现: 生成二维码分享:可以使用第三方的二维码生成库来生成二维码图片,...
    99+
    2024-04-03
    微信小程序
  • 小程序二维码如何生成
    本篇内容介绍了“小程序二维码如何生成”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!正式二维码在“设置”中查看小程序的正式二维码,该二维码只用...
    99+
    2023-06-26
  • PHP实现生成小程序二维码带参数进入指定页面
    1.需求场景 小程序一定要是发布的小程序。2.记得把业务域名加上。 场景:需要在网页上生成小程序的二维码图片,微信扫码之后带参数进入指定的小程序页面 小程序在扫描二维码跳转的指定页面中,在onload里面接收参数。 注意scene是...
    99+
    2023-09-01
    小程序
  • 小程序二维码是什么意思
    这篇文章主要介绍小程序二维码是什么意思,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!小程序二维码是小程序的一个关键的入口,商家通过小程序二维码能力可生成跳转自身小程序指定页面二维码,可用于线上线下贴码推广,便捷推广小...
    99+
    2023-06-22
  • 小程序生成二维码的方法
    这篇文章主要介绍了小程序生成二维码的方法的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇小程序生成二维码的方法文章都会有所收获,下面我们一起来看看吧。  普通链接二维码,是指开发者使用工具对网页链接进行编码后生成...
    99+
    2023-06-26
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作