110

小程序二维码和小程序带参数二维码生成 - Likwo

 6 years ago
source link: https://www.cnblogs.com/likwo/p/8205533.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

小程序二维码和小程序带参数二维码生成 - Likwo - 博客园



  博客园 ::

首页 :: 博问 :: 闪存 ::

新随笔 ::

联系 ::

订阅

::

管理 ::

  729 随笔 :: 0 文章 :: 323 评论 ::

342万 阅读

本文主要讲解小程序二维码的基本概念,帮助开发和运营人员更好的掌握小程序参数二维码,同时也包含小程序二维码官方文档解读,更好的掌握小程序参数二维码在业务中的使用

一,小程序二维码小白介绍

二,小程序二维码开发介绍

三,小程序二维码生成介绍

四,小程序二维码官方文档解读

一,小程序参数二维码小白篇
介绍参数二维码的基础知识,让开发者和运营者知道什么是参数二维码

1. 首先我们要了解,什么是小程序的二维码?

  以下是小程序二维码

79124-20180105165758096-1954973341.png
79124-20180105170259518-1933841474.png

            小程序的菊花码                                     普通的小程序二维码    

2. 为什么小程序码是圆的放射型,也称为菊花码

 小程序最开始使用的是常规方形的二维码,后面微信专门为此设计了一套菊花码,也就是图二,为什么要专门搞一套小程序特有的编码呢,估计是

 (1)专利原因

    方形二维码的专利属于别人,微信没有专利。

 (2)区分普通二维码,减少用户扫码额疑虑

     将小程序和普通的二维码进行区分,现在大家看到二维码,都不敢随便扫,但是如果提前知道二维码属于哪一类,对手机有没有危害性,这样就会减少扫码人的顾虑,大家看方形的二维码中间那   块还是圆的,就是为了,让大家知道这个是小程序,而且微信生成的二维码里,还有一句提示,明确的告之用户,这是小程序,可以放心使用 

   更多小程序的菊花码故事,请跳转到这里  https://www.qcloud.com/community/article/347791     

3. 什么是小程序带参数的二维码

   小程序的带参数的二维码,顾名思义。就是就将参数带入小程序内,当然参数这个,是明显偏技术类的一个名称。 我们来举2个例子

  播放视频例子

  比如打开一个网页,播放视频

  https://v.qq.com?play=湖人队比赛

  当你打开网页的时候,网站知道你想要打开看的是湖人对的比赛,而参数名是play,参数值是湖人队比赛,那么网站就直接打开这个页面给您,而不是进入网站的首页。

  同样的道理,当我扫码二维码打开小程序的时候,我希望能够直接找到对应的内容,而不是进入首页,一个一个去浏览。

   衣服购买例子

79124-20180105172314909-187324773.png

我扫码二维码后,希望进入衣服的购买介绍页面,而不是小程序的首页,这样节省时间。

 共享单车例子

 再比如摩拜单车,每扫一个二维码,就直接对应的是这辆车,进入摩拜的小程序,摩拜是知道

79124-20180105172555971-223301204.png

        

79124-20180105172750237-1284222456.png

    图中的编号02110015717 就传递到摩拜小程序了,摩拜小程序就知道你想打开哪辆车了(妹子和本文无关,不是我女朋友)。

    所以带参数二维码,就是将数据直接带入小程序,小程序知道用户是扫哪个二维码过来的,参数是什么,用户希望做什么

    所以带参数二维码,就是通过参数直达小程序的内容页面。参数二维码还有哪些场景呢?

    小程序带参数二维码场景举例

       医院场景:比如每个医生一个id,通过带参数二维码,扫码二维码就直接进入小程序医生页面

       餐厅场景:比如每个菜一个二维码,通过扫码这个菜的二维码,进入小程序后,可以直接点这道菜,而不是要找菜铺。

       电商场景:扫码二维码带参数,进入小程序直接购买,比如通过公众号,通过带参数二维码,用户长按识别,直接进入服装的购买页面,提高购买转换。

       音乐场景:扫码某个带参数二维码,直接打开播放某个固定的歌曲

       推广场景:

           线上推广

          比如我同样的一件衣服,放在A公众号推广,有多少人购买了,放在B公众号有多少人购买了,怎么区分和统计呢?

          那就增加一个参数两个二维码,增加一个参数,A公众号设置qudao=A  B公众号设置参数qudao=B,那么我们小程序就知道同样的一件衣服,是哪个公众号购买的

          线下推广:

     通过带参数的二维码,商家将这些独一无二的小程序码配置在不同的物料上,开发者通过追踪到用户都是从哪儿识别进入到小程序,让商家清楚了解到各物料的投放效果。

这样,我们就知道哪边的推广效果好。

到这里小程序的参数二维码的具体用户我们大致是知道了。

二,小程序参数二维码开发篇
介绍如何开发小程序参数二维码,如何在开发模拟小程序参数二维码,以及代码里如何获取小程序参数码的值

1. 自定义编译条件

79124-20180105175901253-1140385679.png

2. 在代理的onLoad里获取参数值

Page({
  onLoad: function(options) {
    // options 中的 scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
    var scene = decodeURIComponent(options.scene)
    //
    var query = options.query.dentistId // 3736
  }
})

我们通过onLoad 的options的参数,可以很方便的获取小程序带参数二维码传递过来的参数,以及场景参数二维码的值

三,小程序参数二维码生成篇

   当小程序审核通过后,那么线上的小程序二维码是如何生成呢?芝麻小程序码提供了程序二维码生成工具。

   网址如下 https://weixin.hotapp.cn 

79124-20180105181712331-814122616.png

芝麻小程序码的特色

(1)支持小程序路径带参数,自定义带参数

(2)小程序码,方形小程序码,以及小程序码的美化

(3)支持创建带场景值的二维码

(4)支持小程序参数二维码的统计,统计扫码人数,扫码次数

四,小程序二维码官方文档解读

    小程序二维码生成官方文档链接 https://mp.weixin.qq.com/debug/wxadoc/dev/api/qrcode.html

    接口A:生成普通菊花小程序带参数二维码,适用于需要的码数量较少的业务场景,通过该接口生成的小程序码,永久有效,用户扫描该码进入小程序后,将直接进入 path 对应的页面。

              数量限制是10万个

  接口地址:https://api.weixin.qq.com/wxa/getwxacode?access_token=ACCESS_TOKEN
79124-20180105184856784-1165460154.png

    接口A的的生成二维码,如何生成,二维码样式,选择普通的菊花码

    

79124-20180105184242424-1070502588.png

  接口B:生成场景小程序参数二维码
  通过该接口生成的小程序码,永久有效,数量不限制,用户扫描该码进入小程序后,将直接进入 path 对应的页面。

   接口地址:https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN

用户扫描该码进入小程序后,开发者需在对应页面获取的码中 scene 字段的值,再做处理逻辑。使用如下代码可以获取到二维码中的 scene 字段的值。调试阶段可以使用开发工具的条件编译自定义参数 scene=xxxx 进行模拟,开发工具模拟时的 scene 的参数值需要进行 urlencode

// 这是首页的 js
Page({
onLoad: function(options) {
// options 中的 scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
var scene = decodeURIComponent(options.scene)
}
})

产品发布后,场景小程序码的生成方法

79124-20180105184143862-1987161729.png

 接口C:普通方形二维码,适用于需要的码数量较少的业务场景,接口C和接口A的二维码总数量是10万个。如果数量比较多。需要用接口B,场景参数二维码

接口地址:https://api.weixin.qq.com/cgi-bin/wxaapp/createwxaqrcode?access_token=ACCESS_TOKEN

79124-20180105184525721-337800920.png

小程序二维码生成工具:芝麻小程序码 https://weixin.hotapp.cn


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK