js创建 二维码， 生成二维码。

<script src="/js/qrious.js"></script>

<canvas style="width: 300px; height: 300px;" id="canvas"></canvas>


<script>
    window.onload = function () {
        var canvas = document.getElementById('canvas');
        canvas.width = 300; // 设置canvas宽度为300像素
        canvas.height = 300; // 设置canvas高度为300像素
        var ctx = canvas.getContext('2d');
        // 绘制白色背景
        ctx.fillStyle = '#ffffff'; // 设置填充颜色为白色
        ctx.fillRect(0, 0, canvas.width, canvas.height); // 填充整个canvas区域为白色


        function generateQRCodeWithImage(url, imageUrl) {
            // 绘制二维码
            var qrCode = new QRious({
                value: url,
                size: 250,
                level: 'H'
            });
            var qrImage = new Image();
            qrImage.src = qrCode.toDataURL();
            qrImage.onload = function () {
                var centerX = (canvas.width - qrImage.width) / 2;
                var centerY = (canvas.height - qrImage.height) / 2;
                ctx.drawImage(qrImage, centerX, centerY);

                // 加载图片并放到二维码中间（大小设置为 60x60）
                var img = new Image();
                img.onload = function () {
                    var size = 60;
                    var centerX = (canvas.width - size) / 2;
                    var centerY = (canvas.height - size) / 2;
                    ctx.drawImage(img, centerX, centerY, size, size);
                };
                img.src = imageUrl;
            };
        }

        // 调用方法生成包含二维码和图片的内容
        generateQRCodeWithImage('http://localhost/wap/index', 'http://ww.baid.ocom/files/images/20240107/170457507941144.rar');
    };
</script>

js 文件下载 

qrious.zip