Cloud Uploader

VS Code 扩展 — 点选文件上传到腾讯云 COS 或自定义接口，支持上传历史管理与多视图浏览。

功能

安装

从 VSIX 安装

1. 下载 .vsix 文件
2. VS Code 扩展面板 → `...` → 从 VSIX 安装

从源码构建

git clone git@github.com:novlan1/vscode-file-uploader.git
cd vscode-file-uploader
pnpm i
pnpm build && pnpm package

配置

密钥等敏感信息用环境变量，不要写进 settings.json（会推到 git）。

配置方式

有两种方式让扩展读到密钥。推荐方式一（.env 文件），最稳。

方式一：.env 文件（推荐）

VS Code 从 Finder / Dock / Spotlight 启动时不会加载 ~/.zshrc，所以终端 export 的变量进不来。用 .env 文件可以避免这个问题。

全局配置（所有项目共用）~/.file-uploader.env：

# 个人
COS_SECRET_ID=AKIDxxxxxxxx
COS_SECRET_KEY=xxxxxxxx
COS_BUCKET=my-blog-1250000000
COS_REGION=ap-guangzhou
COS_CDN_DOMAIN=

# 工作（profile=work 时使用）
COS_SECRET_ID_WORK=AKIDyyyy
COS_SECRET_KEY_WORK=yyyy
COS_BUCKET_WORK=company-cdn-1250000000
COS_REGION_WORK=ap-shanghai
COS_CDN_DOMAIN_WORK=https://cdn.company.com

项目级配置 <workspace>/.file-uploader.env（覆盖全局同名键）：

COS_BUCKET=this-project-bucket
COS_CDN_DOMAIN=https://cdn.this.com

加载顺序（高优先级覆盖低优先级）：项目级 → 全局 → ~/.zshrc → process.env

方式二：终端 export（开发/调试场景）

如果从终端启动 VS Code（code 命令），~/.zshrc 里的 export 会进 VS Code 进程：

export COS_SECRET_ID=xxx
export COS_SECRET_KEY=xxx
# 然后从该终端启动
code /path/to/project

这种方式重启终端或重启 VS Code 都要重新加载。

多 Profile 支持

如果工作和个人用的是不同账号，可以设 profile 区分。环境变量命名规则：{KEY}_{PROFILE大写}。 不配 profile 则用无后缀的默认变量。

示例：工作和个人两套 COS 账号

~/.zshrc 或 ~/.bashrc：

# 默认（不用配 profile，或 profile 留空）
export COS_SECRET_ID="个人账号SecretId"
export COS_SECRET_KEY="个人账号SecretKey"
export COS_BUCKET="my-blog-1250000000"
export COS_REGION="ap-guangzhou"

# 工作（profile = work）
export COS_SECRET_ID_WORK="工作账号SecretId"
export COS_SECRET_KEY_WORK="工作账号SecretKey"
export COS_BUCKET_WORK="company-cdn-1250000000"
export COS_REGION_WORK="ap-shanghai"
export COS_CDN_DOMAIN_WORK="https://cdn.company.com"

VS Code settings.json 里只需配 profile 和 uploadMode：

{
  "fileUploader.uploadMode": "cos",
  "fileUploader.profile": "work"
}

把 "work" 改成 "" 或删掉这行就切回个人账号，不用改其他配置。

COS 模式

在 腾讯云控制台 - 访问密钥 创建密钥，在 对象存储 - 存储桶列表 创建 Bucket。

.zshrc 示例（profile 留空时用无后缀版本）：

export COS_SECRET_ID="AKIDxxxxxxxx"
export COS_SECRET_KEY="xxxxxxxx"
export COS_BUCKET="my-bucket-1250000000"
export COS_REGION="ap-guangzhou"
export COS_UPLOAD_PATH="images/"
# 可选
export COS_CDN_DOMAIN="https://cdn.example.com"

路径说明：uploadPath=blog/images/ + 文件 photo.png → key 为 blog/images/photo_abc123.png。填了 cdnDomain 则返回 https://cdn.example.com/...，留空返回 COS 原始地址。

API 模式

export API_UPLOAD_URL="https://api.example.com/upload"
export API_UPLOAD_HEADERS='{"Authorization":"Bearer eyJ..."}'
# 可选
export API_UPLOAD_FIELD_NAME="file"
export API_UPLOAD_RESPONSE_URL_PATH="data.url"
export API_UPLOAD_EXTRA_FIELDS='{"folder":"blog"}'

Response Url Path：接口返回 { "data": { "url": "https://..." } } → 填 data.url。多级路径 result.file.url 也支持。

环境变量对照表

通用配置

重命名规则

常用模板：

{timestamp}-{random}          → lm84c1g-a3f2c1.png
{name}-{timestamp}            → photo-lm84c1g.png
images/{timestamp}/{name}     → images/lm84c1g/photo.png

使用

License

MIT