Refactor upload function and improve file handling

[cf-pages]

Solve issue: #178 #180 #182

Use tg channel/chat for storage

How to use?

First, you need to create a new telegram bot to obtain the token and a telegram channel to obtain Chat_ID

How to Obtain Bot_Token and Chat_ID for Telegram

If you don't have a Telegram account yet, please create one first. Then, follow these steps to get the Bot_Token and Chat_ID:

1. Get the Bot_Token

   • In Telegram, send the command /newbot to @BotFather, and follow the prompts to input your bot's name and username. Once successfully created, you will receive a Bot_Token, which is used to interact with the Telegram API.

2. Set the bot as a channel administrator

   • Create a new channel and, after entering the channel, go to channel settings. Add the bot you just created as a channel administrator, so it can send messages.

3. Get the Chat_ID

   • Use @GetTheirIDBot to get your channel ID. Send a message to this bot and follow the instructions to receive your Chat_ID (the ID of your channel).

---

Important

由于原有的Telegraph API接口被官方关闭，需要将上传渠道切换至Telegram Channel，请按照文档中的部署要求设置TG_Bot_Token和TG_Chat_ID，否则将无法正常使用上传功能。

如何获取Telegram的Bot_Token和Chat_ID

如果您还没有Telegram账户，请先创建一个。接着，按照以下步骤操作以获取BOT_TOKEN和CHAT_ID：

1. 获取Bot_Token
   • 在Telegram中，向@BotFather发送命令/newbot，根据提示依次输入您的机器人名称和用户名。成功创建机器人后，您将会收到一个BOT_TOKEN，用于与Telegram API进行交互。

2. 设置机器人为频道管理员
   • 创建一个新的频道（Channel），进入该频道后，选择频道设置。将刚刚创建的机器人添加为频道管理员，这样机器人才能发送消息。

3. 获取Chat_ID

   • 通过@VersaToolsBot获取您的频道ID。向该机器人发送消息，按照指示操作，最后您将得到CHAT_ID（即频道的ID）。
   • 或者通过@GetTheirIDBot获取您的频道ID。向该机器人发送消息，按照指示操作，最后您将得到CHAT_ID（即频道的ID）。

   

最后去Cloudflare Pages后台设置相关的环境变量（注：修改环境变量后，需要重新部署才能生效）

环境变量	示例值	说明
TG_Bot_Token	123468:AAxxxGKrn5	从@BotFather获取的Telegram Bot Token。
TG_Chat_ID	-1234567	频道的ID，确保TG Bot是该频道或群组的管理员。

本地运行命令，需先按照Cloudflare官方文档安装wrangler

npx wrangler pages dev ./ --kv "img_url" --port 8080 --binding BASIC_USER=admin --binding BASIC_PASS=123 --binding TG_Chat_ID=[Your Chat ID] --binding TG_Bot_Token=[Your Telegram Bot token] --persist-to ./data

Reference:
@x-dr/telegraph-Image
@MarSeventh/CloudFlare-ImgBed

[cloudflare-workers-and-pages]

Deploying tpic with    Cloudflare Pages

Latest commit:	e1492d5
Status:	✅  Deploy successful!
Preview URL:	https://1235d890.tpic.pages.dev
Branch Preview URL:	https://feature-telegram-bot-api.tpic.pages.dev

View logs

[huaji1hao]

I tried, it workds. Thank u a lot!!!

[8bytes-code]

ok，拉取这个分支重新部署能用了！感谢作者！

[huaji1hao]

不好意思，可能不小心点错了，我已经部署好了，感谢大佬😂 获取Outlook for Android<https://aka.ms/AAb9ysg>

…

________________________________ From: 8bytes ***@***.***> Sent: Monday, September 9, 2024 6:39:41 PM To: cf-pages/Telegraph-Image ***@***.***> Cc: 滑稽1号 ***@***.***>; Comment ***@***.***> Subject: Re: [cf-pages/Telegraph-Image] Refactor upload function and improve file handling (PR #183) 您好，所以现在是要拉取这个分支重新部署吗？ — Reply to this email directly, view it on GitHub<#183 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AYGVXR2XQE4WW2UGMD7RSOLZVV3G3AVCNFSM6AAAAABN22DWR2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGMZXG43DCOJZHE>. You are receiving this because you commented.Message ID: ***@***.***>

[yasirarism]

Still buggy for upload video, it will changed to images mimetype

[Copilot]

Copilot reviewed 2 out of 5 changed files in this pull request and generated 1 suggestion.

Files not reviewed (3)

• admin-imgtc.html: Language not supported
• admin.html: Language not supported
• package.json: Language not supported

Comments skipped due to low confidence (5)

functions/file/[id].js:24

• Remove the console.log statement or replace it with proper logging.

console.log(url.pathname.split(".")[0].split("/")[2])

functions/file/[id].js:25

• Add a null check for 'filePath' before using it to construct the URL.

const filePath = await getFilePath(env, url.pathname.split(".")[0].split("/")[2]);

functions/upload.js:17

• [nitpick] The error message 'No file uploaded' could be more descriptive. Consider including the expected form field name in the error message.

return new Response('No file uploaded', { status: 400 });

functions/upload.js:49

• The response object is being checked directly for the 'ok' property. Ensure that the response structure is validated correctly before accessing properties.

if (!response.ok) {

functions/upload.js:55

• The file_name and file_unique_id properties are being accessed without ensuring they exist in the response. This could lead to potential issues if the response structure changes or if these properties are missing.

file_name: file.file_name || file.file_unique_id

[Copilot]

The fileExtension extraction logic assumes that the file name will always have an extension. Handle scenarios where the file name does not have an extension to avoid potential errors.

Suggested change

	const fileExtension = fileName.split('.').pop().toLowerCase();
	const fileExtension = fileName.includes('.') ? fileName.split('.').pop().toLowerCase() : '';

Copilot reviewed 2 out of 5 changed files in this pull request and generated no suggestions.

Files not reviewed (3)

• admin-imgtc.html: Language not supported
• admin.html: Language not supported
• package.json: Language not supported

Comments skipped due to low confidence (1)

functions/upload.js:81

• Add a check for an empty array in response.result and return null if it is empty.

if (!response.ok || !response.result) return null;