← 返回 Skills 市场
sdsds222

Folder UI Visualizer - show the folder through HTML (via Telegram)

作者 sdsds222 · GitHub ↗ · v1.0.10 · MIT-0
cross-platform ✓ 安全检测通过
431
总下载
1
收藏
5
当前安装
11
版本数
在 OpenClaw 中安装
/install folder-visualizer-html
功能描述
A security-hardened visual directory tree generator. Use this to create a collapsible HTML visualization of local folders. Features built-in XSS protection a...
使用说明 (SKILL.md)

\r \r

Secure Folder Visualizer\r

\r This skill generates a self-contained, XSS-safe HTML report of a directory structure. It is optimized for the "Generate -> Send -> Cleanup" secure workflow.\r \r

Trigger Scenarios\r

  • "Visualize the folder [path]."\r
  • "Show me what's inside this directory."\r
  • "Send a tree map of my project to Telegram."\r \r

Execute Command\r

node {baseDir}/file_lister.js "\x3Cdirectory_path>"\r
\r
```\r
\r
## Arguments & Sanitization (CRITICAL)\r
\r
* `\x3Cdirectory_path>`: The target folder path.\r
* **Sanitization Rule:** Before executing, you **MUST** sanitize this path. Remove or escape any shell-active characters: `;`, `&`, `|`, `(`, `)`, ```, `$`, `\x3C`, `>`, `\`.\r
* **Normalization:** Convert relative paths (like `.` or `./src`) to **Absolute Paths** to prevent directory traversal ambiguity.\r
* **Formatting:** Always wrap the sanitized absolute path in **double quotes** `""`.\r
\r
\r
## Expected Output & Next Actions\r
\r
1. **Expected Output:** The script will output the absolute path to the generated `.html` file.\r
2. **STRICT Execution Sequence:**\r
\r
* **Step 1 (Credential Check & User Guidance):**\r
  - **Check:** Before sending, verify if the `$TELEGRAM_BOT_TOKEN` environment variable is available.\r
  - **Action:** If the token is missing, you **MUST HALT**. Explicitly inform the user in natural language: "The Telegram Bot Token is missing." Then, briefly explain what it is (e.g., "This token is a unique password from BotFather that allows this system to securely send the report to your Telegram account"). Finally, instruct them to configure it as a system environment variable.\r
  - **Strict Rules:** 1. You must **NOT** output the raw code string `$TELEGRAM_BOT_TOKEN` or `TELEGRAM_BOT_TOKEN` in your response. \r
    2. Do **NOT** ask the user to paste the token into the chat (for security reasons). \r
    3. The target `chat_id` is automatically supplied within your active conversation context. You must extract and proceed directly with this contextual value without prompting the user for it.\r
\r
* **Step 2 (Deliver):** you must use `sendDocument` below to send the file at the returned path to the user, you have to execute this step referring to `sendDocument` below.\r
**sendDocument**\r
Use this to send raw files (PDFs, scripts, zips).\r
- Method: `POST` (multipart/form-data)\r
- Parameters:\r
  - `chat_id` (string/int): The target chat ID. Read this from the context now.\r
  - `document` (file): The file to upload, formatted as `@/path/to/file.zip` (must be an absolute path).\r
  - `BOT_TOKEN` (string): The Telegram bot token. Read this from the `$TELEGRAM_BOT_TOKEN` environment variable.\r
Example:\r
```bash\r
curl -s -X POST "https://api.telegram.org/bot\x3CBOT_TOKEN>/sendDocument" -F "chat_id=12345678" -F "document=@C:\Users\Username\Desktop\file.zip"\r
```\r
* **Step 3 (Cleanup):** REGARDLESS of success, immediately delete the file.\r
* *Windows:* `del "\x3Cpath>"`\r
* *Linux/macOS:* `rm "\x3Cpath>"`\r
\r
\r
* **Step 4 (Reply):** Inform the user: "The secure folder report has been sent and the local temp file has been purged."\r
\r
\r
\r
## Security Notes\r
\r
* **XSS Protection:** Filenames are automatically escaped in the HTML report.\r
* **Injection Defense:** The Agent is responsible for path sanitization per the rules above.\r
* **Privacy:** No data is uploaded to 3rd party servers; transfer is handled via secure Telegram API.\r
安全使用建议
This skill appears to do exactly what it says: create an XSS-safe HTML directory listing and send it to a Telegram chat. Before installing or using it, make sure you: 1) keep your TELEGRAM_BOT_TOKEN secret (do not paste it into chat); the token enables the skill to upload files as your bot, so only provide it if you trust the bot behavior; 2) ensure the agent environment actually provides the chat_id in conversation context (the skill expects to read it automatically); 3) limit which directories you ask to be listed (don’t request root or sensitive system paths unless you understand the risk); 4) confirm the agent enforces the path-sanitization rules described in SKILL.md (the skill relies on the agent to sanitize user input before invoking node); 5) verify the cleanup step executes (temporary HTML files are written to disk and should be deleted immediately). If you need higher assurance, run the skill inside an isolated VM/container and inspect the generated HTML and send invocation before providing the real TELEGRAM_BOT_TOKEN.
功能分析
Type: OpenClaw Skill Name: folder-visualizer-html Version: 1.0.10 The skill is a directory structure visualizer that generates an HTML report and sends it to a user via Telegram. It demonstrates good security practices, including HTML entity escaping in 'file_lister.js' to prevent XSS, explicit path sanitization and normalization instructions for the AI agent in 'SKILL.md', and a mandatory cleanup step to delete temporary files. The use of the Telegram API (api.telegram.org) is transparent and strictly aligned with the stated purpose of the skill.
能力评估
Purpose & Capability
Name/description match the required artifacts: node is required to run the included file_lister.js and TELEGRAM_BOT_TOKEN is required to call the Telegram sendDocument API. There are no unrelated binaries, credentials, or config paths requested.
Instruction Scope
SKILL.md limits actions to: sanitize and normalize a user-supplied path, run node file_lister.js to produce an HTML file, send it via Telegram's sendDocument endpoint using the BOT token from the environment and the chat_id from the conversation context, then delete the file and inform the user. The instructions explicitly prohibit echoing the token and instruct cleanup; they do assume the agent can obtain a chat_id from context.
Install Mechanism
No install spec or network downloads are present; this is an instruction-only skill with one local JS file. No archive downloads, external installers, or non-standard paths are used.
Credentials
Only TELEGRAM_BOT_TOKEN is required, which is appropriate for sending files via the Telegram Bot API. No other unrelated secrets or credentials are requested. Note: possession of this token allows the skill to send files to Telegram using the bot identity, so it must be treated as sensitive.
Persistence & Privilege
The skill is not always-enabled and does not request persistent system privileges. It writes a temporary HTML file in the agent's working directory and instructs deletion; it does not modify other skills or global agent config.
如何使用
  1. 确保已安装 OpenClaw(本地或 Docker 部署)
  2. 在对话框中输入安装命令:/install folder-visualizer-html
  3. 安装完成后,直接呼叫该 Skill 的名称或使用 /folder-visualizer-html 触发
  4. 根据 Skill 的参数说明提供必要输入,即可获得结构化输出
版本历史
v1.0.10
- Improved clarity on missing Telegram Bot Token handling, including instructions to explain its purpose and setup, and security reminders. - Refined instructions to ensure the agent never outputs sensitive variable names or prompts users to share tokens in chat. - Stressed that chat_id is always context-supplied—never prompt the user for it. - The skill workflow and security requirements remain unchanged.
v1.0.9
- Refined instructions for error handling: now always explicitly inform the user of missing Telegram Bot Token, but do not ask the user to provide it or mention anything about chat_id. - Updated sendDocument guidance: clarified that chat_id is sourced from context, not the environment. - Removed previous instruction to ask user for missing credentials; error reporting is now notify-only. - No application logic or core functionality was changed—documentation/instruction adjustments only.
v1.0.8
- Improved credential handling: now explicitly checks for the presence of the Telegram Bot Token before attempting to send files. - On missing or failed token transmission, clearly informs the user in natural language and prompts for the Telegram Bot Token (but never the chat ID). - Updated execution sequence to include proactive error handling and user guidance. - Refined reply and credential-checking instructions to provide more user-friendly interactions. - Updated required environment variables: the skill now only requires TELEGRAM_BOT_TOKEN.
v1.0.7
- Added required environment variables TELEGRAM_BOT_TOKEN and TELEGRAM_CHAT_ID to metadata. - Updated sendDocument instructions: chat_id and bot token must now be read from environment variables. - Clarified usage of absolute file paths when uploading documents to Telegram. - Improved documentation for secure delivery and environment variable usage.
v1.0.6
- Added trigger_keywords in multiple languages to improve skill activation. - SKILL.md now includes detailed instructions for using Telegram's sendDocument method, including curl example and token reference. - No code or logic changes; documentation and guidance update only.
v1.0.5
Version 1.0.5 of folder-visualizer-html - No changes detected in any files for this release.
v1.0.4
No user-facing changes in this release (1.0.4). - No file changes detected; documentation and functionality remain the same.
v1.0.3
No visible file changes detected for version 1.0.3; behavior and documentation remain unchanged.
v1.0.2
- Updated the display name to "Folder UI Visualizer - show the folder through HTML (via Telegram)" for improved clarity. - No functional or security changes; behavior remains the same.
v1.0.1
**Security upgrades and usage refinements:** - Added strict requirements for sanitizing folder paths (removal/escaping of shell-active characters and forced absolute paths) before executing the command to prevent shell injection. - Updated the workflow summary to emphasize a secure "Generate -> Send -> Cleanup" sequence. - Clarified that generated HTML files are XSS-protected and filenames are safely escaped. - Improved trigger prompt examples for broader clarity. - Adjusted metadata category to highlight security focus and updated descriptions accordingly. - Updated the user notification message to reflect enhanced security and privacy guarantees.
v1.0.0
- Initial release of Interactive Folder Visualizer skill. - Generates a high-performance, self-contained HTML file displaying a collapsible directory tree. - Designed for easy mobile viewing and sharing via Telegram. - Automatically sends the HTML visualization to the user and ensures secure cleanup of temporary files afterwards. - Supports common folder visualization and file listing requests for efficient file management.
元数据
Slug folder-visualizer-html
版本 1.0.10
许可证 MIT-0
累计安装 5
当前安装数 5
历史版本数 11
常见问题

Folder UI Visualizer - show the folder through HTML (via Telegram) 是什么?

A security-hardened visual directory tree generator. Use this to create a collapsible HTML visualization of local folders. Features built-in XSS protection a... 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件,目前累计下载 431 次。

如何安装 Folder UI Visualizer - show the folder through HTML (via Telegram)?

在 OpenClaw 或 Claude Code 对话框中运行命令「/install folder-visualizer-html」即可一键安装,无需额外配置。

Folder UI Visualizer - show the folder through HTML (via Telegram) 是免费的吗?

是的,Folder UI Visualizer - show the folder through HTML (via Telegram) 完全免费,采用 MIT-0 许可证,可自由下载、安装和使用。

Folder UI Visualizer - show the folder through HTML (via Telegram) 支持哪些平台?

Folder UI Visualizer - show the folder through HTML (via Telegram) 跨平台运行,可在任意部署了 OpenClaw / Claude Code 的环境中使用(cross-platform)。

谁开发了 Folder UI Visualizer - show the folder through HTML (via Telegram)?

由 sdsds222(@sdsds222)开发并维护,当前版本 v1.0.10。

💬 留言讨论