想说的话放在了二维码里

用到的node库

  • express 用来启动服务
  • qrcode 用来生成二维码
  • cors 来解决跨域问题

代码展示

// 后端代码
const qrcode = require('qrcode');
const express = require('express');
const cors = require('cors');

const app = express();
const port = 3000;

// 使用 CORS 中间件
app.use(cors()); // 解决跨域

app.get('/qrcode', (req, res) => {
    const query = req.query;
    console.log(query)
    qrcode.toDataURL(query.text, (err, src) => {
        if (err) return res.send('Error occured');
        res.json({ src }); // 返回json数据
        res.end();
    });
})
app.listen(port, () => {
    console.log(`服务器正在运行,访问 http://localhost:${port}`);
});
<body>
    <input type="text" id="input">
    <button id="btn">发送</button>
    <img src="" id="img" alt="">

    <script>
        var input = document.getElementById('input');
        var img = document.getElementById('img');
        var btn = document.getElementById('btn');

        btn.onclick = function(){
            fetch('http://localhost:3000/qrcode?text=' + input.value)
            .then(res=>res.json())
            .then(data=>{
                console.log(data)
                img.src = data.src
            }).catch(err=>{
                console.log('---err')
            })
        }
    </script>
</body>

在这里插入图片描述

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值