微信小程序码的应用在推广中占着重要的一席，那么关于微信小程序码的生成常见与后端传递给前端展示使用。

可如果我们需要在前端开发中生成微信小程序码要如何实现呢？

跟着文章来了解如何从零到一实现前端生成推广微信小程序码。

一、生成小程序需要的准备信息

    1、appid：小程序ID

    2、secret：小程序密钥

注：如果不知道appid和secret怎么获取，可本站中搜索《微信小程序中appid和secret的获取及作用》

二、获取access_token

    2.1、请求地址

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

    注：APPID和密钥，需填写自己小程序内的。

uni.request({
	url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=秘钥',
	data: {},
	method: "get",
	success(res) {
		console.log(res)
	},
	fail(e) {
		console.log(e)
	}
})

    2.2、成功后反馈数据如下，提取其中的access_token继续第三步。

{
  "access_token": "12_fwsiPb3QuOW9M6n-A123ik4My2NocTJZZiAIAedc",  
  "expires_in": 7200
}

    注：这里的数据，每次都会不同。这里只是作为案例展示。请勿直接使用。

三、请求生成小程序码

    3.1、请求生成小程序码完整代码

uni.request({
  url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token='+第二步中获取的access_token,
  data: {
	scene: '000',
	page: ""  //这里按照需求设置值和参数   
  },
  method: "POST",
  responseType: 'arraybuffer',  //设置响应类型
  success(res) {
	var src2 = uni.arrayBufferToBase64(res.data);  //对数据进行转换操作
	//拼接base64图片
	//  'data:image/png;base64,'+src2
  },
  fail(e) {
	console.log(e)
  }
})

    3.2、参数解析

        scene：需要传递的参数

        page：生成小程序码的页面路径。若你的小程序未上线，可为空（直接默认首页）。

警告：非必要不建议在前端生成小程序，至少关于密钥这些关键信息不应该在前端中直接使用。