生成小程序码需要用到的参数

appId

 appSecret

这两个参数可以再微信公众平台里面登录获取 也可以用测试号里面的

获取小程序码步骤

1.首先要请求官方的API

`https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appId}&secret=${appSecret}`,

返回的access_token

然后用返回来的token去请求固定连接

返回来了一个ArrayBuffer 对象

将这个对象转成Base64格式赋值到图片地址即可

qrid这里是你要给页面传递的参数 通过onlod(option)获取

下面是代码

view代码
<image :src="maskData">

//js代码
    getQrCode(access_token) {    //获取小程序码带参数
                const that = this;
                uni.request({
                    url: "https://api.weixin.qq.com/wxa/getwxacode?access_token=" + access_token,//固定链接,不用改
                    method: 'POST',
                    responseType: 'arraybuffer', //设置响应类型
                    data: {
                        path: 'pages/index/index?code=' + that.qrId, // 必须是已经发布的小程序存在的页面(否则报错) ()
                        width: 298,
                        auto_color: true, // 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调
                        line_color: {
                            "r": "0",
                            "g": "0",
                            "b": "0"
                        } // auto_color 为 false 时生效,使用 rgb 设置颜色
                    },
                    success: function(res) {
                        console.log('获取二维码', res)//返回的是ArrayBuffer 对象
                        setTimeout(()=>{
                            that.maskData = "data:image/PNG;BASE64," + uni.arrayBufferToBase64(res.data);//以图片的形式展示
                        },50)
                        
                        // console.log("生成成功2!",that.maskData);
                    }
                })
            },

uniapp如何生成自己的小程序码并且携带参数的更多相关文章

  1. 小程序-生成一个小程序码画在canvas画布上生成一张图片分享出去

    这个需求我遇到过2次.一次是在识别二维码后跳转到其它页面,另一次是识别二维码后进入到生成小程序码的当前页面. 我有一个梦想,就是成为一名黑客!!!!!! 小程序中js wx.request({     ...

  2. 微信小程序分享小程序码的生成,多参数以及参数的获取

    如果本文对你有用,请爱心点个赞,提高排名,帮助更多的人.谢谢大家!❤ 如果解决不了,可以在文末进群交流. 官方文档地址:https://developers.weixin.qq.com/minipro ...

  3. nodejs + 小程序云函数 生成小程序码

    前言:这个东西坑死我了 业务需求要生成小程序码 然后我找了两天的资料 运行 生成一堆的乱码 死活就是不能生成 最后看了一遍博客 套用了一下 自己又简单的改了一下  nodejs 我是刚刚接触  有很多 ...

  4. 微信小程序获取Access_token和页面URL生成小程序码或二维码

    1.微信小程序获取Access_token: access_token具体时效看官方文档. using System; using System.Collections.Generic; using ...

  5. C# 生成小程序码

    /// <summary> /// B接口-微信小程序带参数二维码的生成 /// </summary> /// <param name="access_toke ...

  6. .NET生成小程序码,并合自定义背景图生成推广小程序二维码

    前言: 对于小程序大家可能都非常熟悉了,随着小程序的不断普及越来越多的公司都开始推广使用起来了.今天接到一个需求就是生成小程序码,并且于运营给的推广图片合并在一起做成一张漂亮美观的推广二维码,扫码这种 ...

  7. 微信小程序码生成及canvas绘制

    吐槽:某厂的开发文档写的跟屎一样 1.后台返回accessToken,小程序请求获取小程序码 uni.request({ url: 'https://api.weixin.qq.com/wxa/get ...

  8. 基于c编写的关于随机生成四则运算的小程序

    基于http://www.cnblogs.com/HAOZHE/p/5276763.html改编写的关于随机生成四则运算的小程序 github源码和工程文件地址:https://github.com/ ...

  9. 微信小程序生成指定页面小程序码海报图片分享思路总结

    本博客主要说下思路,具体代码不贴 1.考虑到组件复用,所以我把它做成一个自定义的组件 <my-poster id="getPoster" avater="{{ima ...

随机推荐

  1. 七层LB-NGINX 客户端获取协议Proxy Protocol介绍

    协议诞生背景 在Web分布式系统中,一般会搭建复杂的load blance系统来提供高性能的web服务. 7层的SLB 有基于nginx/淘宝变种tengine的.后端RS会无法获取真实客户端IP. ...

  2. org.apache.jasper.runtime.ELContextImpl cannot be cast to org.apache.jasper.el.ELContextImpl

    org.apache.jasper.runtime.ELContextImpl cannot be cast to org.apache.jasper.el.ELContextImpl错误怎么解决: ...

  3. 客户通过新型网络访问Web服务

  4. SpringBoot结果集包装类

    1.前言 在SpringBoot项目中.看了一部分代码.发现一般的接口以JSON形式返回最佳.接口规范遵照RESTFUL风格来写.返回的结果集呢.借助包装类来包装.这样有利于前后端的交互.写出来的代码 ...

  5. 【LeetCode】653. Two Sum IV - Input is a BST 解题报告(Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 方法一:BFS 方法二:DFS 日期 题目地址:ht ...

  6. 【LeetCode】36. Valid Sudoku 解题报告(Python)

    [LeetCode]36. Valid Sudoku 解题报告(Python) 作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 题目地址 ...

  7. hdu-3183A Magic Lamp(贪心)

    题目的意思是: 给你一个大数,然后删减其中的K个数,并且剩下的数还是按原来在的先后次序排列,求所得的那个数最小的那个数. 思路:贪心(要取得数最小,你从左往右选数的时候,选的第一数,就是选后组成数的位 ...

  8. 2019HPU-ICPC-Training-1

    byl太强了,学弟们太强了-全程被吊打,嘤嘤嘤- A题  Connecting Vertices http://codeforces.com/problemset/problem/888/F 不会 B ...

  9. 【stm32】基于hal库使用野火指南者esp8266 WIFI模块进行TCP传输

    UART.c #include "stm32f1xx_it.h" #include "LED.h" #include "UART.h" #i ...

  10. uniapp h5中解决跨域问题

    "h5": { "title": "互联云玺", "template": "", "rou ...