Skip to main content

Static Website Hosting

CloudBase provides developers with static website hosting capabilities, which supports the distribution of static resources such as HTML, CSS, JavaScript, and fonts. Built on Tencent Cloud Object Storage (COS) and a global CDN network, it delivers high-performance, high-availability access experiences for your websites.

Prerequisites​

Before operating static website services using the CLI, ensure that:

  1. Activate Static Website Service: Go to the CloudBase Console to activate the static website service
  2. Manual Activation: The Static Website Hosting service needs to be activated separately after environment creation.
Tip

Currently, the static website hosting feature is only supported in the Tencent Cloud CloudBase Console and is not yet available in the Mini Program IDE console.

Deploying Websites​

Full Deployment​

Use the tcb hosting deploy command to deploy all files in the current directory to the static website.

# Enter the build directory
cd docs

# Deploy all files in the current directory
tcb hosting deploy -e envId

Deploying Specified Files​

You can specify particular files or folders for deployment:

# Basic Syntax
tcb hosting deploy <localPath> [cloudPath] -e envId

Parameter description:

  • localPath: Local file or folder path
  • cloudPath: Cloud target path (Optional, default is the root directory)
  • envId: Environment ID

Example:

# Deploy all files in the hosting directory to the root directory
tcb hosting deploy hosting -e envId

# Deploy the local index.html to the cloud root directory
tcb hosting deploy ./index.html -e envId

# Deploy static/index.js to static/index.js in the cloud
tcb hosting deploy ./static/index.js static/index.js -e envId

Deployment Limitations​

  • File size: Up to 50TB is supported for a single file
  • Number of files: Unlimited
  • Network optimization: If encountering frequent file upload errors { message: 'socket hang up', code: 'ECONNRESET' }, first perform:
    export COS_SDK_KEEPALIVE=false

SPA Application Configuration​

Vue History Mode

When using Vue Router's history mode, you need to configure the error page as the application's entry page (usually index.html) on the settings page of the Static Website Console.

Website Management​

View Service Information​

View details such as the status of the static website and access domain:

tcb hosting detail -e envId

View File List​

List all files in the static website storage:

tcb hosting list -e envId

Delete file​

Delete specified files or folders in the static website:

# Delete specified files or folders
tcb hosting delete <cloudPath> -e envId

# Delete all files (cloudPath is empty)
tcb hosting delete -e envId

Example:

# Delete index.html in the root directory
tcb hosting delete index.html -e envId

# Delete the static folder and all its contents
tcb hosting delete static -e envId

# Clear the entire static website
tcb hosting delete -e envId

Path Explanation​

Path Format​

  • localPath: Local file or folder path

    • Format: directory/filename
    • Example: ./index.js, static/css/index.css

  • cloudPath: Relative path of the cloud file or folder

    • Format: directory/filename (relative to the root directory)
    • Example: index.js, static/css/index.js

Cross-Platform Notes​

Windows System
  • localPath: Use the system path format, typically using the \ separator
  • cloudPath: Uniformly use the / separator, OS-independent

Frequently Asked Questions​

Handling Upload Failures​

If encountering network connection issues resulting in upload failure, you can try:

# Disabling SDK Persistent Connections
export COS_SDK_KEEPALIVE=false

# Then re-execute the deployment command
tcb hosting deploy -e envId

Domain Name Access​

After the deployment is complete, you can access the website through the following methods:

  • View the assigned default domain name in the console
  • Configure a custom domain name (ICP filing required)