Java集成微信小程序生成二维码传回前端,提供下载按钮

这篇具有很好参考价值的文章主要介绍了Java集成微信小程序生成二维码传回前端,提供下载按钮。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1、后端调用方法获取AccessToken的工具类


import com.alibaba.fastjson2.JSON;
import com.alibaba.fastjson2.JSONObject;
import org.springframework.web.client.RestTemplate;

import java.util.Map;

public class qrUtils {
//    private static final String ACCESS_TOKEN_URL = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={appId}&secret={secret}";;
    private static final String ACCESS_TOKEN_URL = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='输入自己的小程序ID'&secret='输入自己的小程序密钥'";;

    /**
     * 获取微信的appId的工具类,字符串之后需要JSON.parseObject转化。
     *
     * @param
     * @param
     * @return 获取结果
     */
    public static String getAccessToken() {
        String accesstoken=new String();
        String requestUrl = ACCESS_TOKEN_URL;
//        //传入参数替换
//        requestUrl = requestUrl.replaceAll("appId", appId);
//        requestUrl = requestUrl.replaceAll("secret", secret);
        //超时,需要重新请求接口
        RestTemplate restTemplate = new RestTemplate();
        String result = restTemplate.getForObject(requestUrl, String.class);
        JSONObject jsonObject = JSON.parseObject(result.toString());
        accesstoken = jsonObject.getString("access_token");
        return result;
    }

}

2、获取完AccessToken后调用微信小程序接口,写一个微信小程序工具类


import com.alibaba.fastjson2.JSON;
import com.alibaba.fastjson2.JSONObject;
import com.ruoyi.common.core.controller.BaseController;
import org.springframework.http.ResponseEntity;
import org.springframework.web.client.RestTemplate;
import com.ruoyi.*;

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.HashMap;
import java.util.Map;



public class WeChatUtil  {
// 这是获取不受限制的小程序码,官网还有其他两种
    private static final String WX_CODE_URL = "https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=AccessToken";

//    public static WxCodeUnlimitedResponseParam getUnlimitedCode(String accessToken, String scene, String page) {
    public static WxCodeUnlimitedResponseParam getUnlimitedCode(String accessToken) {
        JSONObject jsonObject = JSON.parseObject(accessToken.toString());
        String accesstoken1 = jsonObject.getString("access_token");
        // url请求参数值
        Map<String, Object> params = new HashMap<String, Object>();
        //**注意:接口文档错误需要将access_token参数放到url中,否则请求会失败
        //scene为你需要传入得参数类似“id=????&code=222”,为参数名和值组成得字符串。
        // 这些参数微信小程序上官网上有,根据需求添加
        params.put("scene", "type=1");
        params.put("page", "page/index/index");
        params.put("width", 200);
        params.put("auto_color", true);
        params.put("check_path",false);
        params.put("line_color", null);
        params.put("is_hyaline", false);

        byte[] byteArray = null;
        /** 第一种方式:使用RestTemplate。项目采用了这种方式。 **/
        // 调用微信接口
        WxCodeUnlimitedResponseParam res = new WxCodeUnlimitedResponseParam();
        try {
            RestTemplate restTemplate = new RestTemplate();
            String request =WX_CODE_URL.replaceAll("AccessToken",accesstoken1);
            ResponseEntity<byte[]> entity = restTemplate.postForEntity(
                    request,
                    JSONObject.toJSONString(params), byte[].class);
            // 如果你十分确认微信正确返回了图片,那么byteArray已经是你想要的结果了。
            byteArray = entity.getBody();
            // 微信返回内容,byte[]转为string
            String wxReturnStr = new String(byteArray);
            if (wxReturnStr.indexOf("errCode") != -1) {
                JSONObject json = JSONObject.parseObject(wxReturnStr);
                res.setErrCode(json.get("errCode").toString());
                res.setErrMsg(json.get("errMsg").toString());
            } else {
                res.setErrCode("0");
                res.setErrMsg("ok");
                res.setBuffer(byteArray);
            }
        } catch (Exception e) {
            System.out.println("右岸顶针");
            System.out.println("微信小程序码getUnlimited接口调用失败");
        }
        System.out.println(res);
        return  res;
    }
}

3、后端controller类,编写一个接口来调用以上工具类生成二维码并转换成base64的方式传回前端

/**
     * 生辰二维码
     */
    @GetMapping("/getInviteCode")
    @ResponseBody
    public String getInviteCode(HttpServletResponse response) throws IOException {

        String accessToken=qrUtils.getAccessToken();

        WxCodeUnlimitedResponseParam res= WeChatUtil.getUnlimitedCode(accessToken);
//        //以流的方式返回给前端
        InputStream inputStream = new ByteArrayInputStream(res.getBuffer());
        BufferedImage bufferedImage = ImageIO.read(inputStream);
        ByteArrayOutputStream baos = new ByteArrayOutputStream();
        if (bufferedImage != null){
            String format = "jpeg";
            System.out.println(bufferedImage);
            ImageIO.write(bufferedImage, format, baos);
            byte[] imageBytes = baos.toByteArray();
            baos.close();
            return Base64.getEncoder().encodeToString(imageBytes);
        }
        return null;
    }

4、前端用的是vue2+elementUI

<!-- 查看二维码对话框 -->
    <el-dialog :title="title" :visible.sync="open_qr_code" width="700px" append-to-body v-dialogDrag custom-class="center-dialog">
      <el-card shadow="always">
          <el-image :src="QRcodeSrc"></el-image>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleDownloadQrIMg(QRcodeSrc)">点击下载</el-button>
        <el-button type="primary" @click="cancel_detail">关 闭</el-button>
      </div>
    </el-dialog>
 /**
     * 生成二维码
     * */
    createQRCode() {
      this.loading = true;
      createQRcode().then(response => {
        this.QRcodeSrc = "data:image/png;base64," + response;
        this.open_qr_code = true;
        this.loading = false;
      })
    },

    /**
     * 下载图片
     * @returns {string}
     */
    //imageBase64是后台传回来的base64数据
    handleDownloadQrIMg(imageBase64) {
      // 这里是获取到的图片base64编码,这里只是个例子哈,要自行编码图片替换这里才能测试看到效果
      const imgUrl = `${imageBase64}`;
      // 如果浏览器支持msSaveOrOpenBlob方法(也就是使用IE浏览器的时候),那么调用该方法去下载图片
      if (window.navigator.msSaveOrOpenBlob) {
        const bstr = atob(imgUrl.split(',')[1]);
        let n = bstr.length;
        const u8arr = new Uint8Array(n);
        while (n--) {
          u8arr[n] = bstr.charCodeAt(n);
        }
        const blob = new Blob([u8arr]);
        window.navigator.msSaveOrOpenBlob(blob, '签到码.jpg');
      } else {
        // 这里就按照chrome等新版浏览器来处理
        const a = document.createElement('a');
        a.href = imgUrl;
        a.setAttribute('download', 'filename.jpg');
        a.click();
      }
    }

然后就大功告成了!!!!!文章来源地址https://www.toymoban.com/news/detail-842937.html

到了这里,关于Java集成微信小程序生成二维码传回前端,提供下载按钮的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • 微信小程序 — 生成二维码功能

    微信小程序实现生成二维码功能。需要用到canvas组件,设置 type为2d.  需要使用js包 weapp-qrcode-canvas-2d https://github.com/DoctorWei/weapp-qrcode-canvas-2d weapp-qrcode-canvas-2d 是使用新版canvas-2d接口在微信小程序中生成二维码(外部二维码)的js包。canvas 2d 接口支持同层渲染且性能更佳,可大

    2024年02月09日
    浏览(43)
  • 微信小程序之生成二维码

     var context = wx.createCanvasContext(\\\'mycanvas\\\'); // 获取画布 CanvasContext.fillText string text 在画布上输出的文本 number x 绘制文本的左上角 x 坐标位置 number y 绘制文本的左上角 y 坐标位置 number maxWidth 需要绘制的最大宽度,可选 CanvasContext.drawImage string imageResource 所要绘制的图片资源(网络

    2024年02月10日
    浏览(38)
  • 微信小程序实现预约生成二维码

    业务需求 :点击预约按钮即可生成二维码凭码入校参观~ 如下是博主自己写的wxml: 以及wxss: 去Gitee下载工具包: 二维码工具包 http://​ https://gitee.com/WeiDoctor/weapp-qrcode-canvas-2d ​ 下载zip:     将dist文件夹中的js文件全部复制到utils目录下: 如下代码必须完整的导入再页面

    2024年04月15日
    浏览(41)
  • 微信小程序使用--如何生成二维码

    一、生成二维码 1.获取token 参照官方文档说明: https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/mp-access-token/getAccessToken.html 其中grant_type是写死的,appid和secret是注册小程序的时候获取的,然后会得到一个默认两小时失效的token 2.获取二维码 参照官方文档说明: https://developers.

    2024年02月04日
    浏览(40)
  • 微信小程序生成二维码的 方式

    一:生成普通的二维码 https://open.weixin.qq.com/sns/getexpappinfo?appid=xxxpath=xxx?a=123 appid:小程序的appid path: 小程序的路径 a:小程序需要携带的参数,不传可以不写 二:在微信开发文档内生成 步骤1.登录微信公众平台 2.找到工具菜单 3.选择生成小程序码 具体里面的有生成规则,不懂得

    2024年02月12日
    浏览(40)
  • 【小程序】动态生成微信小程序二维码

    官方文档中给我们提供了三个接口,分别应用于不同的场景 wxacode.createQRCode - - 接口文档地址-点击跳转 该接口需慎用,因为文档描述,该接口可生成的二维码是有限制的。 总共生成的码数量限制为 100,000 wxacode.get - - 接口文档地址-点击跳转 该接口需慎用,因为文档描述,该

    2024年02月09日
    浏览(47)
  • 微信小程序生成携带参数的二维码

    当对需求的时候发现 要完成一个永久二维码直接进入微信小程序的对应页面+对应IID参数 不要慌 这篇文章解决 满足生成需要 微信官方提供生成微信二维码 可满足大部分功能 获取不限制的小程序码 | 微信开放文档 可以看到官方文档有3种二维码的样式 我们这里以第一种的小

    2024年02月09日
    浏览(37)
  • 微信小程序生成二维码海报并分享

    背景:点击图标,生成海报后,点击保存相册,可以保存 生成海报:插件wxa-plugin-canvas,此处使用页面异步生成组件方式,官网地址:wxa-plugin-canvas - npm 二维码:调用后端接口生成二维码 需要调用获取图片信息接口wx.getImageInfo(),获取到图片的宽高以做整体宽高配置 closePos

    2024年03月21日
    浏览(38)
  • 生成普通的微信小程序二维码

    1.登录微信小程序后台传送门 开发管理-开发设置-扫普通链接二维码打开小程序   在这里开通此功能,然后按微信定义的规则配置具体的地址,等正式上线的时候再发布该规则  2.然后按照配置的 二维码规则 (上图第三项) 去直接生成普通的二维码(可自行携带参数),然后微信扫一

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

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

    2024年02月11日
    浏览(36)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包