扫描二维码进小程序指定页面(包解决!!)

这篇具有很好参考价值的文章主要介绍了扫描二维码进小程序指定页面(包解决!!)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一,你需要知道的

1.在开发小程序时,有时会有扫描二维码进入小程序的指定页面的业务需求。

2.微信小程序提供了这种功能,具体实现可以分三步

(1)在微信小程序后台配置好
(2)如何跳转
(3)代码中

二,小程序配置

1.首先需要在小程序后台-开发管理-开发设置下的扫描二维码进小程序模块配置二维码规则

获取参数信息并跳转

android 扫描二维码打开小程序,小程序,vue,vue.js,前端,javascript,微信小程序

2.配置二维码规则(很重要!!!)

耐心看完

android 扫描二维码打开小程序,小程序,vue,vue.js,前端,javascript,微信小程序

2.小程序中跳转处理

你可以将测试链接复制下来,随便找到一个二维码生成工具网站,生成二维码,以便下面的测试

在首页中onLoad中接受参数

android 扫描二维码打开小程序,小程序,vue,vue.js,前端,javascript,微信小程序

sharedParameterAnalysis是自己定义的函数,统一处理参数

// 小程序分享进入或二维码进入封装方法
	sharedParameterAnalysis(options) {
		// 小程序分享跳转处理
		if (options?.share) {
			console.log("小程序分享,路径为" + options.path + "参数为" + options.query);
			// 小程序分享跳转处理
			uni.navigateTo({
				url: "/" + options.path + "?" + options.query,
			});
		} else if (options?.q) {//直接看这个!!!!!!!!!!!!!!!!!!!!!!
			// 小程序自动加密,需要解码
			const url = decodeURIComponent(options.q);
			const regex = /[?&]([^=#]+)=([^&#]*)/g;
			const params = {};
			let match;
			while ((match = regex.exec(url))) {
				params[match[1]] = match[2];
			}
			console.log("二维码分享,路径为" + params.path + "参数为" + params.query);

			// 小程序分享跳转处理
			uni.navigateTo({
				url: "/" + params.path + "?" + params.query,
			});
		} else {
			// 未知参数
			console.log("未知参数");
			uni.showToast({
				title: "未知参数",
				icon: "none",
			});
		}
	},

如果是二维码跳转options中会有q这个参数,内容为完整的测试链接,小程序会自动加密其中的路径地址

const url = decodeURIComponent(options.q);
			const regex = /[?&]([^=#]+)=([^&#]*)/g;
			const params = {};
			let match;
			while ((match = regex.exec(url))) {
				params[match[1]] = match[2];
			}

以上方法可以将options中q的路径解密出来,然后将其中的参数一一取出

eg:xxx.cn/qwe/index?share=1&path=pages_branch/details/index&query=id=36

此时params中会提取出

const params={
    share:"1",
    path:"pages_branch/details/index",
    query:"id=36"
}

这个时候路径有了参数也有了,不就可以了吗!!

用户微信扫一扫即可打开指定页面了,多试几遍,一定可以文章来源地址https://www.toymoban.com/news/detail-768342.html

到了这里,关于扫描二维码进小程序指定页面(包解决!!)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • 猿创征文|微信小程序扫描二维码如何跳转小程序内指定页面并传递参数给目标页面?

    实际项目中,用户通过扫描打印小票上的二维码,自己实现开具发票功能,那么这里就需要用户在扫描小票二维码后,跳转小程序内添加开票信息并提交后台开具发票的页面。 首先二维码的本质就是一个链接地址。 其次登录微信小程序开放平台,设置 扫普通链接二维码打开

    2023年04月08日
    浏览(54)
  • 【微信小程序】扫描外部二维码、小程序码进入并获得携带参数,使用参数跳转到指定页面

    您需要使用微信提供的跳转链接和相关参数。以下是实现的步骤: 生成跳转链接:使用以下链接格式生成跳转链接,其中 APPID 是您的小程序的 AppID, PATH 是您要跳转的页面路径, QUERY 是您要传递的参数。 生成二维码:使用生成的跳转链接生成二维码。您可以使用在线的二维

    2024年02月08日
    浏览(60)
  • 扫二维码打开小程序指定页面

    一、官方说明: https://developers.weixin.qq.com/miniprogram/introduction/qrcode.html#%E5%8A%9F%E8%83%BD%E4%BB%8B%E7%BB%8D 二、登录小程序网站,开发管理-开发设置,拖到下面,找到“扫普通链接二维码打开小程序”,点击添加按钮,填写下图中的信息。 二维码规则:拿ICP备案的域名,随便写个方

    2024年02月14日
    浏览(28)
  • vue页面动态生成二维码,扫描二维码跳转到微信小程序,同时传递参数

    最近领导提了个新的需求, 点击表格时,弹出一个二维码,微信扫描此二维码时,跳转到微信小程序,同时将所在行的id(即员工所在公司的id)传过去,这样员工在登录微信小程序时,根据此id就知道是哪个公司的员工登录或者注册 了! 刚开始想的是,直接把小程序的二维

    2024年02月11日
    浏览(74)
  • 微信小程序任意指定页面生成二维码

    在日常微信小程序运营中,文章,和朋友圈海报内总会用到微信小程序特定页面二维码 ps:一定要输入当前小程序小程序项目成员的微信号

    2024年02月11日
    浏览(55)
  • 使用uniapp生成二维码并下载,小程序扫码进入指定页面

    功能1:通过扫码链接进入小程序指定页面(带参数) 功能2:将网址链接(带参数)在微信小程序中使用二维码展示出来,并可以点击下载二维码图片  扫码链接进入指定页面并且带参数 在小程序管理后台-开发管理-开发设置-扫普通链接二维码打开小程序中,配置链接地址,

    2024年02月11日
    浏览(51)
  • 微信扫描普通二维码进入小程序

    微信扫描普通二维码进入小程序的方法,和代码没有什么关系,主要是在 小程序平台 进行设置 1. 开发配置 开发 —— 开发管理 —— 开发设置 —— 扫普通链接二维码打开小程序 2. 配置规则 根据说明配置内容就行,后面有说带参数的配置和怎么在小程序里面获取参数 带参数

    2024年02月11日
    浏览(64)
  • 【小程序内嵌H5扫描一维码/二维码】

    一. 需求描述:小程序内嵌的H5工程里面扫描快递单上的一维码/二维码,并自动显示在页面上 效果图 二. 实现方式:小程序web-view支持JSSDK接口中包含微信扫一扫接口,小程序内嵌的H5页面可以直接调起扫码功能,参考文档如下:文档链接 三. 代码实现: 1. 先安装jssdk(我是用

    2024年02月09日
    浏览(40)
  • 小程序调用扫码接口,实现扫描二维码

    小程序实现扫描二维码,需要调用微信扫码的api,如下: wxml文件代码如下: js文件代码如下: 注意: success函数回调成功后的res值 res.result 所扫码的内容 res.scanType 所扫码的类型 res.charSet 所扫码的字符集 res.path 当所扫的码为当前小程序二维码时,会返回此字段,内容为二维码携带

    2024年02月04日
    浏览(35)
  • 小程序扫描二维码获取网址,通过Jsoup进行解析

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 目录 文章目录 前言 一、Jsoup是什么? 二、使用步骤 1.引入库 2.读入数据 总结 vx开发小程序使用扫一扫时不同二维码展示的东西不一样,需要进行解析 提示:以下是本篇文章正文内容,下面案例可供参考

    2024年02月12日
    浏览(40)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包