能否制作网站表单发信息至WhatsApp/Telegram？及Bot Token防窃取方案

一、你的Bot Token被窃取的核心原因 #

你当前的代码直接把Bot Token写在前端JavaScript里——不管怎么混淆，只要别人打开浏览器开发者工具，查看网络请求或者页面源码，都能轻松提取到Token。攻击者拿到Token后，就能调用你的Bot所有API权限，包括获取提交的信息，所以换多少次Token都没用，只要前端还暴露Token，问题就会反复出现。

二、无法直接发送到Telegram手机号 #

Telegram没有提供直接通过手机号接收表单信息的API，必须通过Bot来处理消息，但可以通过后端中转的方式彻底隐藏Token。

三、正确做法：用后端中转请求 #

搭建一个简单的后端接口，前端把表单数据发给这个接口，再由后端拿着Bot Token去调用Telegram的sendMessage API。这样Token只存在后端服务器里，前端完全接触不到，从根源上避免被窃取。

示例后端代码（Node.js） #

const express = require('express');
const axios = require('axios');
const app = express();
app.use(express.json());

// Token和聊天ID只存在后端，前端看不到
const TELEGRAM_BOT_TOKEN = '你的Bot Token';
const CHAT_ID = '你的Telegram聊天ID（可通过Bot获取）';

app.post('/send-to-telegram', async (req, res) => {
  try {
    const formData = req.body;
    // 整理表单内容为易读的消息格式
    const message = `新表单提交：\n姓名：${formData.name}\n邮箱：${formData.email}\n留言：${formData.message}`;
    
    await axios.post(
      `https://api.telegram.org/bot${TELEGRAM_BOT_TOKEN}/sendMessage`,
      { chat_id: CHAT_ID, text: message }
    );
    res.status(200).send('消息发送成功');
  } catch (error) {
    console.error(error);
    res.status(500).send('消息发送失败');
  }
});

app.listen(3000, () => {
  console.log('后端服务运行在3000端口');
});

修改后的前端代码 #

前端不再直接调用Telegram API，转而请求你的后端接口：

var o = new XMLHttpRequest();
o.open("POST", "/send-to-telegram"),
o.setRequestHeader("Content-Type", "application/json"),
o.send(JSON.stringify(formdata)); // 需将表单数据转为JSON格式

四、发送到WhatsApp的方法 #

如果要发送到WhatsApp，同样不能在前端暴露敏感信息，必须通过后端中转。可以使用WhatsApp Business API，后端处理前端提交的表单数据后，调用WhatsApp的API发送消息即可。

额外提醒 #

• 所有涉及API密钥、Token的操作，绝对不能放在前端执行，必须交由后端处理。
• 可以给后端接口加简单验证，比如校验请求来源、添加验证码，防止恶意刷请求。

内容的提问来源于stack exchange，提问作者wael