精华内容
下载资源
问答
  • uniapp小程序生成小程序

    千次阅读 2020-11-27 10:50:34
    用于前端自己测试如何生成小程序码 <!-- 以图片的形式展示 --> <image :src="maskData"></image> onLoad(options) { console.log('需要推荐码',options)//打印出来是 {scene: "code%3D2QQ"} ...


    前言

    需求:用户通过扫描小程序码,直接跳转到小程序的登陆页,并自动填充推荐码


    一、自测版本

    用于前端自己测试如何生成小程序码

    <!-- 以图片的形式展示 -->
    <image :src="maskData"></image>
    
    onLoad(options) {
        console.log('需要推荐码',options)//打印出来是 {scene: "code%3D2QQ"}
    	const scene = options.scene ? decodeURIComponent(options.scene) : ''
    	console.log('编译出来的scene',scene) //打印出来是 code=3D2QQ
    	this.code = scene.split('=')[1]//打印出来是 3D2QQ
    	console.log('编译出来的推荐码',this.code)
    },
    
    getData(e) {
    	//获取accessToken
    	let that = this;
    	const APP_ID = 'xxx'; // 小程序appid
    	const APP_SECRET = 'xxxxx'; // 小程序app_secret
    	let access_token = '';
    	uni.request({
    		url: "https://api.weixin.qq.com/cgi-bin/token", //固定链接,不用改
    		data: {
    			grant_type: 'client_credential',
    			appid: APP_ID,
    			secret: APP_SECRET
    		},
    		success: function(res) {
    			console.log('获取accessToken', res)
    			access_token = res.data.access_token;
    			// 接口B:适用于需要的码数量极多的业务场景 生成的是小程序码
    			that.getQrCode(access_token);
    		}
    	})
    },
    //获取二维码
    getQrCode(access_token) {
    	var that = this;
    	uni.request({
    		url: "https://api.weixin.qq.com/wxa/getwxacode?access_token=" + access_token,//固定链接,不用改
    		method: 'POST',
    		responseType: 'arraybuffer', //设置响应类型
    		data: {
    			path: 'pages/public/login?code=' + that.code, // 必须是已经发布的小程序存在的页面(否则报错)
    			width: 298,
    			auto_color: false, // 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调
    			line_color: {
    				"r": "0",
    				"g": "0",
    				"b": "0"
    			} // auto_color 为 false 时生效,使用 rgb 设置颜色
    		},
    		success: function(res) {
    			console.log('获取二维码', res)
    			that.maskData = "data:image/PNG;BASE64," + uni.arrayBufferToBase64(res.data);//以图片的形式展示
    		}
    	})
    }
    

    二、线上版本

    原来以为很难的,压力都在前端,等做完了,测试体验版的时候,发现api.weixin.qq.com域名没加进去,结果官方跟我说,不能加这个域名,原因是前端不能直接用上面的方法自己去生成小程序码,必须要通过后台服务器转一下
    在这里插入图片描述

    // 给了个token,后端自己去实现自测版本中的操作-生成小程序码,返回图片地址,前端直接展示图片就好了,666
    getData(e) {
    	this.$api
    		.qrcode({
    			token: this.token
    		})
    		.then(res => {
    			console.log('我的推荐码', res)
    			this.maskData = res
    		})
    		.catch(err => {
    			this.$api.msg(err)
    		});
    

    三、测试

    截取生成小程序码的图片,用微信开发者工具的“通过二维码编译”扫码测试能不能拿到参数,并填充
    在这里插入图片描述


    总结

    事情其实很简单,没必要想的太复杂

    展开全文
  • 微信小程序生成小程序二维码流程

    万次阅读 2018-04-02 20:14:57
    小程序需要先上线才能生成二维码 一:获取access_token 接口调用请求说明 https请求方式: GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPI...

    微信小程序开发交流qq群   173683895

       承接微信小程序开发。扫码加微信。

    正文:

    小程序需要先上线才能生成二维码

    一: 获取access_token

     

    接口调用请求说明

    https请求方式: GET
    https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
    

    参数说明

    参数 是否必须 说明
    grant_type 获取access_token填写client_credential
    appid 第三方用户唯一凭证
    secret 第三方用户唯一凭证密钥,即appsecret

    返回说明

    正常情况下,微信会返回下述JSON数据包给公众号:

    {"access_token":"ACCESS_TOKEN","expires_in":7200}
    

    参数说明

    参数 说明
    access_token 获取到的凭证
    expires_in 凭证有效时间,单位:秒

    二 : 获取小程序码

     

    我们推荐生成并使用小程序码,它具有更好的辨识度。目前有两个接口可以生成小程序码,开发者可以根据自己的需要选择合适的接口。

     

    接口A: 适用于需要的码数量较少的业务场景 接口地址:

    https://api.weixin.qq.com/wxa/getwxacode?access_token=ACCESS_TOKEN
    

    获取 access_token 详见文档

    POST 参数说明

    参数 类型 默认值 说明
    path String   不能为空,最大长度 128 字节
    width Int 430 二维码的宽度
    auto_color Bool false 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调
    line_color Object {"r":"0","g":"0","b":"0"} auth_color 为 false 时生效,使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"},十进制表示

    注意:通过该接口生成的小程序码,永久有效,数量限制见文末说明,请谨慎使用。用户扫描该码进入小程序后,将直接进入 path 对应的页面。

    接口B:适用于需要的码数量极多的业务场景

    接口地址:

    https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN
    

    获取 access_token 详见文档

    POST 参数说明

    参数 类型 默认值 说明
    scene String   最大32个可见字符,只支持数字,大小写英文以及部分特殊字符:!#$&'()*+,/:;=?@-._~,其它字符请自行编码为合法字符(因不支持%,中文无法使用 urlencode 处理,请使用其他编码方式)
    page String   必须是已经发布的小程序存在的页面(否则报错),例如 "pages/index/index" ,根路径前不要填加'/',不能携带参数(参数请放在scene字段里),如果不填写这个字段,默认跳主页面
    width Int 430 二维码的宽度
    auto_color Bool false 自动配置线条颜色,如果颜色依然是黑色,则说明不建议配置主色调
    line_color Object {"r":"0","g":"0","b":"0"} auto_color 为 false 时生效,使用 rgb 设置颜色 例如 {"r":"xxx","g":"xxx","b":"xxx"} 十进制表示

    注意:通过该接口生成的小程序码,永久有效,数量暂无限制。用户扫描该码进入小程序后,开发者需在对应页面获取的码中 scene 字段的值,再做处理逻辑。使用如下代码可以获取到二维码中的 scene 字段的值。调试阶段可以使用开发工具的条件编译自定义参数 scene=xxxx 进行模拟,开发工具模拟时的 scene 的参数值需要进行 urlencode

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

    获取小程序二维码

    接口C:适用于需要的码数量较少的业务场景

    接口地址:

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

    获取 access_token 详见文档

    POST 参数说明

    参数 类型 默认值 说明
    path String   不能为空,最大长度 128 字节
    width Int 430 二维码的宽度

    注意:通过该接口生成的小程序二维码,永久有效,数量限制见文末说明,请谨慎使用。用户扫描该码进入小程序后,将直接进入 path 对应的页面。

    Bug & Tip

    1. tip:通过该接口,仅能生成已发布的小程序的二维码。
    2. tip:可以在开发者工具预览时生成开发版的带参二维码。
    3. tip:接口A加上接口C,总共生成的码数量限制为100,000,请谨慎调用。
    4. tip: POST 参数需要转成 json 字符串,不支持 form 表单提交。
    5. tip: auto_color line_color 参数仅对小程序码生效。

    错误码

    45009:B接口调用分钟频率受限(目前5000次/分钟,会调整),如需大量小程序码,建议预生成。 45029:A接口和C接口生成码个数总和到达最大个数限制。 41030:B接口所传page页面不存在,或者小程序没有发布,请注意B接口没有path参数,传path参数虽然可以生成小程序码,但是只能跳主页面。

     

    展开全文
  • js生成小程序某页面二维码(生成小程序二维码)

    万次阅读 多人点赞 2018-08-02 11:15:09
    时候会有业务需求生成某页面的小程序二维码,进入指定页面 效果图: 首先要获取access_token; 下面是链接 https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&...

     

    时候会有业务需求生成某页面的小程序二维码,进入指定页面

    效果图:

    首先要获取access_token;

    下面是链接

    https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=秘钥

    红色字体需要用户自己根据信息填充。

    请求成功返回的结果是下面这种形式的

    
    //注意:以下参数值不可以直接复制粘贴使用,需要自己根据上面的链接+参数获取使用
    {
      "access_token": "12_fbGiPb3QuOW9M6n-Abg0ik4My2NocTJZZiAIAEUU",  
      "expires_in": 7200
    }

    expires_in:是一个有效期;

    获取完access_token,下面开始正式我们的请求:

     

    index.js:

    //index.js
    //获取应用实例
    const app = getApp()
    
    Page({
      data: {
      },
      onLoad: function (options) {
        var that = this;
        var scene = decodeURIComponent(options.scene)
    
        // 生成页面的二维码
        wx.request({
    //注意:下面的access_token值可以不可以直接复制使用,需要自己请求获取
          url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=AbgEb2z0il9eIsqn6pWJTmSkvTcJhtb1As3_e049Qv_iFnVw8TXKEa2N8nn3GBKJbQaJ9G2ae5At4Cirphd8HFaduGvMU14UpuWjJz6X0i74I8-',
          data: {
            scene: '000',
            page: "pages/index/index"  //这里按照需求设置值和参数   
          },
          method: "POST",
          responseType: 'arraybuffer',  //设置响应类型
          success(res) {
            console.log(res)
            var src2 = wx.arrayBufferToBase64(res.data);  //对数据进行转换操作
            that.setData({
              src2
            })
          },
          fail(e) {
            console.log(e)
          }
        })
    
    
      },
    
    })
    

    index.wxml

    <view>
       <view class='img'>
        <image src='data:image/png;base64,{{src2}}'></image>
       </view>
    </view>

    注意:对于没有发布的小程序page参数要设置为空,不然会导致二维码生成失败,在发布前按需改回来就好

     

    展开全文
  • 小程序码是微信自己推出的二维码, 可以通过扫描小程序码, 直接进入到对应的小程序页面。 普通的二维码是正方形的, 而小程序码是圆形, 更加容易让用户识别出来。 二、 在线生成微信小程序码 1) ...

    一、 微信小程序码是什么

    小程序码是微信自己推出的二维码,
    可以通过扫描小程序码,
    直接进入到对应的小程序页面。

    普通的二维码是正方形的,
    而小程序码是圆形,
    更加容易让用户识别出来。

    二、 在线生成微信小程序码

    1) 进入在线生成小程序码页面
    https://www.qinziheng.com/weapp/qrcode.html
    2) 填写生成小程序码相关信息
    包括:
    2.1) 你的小程序 APPID
    猛击查看《如何获取小程序APPID》
    2.2) 你的小程序 APP SECRET
    猛击查看《如何获取小程序APP SECRET》
    2.3) 小程序码路径
    扫描小程序二维码后,跳转的页面路径;
    路径可以带参数,
    路径的最前面不需要添加 /
    3) 点击‘生成二维码’按钮
    系统会自动帮你生成小程序码
    4) 下载小程序码
    在二维码上点击右键,
    选择‘图片另存为’就行

    在线生成小程序码

    在线生成小程序码

    三、 在线生成小程序码要注意的地方

    1) 我们不会保存你小程序的APPID, APP SECRET
    请放心使用
    2) 为了安全,每过一段时间我们会清理生成的小程序码,
    请你即时下载保存

    狂击这里了解《怎么自己开发生成小程序码》

    https://211.qinziheng.com/lesson/543/

    展开全文
  • 生成微信小程序

    千次阅读 2021-07-21 15:44:02
    生成微信小程序码 通过查阅微信官方文档,得知获取微信小程序码有两个步骤: wxacode.getUnlimited | 微信开放文档 获取 AccessToken public Supplier<String> getAccessToken() { return () -> { ...
  • 一、获取京东小程序APPID 二、获取小程序路径 1、随便进入一个小程序的开发后台 2、点击生成小程序码,然后输入小程序的appid选择小程序,点击下一步 3、然后点击获取更多页面路径,在弹出的输入框中输入你的...
  • 接下来哪些不会代码开发,想生成自己小程序的朋友的福利来了。 老规矩,先看效果图 云开发低码 这种可以快速靠拖拽生成小程序的平台原来是腾讯云开发出的,叫云开发低码。进去官方文档一看。原来不仅仅支持拖拽生成...
  • 通过后台接口可以获取小程序任意页面的小程序码,扫描该小程序码可以直接进入小程序对应的页面,所有生成小程序码永久有效,可放心使用。 目前小程序码有两种形式,推荐生成并使用小程序码,它具有更好的辨识度,...
  • 小程序生成小程序码分享朋友圈

    千次阅读 2019-03-08 15:45:32
    公司很多时候都会想要传播自己小程序,从而获取更多的流量,从而分享朋友圈的功能就诞生了。 分享步骤: 一、通过canvas组件把要分享出去的东西画出来 二、通过saveImageToPhotosAlbum方法把canvas生成的画布转...
  • 1.小程序生成只对已上线,已存在的页面有效,否则会抛出如下错误。stdClass Object ( [errcode] =&gt; 41030 [errmsg] =&gt; invalid page hint: [bv8Yha08468927] ) ,即不可用的页面。即已经上线的页面...
  • 生成随机数小程序

    千次阅读 2019-09-09 16:04:05
    微信小程序生成随机数 const charts = [‘0’,‘1’,‘2’,‘3’,‘4’,‘5’,‘6’,‘7’,‘8’,‘9’,‘A’,‘B’,‘C’,‘D’,‘E’,‘F’,‘G’,‘H’,‘I’,‘J’,‘K’,‘L’,‘M’,‘N’,‘O’,‘P’,‘Q’,...
  • 扫码已经成为一种常见又方便的进入移动应用的途径,可以把线上线下的用户流量带入你的移动应用中来。微信小程序也提供了扫...微信官方提供了3个不同的REST API用于生成带参数的小程序码或者二维码,可在扫码后进入...
  • 小程序生成自带参数的小程序

    千次阅读 2020-04-02 10:49:59
    开发文档的生成小程序码是后端调用的接口,前端只需要把路径跟参数传过去,获取到返回的小程序码即可 获取页面参数 data(){ return{ id:' ', //参数 imgUrl:' ',/接收小程序码url地址 } } onload:...
  • PHP版 微信小程序生成带参数小程序二维码图片 php接口+小程序demo 小程序端js代码 getcodes:function(){ var that=this wx.request({  url: 'http://www.gecodes.com/codes.php',  data:{  id:1,  ...
  • 微信小程序开发【前端+后端(java)】

    万次阅读 多人点赞 2018-07-13 22:19:46
    现在微信小程序越来越火了,相信不少人都通过各种途径学习过微信小程序或者尝试开发,作者就是曾经由于兴趣了解开发过微信小程序,最终自己的毕业设计也是开发一个微信小程序。所以现在用这篇博客记录我之前开发的...
  • 微信小程序前端开发者工具(小程序切片)是一款根据效果图像画画一样来设计微信小程序,自动生成导出前端页面的快速开发工具。可以很方便、快速地生成小程序的wxml,wcss,js文件。可以大大提高您的工作效率,减少前端...
  • 该功能的核心地方就在于,使用微信小程序生成小程序码。而该小程序码中就是带有用户标识参数的,接下来一起来揭开生成带参小程序码的面纱吧。 具体代码如下: public function getWxAcCode() { $wx = new ...
  • 微信小程序生成带参数的二维码 官方共给了三个接口调用,大家可以根据自己的实际情况来使用,我这里使用的是接口B和接口C。 官方文档地址 业务需求: 扫描二维码进入指定商品页面,需要的参数为商品id(goods_id)。...
  • 微信小程序生成每个用户带自己二维码的海报 效果图 下载海报背景图片 /** * 下载背景海报 */ downloadBGImg: function (phoneNumber) { var that = this; wx.downloadFile({ //服务器图片地址 url: ...
  • 2 点击右上角工具-》生成小程序码 3 填写小程序名称或appid 4 关键一步,下面页面填写用户微信号后,打开小程序到某一个页面,点击右上角。。。,其中就出现了复制本页路径,复制路径到下面页面,点击确定就...
  • 小程序生成小程序码(thinkphp)

    千次阅读 2017-08-21 15:21:29
    生成小程序码tp后台处理public function getwxaqrcode() { $access_token = $this->AccessToken(); $url = 'https://api.weixin.qq.com/wxa/getwxacode?access_token='.$access_token; $path="page
  • 经过服务端的配置生成小程序二维码,每次用手机扫小程序二维码都会跳到手机已经发布的小程序中,因为二维码配置了 scene 参数,就没法调试开发版本对 scene 里面的参数处理的代码块了。 Page({ onLoad (query) {...
  • PHP生成微信小程序二维码

    千次阅读 2018-02-10 10:46:11
    目前有3个接口可以生成小程序码,开发者可以根据自己的需要选择合适的接口。接口A: 适用于需要的码数量较少的业务场景 接口地址:https://api.weixin.qq.com/wxa/getwxacode?access_token=ACCESS_TOKEN参数如下...
  • 第一次写小程序生成二维码。。一点头绪没有。。然后就。。去看官方文档。。额。。看得似懂非懂。。尴尬!!。。不说了。。直接看代码吧。。唉。。过程很曲折。。结局很美好。。还有注意。。我下文中踩过的坑!!一定...
  • 最近做小程序遇到一个功能: 从列表进入的详情页面,有生成海报的功能,这个功能用canvas就可以实现,我之前的文章有哦。...好,下面来讲怎么实现这个功能:先来看一组小程序生成小程序码的官方文档 ...
  • 零基础入门微信小程序开发

    万次阅读 多人点赞 2018-07-03 02:45:07
    本课程是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件、页面样式文件、JavaScript 的基本知识并以指南针为例对基本知识进行扩展,另外加上开发工具的安装...
  • 小程序参数二维码生成

    万次阅读 2018-01-06 11:59:51
    小程序参数二维码生成工具:芝麻小程序码 支持接口A,菊花小程序参数二维码。接口B:小程序场景二维码,接口C:普通小程序二维码 获取二维码 通过后台接口可以获取小程序任意页面的二维码,扫描该二维码可以...
  • Java生成微信小程序二维码

    千次阅读 2019-05-20 15:01:29
    Java生成微信小程序二维码 import java.io.BufferedInputStream; import java.io.BufferedReader; import java.io.ByteArrayInputStream; import java.io.File; import java.io.FileOutputStream; import java.io....
  • 2.最近同时写小程序和vue的项目,页面动态属性已经混乱造成自己自己挖了个坑,注意小程序上的src没有:号 所以大家在写代码的时候要保持清醒,哈哈哈,尤其是一边写微信小程序,一边写vue的时候,给自己跪了。...
  • 微信小程序开发 - 用户授权登陆

    万次阅读 多人点赞 2018-05-21 15:32:24
    本篇将帮助读者实现基于 微信开发者工具 &amp; C#环境 下的用户在小程序上的授权登陆。 准备: 微信开发者工具下载地址:...微信小程序开发文档:https://developers.weixin.qq.com/miniprogram/d...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,146,420
精华内容 858,568
关键字:

怎样生成自己的小程序