用Workers免服务器部署挪车二维码，可微信通知、拨打电话-缙哥哥

2025年生日福利大放送，感兴趣的小伙伴可以领取一波

今天在吾爱看到一个文章，利用 Cloudflare 的 Wokers，自定义变量 phone 和 wxpusherAppToken、wxpusherUIDs 实现推送到微信，甚至可以拨打电话。后来有很多人不会，bgwu666 大佬又把 Cloudflare Workers 部署教程给一步步写了出来……真是太贴心了。

bgwu666 大佬在教程表示“避免访问者无限制地发送，应该在发送次数/时间上做一个限制”，于是乎我也写一篇文章，顺便把这个限制功能给加上了。

准备工作

获取 WxPusher 相关参数

微信关注公众号进入 WxPusher 后台，直接开始创建新的应用。

单击「应用管理」，「应用信息」，应用名字我选择填写nuoche，联系方式填写手机号，推送内容随便写，这里填写挪车，方便自己知道这个是干啥。

创建好后会显示「appToken」，这玩意只显示一次，自己复制记录保存好，也就是开头提到的「wxpusherAppToken」。如果不小心跳过或者忘记了，单击左侧「appToken」重置一下。

然后进入「用户管理」→「用户列表」，再次用微信扫码关注一下自己创建的「nuoche」应用。

至此，你就可以看到自己微信的UID了，也就是后面挪车通知你的微信。

CloudFlare 部署 Workers

准备好 WxPusher 的 AppToken 和 UIDs 之后，就开始使用 CloudFlare 部署 Workers，这样就可以实现免服务器。

进入 CloudFlare 后台的Workers和Pages页面，创建 Worker（之前有创建过的也重新创建一个新的）。

我这里仍旧取名 nuoche，你要是不喜欢可以随意取，直接部署。

部署好后点击右上角编辑代码。

挪车代码如下：

代码中的 phone（手机号）、wxpusherAppToken、wxpusherUIDs（这两个上面已经让你准备好了）三个参数改成自己的。

addEventListener('fetch', event => {
    event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
    const phone = '18888888888'; // 车主的手机号
    const wxpusherAppToken = 'AT_************************'; // Wxpusher APP Token
    const wxpusherUIDs = ['UID_************************']; // 车主的UIDs

    const htmlContent = `
      <!DOCTYPE html>
      <html lang="zh-CN">
        <head>
          <meta charset="UTF-8">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
          <title>通知车主挪车</title>
          <style>
            * { box-sizing: border-box; margin: 0; padding: 0; }
            body { font-family: Arial, sans-serif; display: flex; align-items: center; justify-content: center; height: 100vh; background: #f0f2f5; color: #333; }
            .container { text-align: center; padding: 20px; width: 100%; max-width: 400px; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); background: #fff; }
            h1 { font-size: 24px; margin-bottom: 20px; color: #007bff; }
            p { margin-bottom: 20px; font-size: 16px; color: #555; }
            button { 
              width: 100%; 
              padding: 15px; 
              margin: 10px 0; 
              font-size: 18px; 
              font-weight: bold; 
              color: #fff; 
              border: none; 
              border-radius: 6px; 
              cursor: pointer; 
              transition: background 0.3s; 
            }
            .notify-btn { background: #28a745; }
            .notify-btn:hover { background: #218838; }
            .call-btn { background: #17a2b8; }
            .call-btn:hover { background: #138496; }
          </style>
        </head>
        <body>
          <div class="container">
            <h1>通知车主挪车</h1>
            <p>如需通知车主，请点击以下按钮</p>
            <button class="notify-btn" onclick="notifyOwner()">通知车主挪车</button>
            <button class="call-btn" onclick="callOwner()">拨打车主电话</button>
          </div>

          <script>
            // 获取或设置最后通知的时间戳
            function getLastNotifyTime() {
              return localStorage.getItem('lastNotifyTime') || 0;
            }

            function setLastNotifyTime(time) {
              localStorage.setItem('lastNotifyTime', time);
            }

            // 检查是否可以发送通知
            function canNotify() {
              const lastNotifyTime = getLastNotifyTime();
              const currentTime = Date.now();
              const fiveMinutesAgo = currentTime - 10 * 60 * 1000;
              return lastNotifyTime < fiveMinutesAgo;
            }

            // 调用 Wxpusher API 来发送挪车通知
            function notifyOwner() {
              if (!canNotify()) {
                alert("请等待10分钟后再次尝试通知。");
                return;
              }

              fetch("https://wxpusher.zjiecode.com/api/send/message", {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: JSON.stringify({
                  appToken: "${wxpusherAppToken}",
                  content: "您好，有人需要您挪车，请及时处理。",
                  contentType: 1,
                  uids: ${JSON.stringify(wxpusherUIDs)}
                })
              })
              .then(response => response.json())
              .then(data => {
                if (data.code === 1000) {
                  alert("通知已发送！");
                  setLastNotifyTime(Date.now());
                } else {
                  alert("通知发送失败，请稍后重试。");
                }
              })
              .catch(error => {
                console.error("Error sending notification:", error);
                alert("通知发送出错，请检查网络连接。");
              });
            }

            // 拨打车主电话
            function callOwner() {
              window.location.href = "tel:${phone}";
            }
          </script>
        </body>
      </html>
    `

    return new Response(htmlContent, {
      headers: { 'Content-Type': 'text/html;charset=UTF-8' },
    })
}

我记得 12123 和 114 挪车都是10分钟才能催一下，所以这里缙哥哥加了一个限制，就是单个设备10分钟以上才能通知一次，可以根据自己的需求进行更改。

这种方法利用了浏览器的 localStorage 存储机制，确保每个设备遵守10分钟的通知限制。不过需要注意的是，这种方法依赖于客户端的行为，如果用户清除浏览器数据或者更换设备，限制可能会被绕过。对于更严格的要求，可能需要在服务器端实现类似的逻辑，但是我懒得去折腾了，就这样吧。

右侧预览刷新已测试成功，手机已经收到通知了，点击部署保存即可。