zoukankan      html  css  js  c++  java
  • 微信端canvas对象转换为img对象长按扫描

    微信端有时候后台传入一段链接需要生成二维码展示给用户,而不是一段长链接。现在的人宁愿扫二维码也不愿意点击陌生的链接。

    当后台传入连接时需要使用jquery-qrcode生成canvas二维码

    官网参考:https://github.com/jeromeetienne/jquery-qrcode

    用法:

    <div id="scanPayImg"></div>

    $("#scanPayImg").qrcode({
      render: "canvas", //canvas方式
       160, //宽度
      height:160, //高度
      text: ret.payRedirect //任意内容 //一般是某个网址或者某个链接
    });

    这里有个问题了,在微信端canvas是无法长按扫描的,因为不是个img文件。。。所以还要把canvas转换成img

    //从 canvas 提取图片 image
    function convertCanvasToImage(canvas) {
      //新Image对象,可以理解为DOM
      var image = new Image();
      // canvas.toDataURL 返回的是一串Base64编码的URL,当然,浏览器自己肯定支持
      // 指定格式 PNG
      image.src = canvas.toDataURL("image/png");
      return image;
    }

    var mycanvas1=document.getElementsByTagName('canvas')[0]; //获取网页中的canvas对象 
    //将转换后的img标签插入到html中
    var img=convertCanvasToImage(mycanvas1);
    $('#scanPayImg').html("");//移除已生成的避免重复生成
    $('#scanPayImg').append(img);//imagQrDiv表示你要插入的容器id

  • 相关阅读:
    失眠食療
    学会妥协学会弯腰(下册)
    软件工程(第4版·修订版)
    GitHub入门与实践
    iOS开发:从零基础到精通
    Premiere Pro CS6高手成长之路
    网页设计与前端开发从入门到精通Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript
    CINEMA 4D R17 完全学习手册(第2版)
    1040. 二叉树层次遍历
    1041. 二哥打飞机
  • 原文地址:https://www.cnblogs.com/baifubin/p/6873324.html
Copyright © 2011-2022 走看看