bgwu666大佬在《利用Cloudflare Workers部署挪车页面》文末提出“避免访问者无限制地发送，应该在发送次数/时间上做一个限制。”这里我就加一个时间限制，一般12123和114挪车都是10分钟可以催一下，所以这里我也设置10分钟，小伙伴们可以根据自己的喜好修改。
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' },
})
}
这种方法利用了浏览器的 localStorage 存储机制，确保每个设备遵守10分钟的通知限制。不过需要注意的是，这种方法依赖于客户端的行为，如果用户清除浏览器数据或者更换设备，限制可能会被绕过。对于更严格的要求，可能需要在服务器端实现类似的逻辑，但是我懒得去折腾了，就这样吧。我想大部分人还是不会去这样折腾研究去破解这个的…… | 
[复制链接]
|
发表于 2024-11-16 09:58
|楼主
发表于 2024-11-15 09:09
收藏
淘帖
有用
分享到朋友圈
