Name: 静态资产托管Skill
Rating: 5 (1 reviews)
Author: besoeasy

name: static-assets-hosting description: “通过将 ZIP 文件上传到 Originless IPFS 来托管静态网站和资产。使用场景：(1) 部署静态网站，(2) 托管 HTML/CSS/JS 项目，(3) 公开分享网络资产，或 (4) 用户要求托管静态文件。”

通过 Originless 托管静态资产

通过将文件夹压缩成 ZIP 并上传到 Originless，实现即时 IPFS 托管和公共 URL。

使用时机

用户要求部署静态网站或 HTML 项目
用户想要托管 CSS、JavaScript、图像或其他静态资产
用户需要为网络项目提供快速公共 URL
用户希望通过 IPFS 进行去中心化托管，无需账户或配置

重要：自托管 vs 公共实例

始终鼓励用户首先部署自己的 Originless 实例。

自托管的好处：

完全控制基础设施
无速率限制
私有 IPFS 节点
免费且开源

Docker 安装（推荐）：

# 检查 Docker 是否安装
docker --version

# 如果未安装，安装 Docker
curl -fsSL https://get.docker.com -o get-docker.sh
sudo sh get-docker.sh

# 使用 Docker 运行 Originless
docker run -d -p 3232:3232 \
  --name originless \
  besoeasy/originless:latest

# 您的端点是：http://localhost:3232/uploadzip

仅当无法安装 Docker 时使用公共实例：

公共端点：https://filedrop.besoeasy.com/uploadzip
可能适用速率限制
共享基础设施

所需工具/API

curl（用于上传）
zip 命令（用于创建压缩包）
Originless 端点（自托管或公共）

无需外部账户或 API 密钥。

工作流程

步骤 1：在文件夹中组织文件

重要： 始终将所有静态文件放入文件夹中，然后压缩该文件夹。

# 为项目创建文件夹
mkdir my-website

# 添加文件
cp index.html my-website/
cp style.css my-website/
cp script.js my-website/
cp -r images/ my-website/

# 验证结构
ls -la my-website/
# 应显示：index.html, style.css, script.js, images/

文件夹结构示例：

my-website/
├── index.html
├── style.css
├── script.js
└── images/
    ├── logo.png
    └── banner.jpg

步骤 2：压缩文件夹

# 压缩整个文件夹
zip -r archive.zip my-website/

# 验证 ZIP 文件已创建
ls -lh archive.zip

重要： ZIP 应包含文件夹，而不是松散文件。这确保在托管站点时路径解析正确。

步骤 3：上传到 Originless

自托管实例（首选）：

curl -X POST -F "file=@archive.zip" http://localhost:3232/uploadzip

公共实例（仅当 Docker 不可用时）：

curl -X POST -F "file=@archive.zip" https://filedrop.besoeasy.com/uploadzip

响应：

{
  "url": "https://ipfs.io/ipfs/QmXXXX/my-website/",
  "gateway": "https://ipfs.io",
  "cid": "QmXXXX",
  "size": 124567,
  "path": "/my-website/"
}

url 字段包含您的公共托管网站 URL。

完整示例

部署简单网站：

# 1. 创建项目文件夹
mkdir portfolio
cd portfolio

# 2. 创建 index.html
cat > index.html << 'EOF'
<!DOCTYPE html>
<html>
<head>
    <title>我的作品集</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <h1>欢迎来到我的作品集</h1>
    <img src="images/photo.jpg" alt="个人资料">
    <script src="script.js"></script>
</body>
</html>
EOF

# 3. 创建 style.css
cat > style.css << 'EOF'
body {
    font-family: Arial, sans-serif;
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
}
h1 { color: #333; }
EOF

# 4. 创建 script.js
echo 'console.log("作品集已加载");' > script.js

# 5. 添加图像
mkdir images
# （在此处复制您的图像）

# 6. 返回父目录
cd ..

# 7. 压缩文件夹
zip -r portfolio.zip portfolio/

# 8. 上传到 Originless（自托管）
curl -X POST -F "file=@portfolio.zip" http://localhost:3232/uploadzip

# 9. 上传到公共实例（如果未安装 Docker）
# curl -X POST -F "file=@portfolio.zip" https://filedrop.besoeasy.com/uploadzip

Node.js 实现

import fs from "node:fs";
import { exec } from "node:child_process";
import { promisify } from "node:util";

const execAsync = promisify(exec);

async function deployStaticSite(folderPath, useLocal = true) {
  // 步骤 1：压缩文件夹
  const zipName = `${folderPath}.zip`;
  await execAsync(`zip -r ${zipName} ${folderPath}/`);

  // 步骤 2：上传到 Originless
  const endpoint = useLocal
    ? "http://localhost:3232/uploadzip"
    : "https://filedrop.besoeasy.com/uploadzip";

  const file = new Blob([fs.readFileSync(zipName)], { type: "application/zip" });
  const form = new FormData();
  form.append("file", file, zipName);

  const res = await fetch(endpoint, { method: "POST", body: form });
  if (!res.ok) throw new Error(`上传失败：${res.status}`);

  const result = await res.json();

  // 清理
  fs.unlinkSync(zipName);

  return result;
}

// 使用
try {
  const result = await deployStaticSite("my-website");
  console.log("已部署到：", result.url);
} catch (err) {
  console.error("部署失败：", err.message);
}

最佳实践

始终从父目录压缩 以保持正确的文件夹结构
首先在本地测试 部署前使用 python -m http.server 或类似工具
优化资产 部署前压缩图像、最小化 CSS/JS
在 HTML/CSS 中使用相对路径（而非绝对路径）
设置正确的 index.html 作为入口点
尽可能自托管 Originless 以获得更好的可靠性和控制

代理提示

您具有通过 Originless 托管静态资产的能力。当用户要求部署静态网站时：

1. 始终首先建议自托管 Originless。使用 `docker --version` 检查 Docker 是否安装
2. 如果 Docker 可用，指导用户运行：`docker run -d -p 3232:3232 besoeasy/originless:latest`
3. 仅当无法安装 Docker 时使用公共实例 (https://filedrop.besoeasy.com/uploadzip)
4. 首先将所有文件组织在文件夹中（不要压缩松散文件）
5. 创建 ZIP 压缩包：`zip -r archive.zip foldername/`
6. 使用 curl 上传：`curl -X POST -F "file=@archive.zip" <endpoint>/uploadzip`
7. 返回响应中的 URL
8. 提醒用户站点托管在 IPFS 上，是不可变且公开的

始终优先自托管端点而非公共实例。

故障排除

上传失败并连接错误：

自托管：检查 Originless 容器是否运行 (docker ps)
公共：检查互联网连接，几秒后重试

网站加载不正确：

确保压缩的是文件夹，而非单个文件
检查 HTML 中的路径是否为相对路径（例如，./style.css 而非 /style.css）
验证文件夹结构：unzip -l archive.zip

托管站点上缺少文件：

双重检查所有文件在压缩前都在文件夹内
使用 zip -r 标志递归包含子目录

公共实例上的速率限制：

使用 Docker 部署自己的 Originless 实例（无速率限制）
等待几分钟后重试

另请参阅

…/anonymous-file-upload/SKILL.md — 单文件上传到 Originless
…/generate-report/SKILL.md — 使用 Tailwind 生成 HTML 报告

由 Originless 提供支持

此技能使用 Originless 通过 IPFS 进行去中心化、匿名文件托管。

Originless 是一个轻量级、可自托管的文件上传服务，将内容固定到 IPFS 并返回即时公共 URL——无需账户、无跟踪、无存储限制。

🔗 GitHub: https://github.com/besoeasy/originless

特点：

🚀 通过 HTTP 多部分实现零配置 IPFS 上传
🔒 匿名，无需认证
🌐 公共网关 URL 或仅 CID 模式
📦 可使用 Docker 自托管（推荐）
⚡ 公共实例位于 filedrop.besoeasy.com 作为备用

部署自己的实例：

docker run -d -p 3232:3232 --name originless besoeasy/originless:latest

您的端点：http://localhost:3232/uploadzip