tigris-static-assets

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Tigris Static Asset Hosting

Tigris静态资源托管

Deploy CSS, JavaScript, fonts, and build artifacts to Tigris for global CDN delivery. Covers asset pipeline integration, cache-busting strategies, and
Cache-Control
configuration for all major frameworks.
将CSS、JavaScript、字体和构建产物部署到Tigris,实现全球CDN分发。涵盖资源流水线集成、缓存失效策略,以及针对所有主流框架的
Cache-Control
配置。

Prerequisites

前置条件

Before doing anything else, install the Tigris CLI if it's not already available:
bash
tigris help || npm install -g @tigrisdata/cli
If you need to install it, tell the user: "I'm installing the Tigris CLI (
@tigrisdata/cli
) so we can work with Tigris object storage."
在进行任何操作之前,如果尚未安装Tigris CLI,请先安装:
bash
tigris help || npm install -g @tigrisdata/cli
如果需要安装,请告知用户:"我正在安装Tigris CLI(
@tigrisdata/cli
),以便我们可以使用Tigris对象存储。"

Overview

概述

Tigris public buckets automatically serve files from the nearest global edge — no separate CDN configuration needed. Combined with content-hashed filenames and immutable cache headers, this gives you fast, cost-effective static asset delivery.
Key pattern:
  1. Build assets with content hashes (e.g.,
    main-abc123.js
    )
  2. Upload to a public Tigris bucket
  3. Set
    Cache-Control: public, max-age=31536000, immutable
  4. Point your app's asset URL to the Tigris bucket

Tigris公共存储桶会自动从最近的全球边缘节点提供文件服务——无需单独配置CDN。结合内容哈希文件名和不可变缓存头,可实现快速、经济高效的静态资源分发。
核心流程:
  1. 生成带内容哈希的资源文件(例如:
    main-abc123.js
  2. 上传至Tigris公共存储桶
  3. 设置
    Cache-Control: public, max-age=31536000, immutable
  4. 将应用的资源URL指向Tigris存储桶

Cache Headers

缓存头

bash
undefined
bash
undefined

For immutable, hashed assets (CSS, JS bundles)

适用于不可变的哈希资源(CSS、JS包)

Cache-Control: public, max-age=31536000, immutable
Cache-Control: public, max-age=31536000, immutable

For mutable assets (manifest files, index.html)

适用于可变资源(清单文件、index.html)

Cache-Control: public, max-age=0, must-revalidate
Cache-Control: public, max-age=0, must-revalidate

For fonts

适用于字体文件

Cache-Control: public, max-age=31536000, immutable
undefined
Cache-Control: public, max-age=31536000, immutable
undefined

Setting Headers via CLI

通过CLI设置缓存头

bash
tigris cp dist/main-abc123.js t3://my-assets/main-abc123.js \
  --cache-control "public, max-age=31536000, immutable" \
  --content-type "application/javascript"
bash
tigris cp dist/main-abc123.js t3://my-assets/main-abc123.js \
  --cache-control "public, max-age=31536000, immutable" \
  --content-type "application/javascript"

Setting Headers via SDK

通过SDK设置缓存头

typescript
import { put } from "@tigrisdata/storage";

await put("assets/main-abc123.js", fileBuffer, {
  access: "public",
  contentType: "application/javascript",
});

typescript
import { put } from "@tigrisdata/storage";

await put("assets/main-abc123.js", fileBuffer, {
  access: "public",
  contentType: "application/javascript",
});

Upload Script (General)

通用上传脚本

bash
#!/bin/bash
bash
#!/bin/bash

scripts/deploy-assets.sh

scripts/deploy-assets.sh

BUCKET="my-app-assets" BUILD_DIR="dist"
BUCKET="my-app-assets" BUILD_DIR="dist"

Upload hashed assets with long cache

上传带哈希的资源并设置长期缓存

tigris cp "$BUILD_DIR/" "t3://$BUCKET/" -r
--cache-control "public, max-age=31536000, immutable"
echo "Assets deployed to t3://$BUCKET/"

---
tigris cp "$BUILD_DIR/" "t3://$BUCKET/" -r
--cache-control "public, max-age=31536000, immutable"
echo "Assets deployed to t3://$BUCKET/"

---

Framework Guides

框架指南

Read the resource file for your framework:
  • Next.js — Read
    ./resources/nextjs.md
    for assetPrefix config and deploy script
  • Remix — Read
    ./resources/remix.md
    for Vite config and deploy script
  • Express — Read
    ./resources/express.md
    for static redirect pattern
  • Rails — Read
    ./resources/rails.md
    for Sprockets/Propshaft asset sync
  • Django — Read
    ./resources/django.md
    for collectstatic with S3 backend
  • Laravel — Read
    ./resources/laravel.md
    for Vite/Mix asset upload

请查看对应框架的资源文件:
  • Next.js — 查看
    ./resources/nextjs.md
    了解assetPrefix配置和部署脚本
  • Remix — 查看
    ./resources/remix.md
    了解Vite配置和部署脚本
  • Express — 查看
    ./resources/express.md
    了解静态重定向模式
  • Rails — 查看
    ./resources/rails.md
    了解Sprockets/Propshaft资源同步
  • Django — 查看
    ./resources/django.md
    了解基于S3后端的collectstatic配置
  • Laravel — 查看
    ./resources/laravel.md
    了解Vite/Mix资源上传

Cache-Busting Strategies

缓存失效策略

StrategyExampleUse When
Content hash in filename
main-abc123.js
Build tools generate hashed names (Vite, Webpack)
Query string
main.js?v=abc123
Legacy systems without hashed filenames
Directory versioning
/v2/assets/main.js
Major version changes
Most modern build tools (Vite, Webpack, esbuild) generate content-hashed filenames by default. Use these with
immutable
cache headers for the best performance.

策略示例适用场景
文件名包含内容哈希
main-abc123.js
构建工具自动生成哈希文件名(Vite、Webpack)
查询字符串参数
main.js?v=abc123
无法生成哈希文件名的遗留系统
目录版本化
/v2/assets/main.js
重大版本更新时
大多数现代构建工具(Vite、Webpack、esbuild)默认会生成带内容哈希的文件名。将这些文件与
immutable
缓存头配合使用,可获得最佳性能。

Critical Rules

关键规则

Always: Use a public bucket for static assets | Set
Cache-Control: immutable
on hashed assets | Use content-hashed filenames | Upload after build, not on every request
Never: Serve static assets through your app server in production (use Tigris CDN) | Set long cache times on mutable filenames | Forget to update asset URL configuration in your framework

必须遵守: 使用公共存储桶托管静态资源 | 为哈希资源设置
Cache-Control: immutable
| 使用带内容哈希的文件名 | 构建完成后再上传资源,而非每次请求时上传
切勿: 在生产环境中通过应用服务器提供静态资源(使用Tigris CDN) | 为可变文件名设置长期缓存 | 忘记在框架中更新资源URL配置

Related Skills

相关技能

  • tigris-egress-optimizer — Reduce bandwidth costs
  • tigris-lifecycle-management — Clean up old asset versions
  • tigris-egress-optimizer — 降低带宽成本
  • tigris-lifecycle-management — 清理旧版本资源

Official Documentation

官方文档