Remote Loader

Loads translation content from remote resources,
enabling more flexible deployment and integration strategies.


Loading Flow

Remote Loader constructs remote resource paths based on the configured url and locale,
determines which resources to load via namespaces,
then fetches and merges them into LocaleMessages.

Remote Loader ─▶ Collect paths ─▶ Fetch resources ─▶ LocaleMessages

Messages Organization

Remote Loader accesses translation resources over HTTP in the following form:

<remote-root>/en/index.json
<remote-root>/en/ui.json
<remote-root>/fr/index.json

<remote-root> represents the root URL of the remote translation source.

Below is an example organization for remote translation resources,
commonly used with object storage–based providers (such as S3 or R2):

index.json
ui.json

index.json
  • Each locale corresponds to a remote path segment
  • Translation content is provided per file; nested directory structures are not supported

Key Structure Rules

The Loader derives the full key path for each entry based on file names.

  • When a file name is not index, the file name itself is treated as a key path segment.
<remote-root>/
└─ en/
   ├─ index.json
   │   └─ { text: "Hello" }    → Key: "text"
   └─ ui.json
       └─ { text: "Hello" }    → Key: "ui.text"

Usage

Remote Loader is enabled via Config .

defineIntorConfig({
  loader: {
    mode: "remote",
    url: "https://cdn.example.com/messages",
  },
});

Different remote configurations can be used for server and client as needed.

defineIntorConfig({
  server: {
    loader: {
      mode: "remote",
      url: "https://private-cdn.com/messages",
      headers: { authorization: "Bearer <SERVER_TOKEN>" },
    },
  },
  client: {
    loader: {
      url: "https://public-cdn.com/messages",
    },
  },
});