云商网站建设网站咨询弹窗是怎么做的

1、搜索  BotFather ，输入命令 /newbot   创建机器人。

2、修改机器人信息 /mybots

编辑名称 :  修改机器人名称
编辑关于:    修改关于 hayden yyds，修改以后打开机器人会出现在下图
编辑描述 :  机器人的描述
编辑描述图片 : 机器人的图片
编辑 Botpic :    点击以后发送图片，修改机器人的头像
编辑命令 :  编辑命令以后机器人对话框旁边会出现菜单，点击菜单可以出现我们编辑d

创建小程序：发送 /newapp  命令,选择关联小程序的机器人。  然后按照提示输入标题和描述。

    完成以后会要我们 ：现在上传演示 GIF 或发送/empty 以跳过此步骤。
我们跳过以后会让我们输入小程序外部链接的https的url。

完成以后：很好！现在请为您的 Web 应用选择一个简称：3-30 个字符，a-zA-Z0-9_。此简称将用于 t.me/TetrisHayDenBot/myapp 等 URL，并作为您的 Web 应用的唯一标识符。

完成以后返回给我们小程序的访问链接地址

将我们机器人菜单改为自定义按钮。

输入命令： /mybots  ，点击 Menu Button

后续。。。。。。

到此我们完成了TG小程序配置 


使用TG小程序交互我们web平台，进行登录操作

Telegram Web Apps在启动时会提供一个initData和hash参数，用于验证数据的完整性和来源。你可以使用这些参数来确保数据没有被篡改。

当我们获取到了initData以后可以做一个hash验签：

package com.app.web;
import org.apache.commons.codec.binary.Hex;
import org.springframework.boot.SpringApplication;import lombok.extern.slf4j.Slf4j;
import org.apache.commons.codec.digest.DigestUtils;
import org.apache.commons.codec.digest.HmacAlgorithms;
import org.apache.commons.codec.digest.HmacUtils;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.scheduling.annotation.EnableScheduling;import javax.crypto.Mac;
import javax.crypto.spec.SecretKeySpec;
import java.io.UnsupportedEncodingException;
import java.net.URLDecoder;
import java.nio.charset.StandardCharsets;
import java.util.Arrays;
import java.util.Map;
import java.util.stream.Collectors;@Slf4j
@EnableScheduling
@SpringBootApplication
public class PeipeiApplication {public static void main(String[] args) {// initData和botTokenString initData = "user=%7B%22id%22%3A5000109645%2C%22first_name%22%3A%22John%22%2C%22last_name%22%3A%22Zeng%22%2C%22language_code%22%3A%22zh-hans%22%2C%22allows_write_to_pm%22%3Atrue%7D&chat_instance=-1844952925335620055&chat_type=private&auth_date=1720850073&hash=79b805a0d61c577211e63fa8f2df178c87eff97ce162218fffc84faa2f84e900";//这个botToken就是我们创建机器人的token，创建的机器人和TG小程序绑定的String botToken = "5000906011:AAFqS3Ygb9eKYHJ8jJ_ply_3awwC79DrbeY";// 提取hash并解码其余的键值对Map<String, String> params = Arrays.stream(initData.split("&")).map(param -> param.split("=", 2)).collect(Collectors.toMap(arr -> arr[0],arr -> {try {return URLDecoder.decode(arr[1], StandardCharsets.UTF_8.name());} catch (UnsupportedEncodingException e) {throw new RuntimeException(e);}}));// 提取并移除hashString hash = params.remove("hash");// 按键名排序其余的键值对String dataCheckString = params.entrySet().stream().sorted(Map.Entry.comparingByKey()).map(entry -> entry.getKey() + "=" + entry.getValue()).collect(Collectors.joining("\n"));// 生成密钥byte[] secretKey = hmacSha256("WebAppData", botToken);// 生成HMAC-SHA256签名String computedHash = hmacSha256Hex(secretKey, dataCheckString);// 验证hashif (computedHash.equals(hash)) {System.out.println("Data is valid");} else {System.out.println("Data is invalid");}}private static byte[] hmacSha256(String key, String data) {try {Mac mac = Mac.getInstance("HmacSHA256");SecretKeySpec secretKeySpec = new SecretKeySpec(key.getBytes(StandardCharsets.UTF_8), "HmacSHA256");mac.init(secretKeySpec);return mac.doFinal(data.getBytes(StandardCharsets.UTF_8));} catch (Exception e) {throw new RuntimeException("Failed to calculate hmac-sha256", e);}}private static String hmacSha256Hex(byte[] key, String data) {try {Mac mac = Mac.getInstance("HmacSHA256");SecretKeySpec secretKeySpec = new SecretKeySpec(key, "HmacSHA256");mac.init(secretKeySpec);byte[] hashBytes = mac.doFinal(data.getBytes(StandardCharsets.UTF_8));return Hex.encodeHexString(hashBytes);} catch (Exception e) {throw new RuntimeException("Failed to calculate hmac-sha256 hex", e);}}
}