logo hsb.horse
← Retour au blog

Blog

Comment configurer le routage des sous-répertoires avec Cloudflare Workers

Étapes de configuration pour déployer un projet Astro sous un sous-répertoire avec Cloudflare Workers. Organisé comment ajuster wrangler.json et astro.config.

Publié:

Depuis le 2025-11-28, ce site fonctionne sur deux projets Astro.

  • hsbt.horse/* : Racine
  • hsbt.horse/tools/* : Outils

Il n’y a aucun problème si vous écrivez la racine wrangler.json simplement selon le document officiel.

{
"name": "root",
"compatibility_date": "2025-11-19",
"route": "hsbt.horse/*",
"assets": {
"directory": "./dist/",
"not_found_handling": "404-page"
},
"preview_urls": false
}

D’un autre côté, les outils ne fonctionnaient pas comme prévu à moins qu’un certain travail ne soit effectué.

Problème : le routage du sous-répertoire aboutit à 404

Écrivez wrangler.json comme suit.

{
"name": "tool",
"compatibility_date": "2025-11-19",
"route": "hsbt.horse/tools/*",
"assets": {
"directory": "./dist/",
"not_found_handling": "404-page"
},
"preview_urls": false
}

Il n’y a aucun problème avec la façon dont il est écrit, mais si vous le déployez tel quel, vous obtiendrez une erreur 404.

La raison en est que le comportement de téléchargement de fichiers sous dist/tools selon la structure hiérarchique de /tools/* décrite dans route semble être la spécification de Wrangler.

Solution : définir base et outDir dans astro.config.mjs

Cette méthode peut être utilisée pour traiter src/pages comme tools/.

Si vous définissez base et outDir comme ci-dessous dans astro.config.mjs, cela fonctionnera comme prévu.

export default defineConfig({
site: "https://hsbt.horse",
base: "/tools/",
outDir: "./dist/tools",
})

base ajoute un préfixe aux liens et chemins d’actifs générés par Astro.

outDir modifie la destination de sortie de construction en ./dist/tools pour correspondre à la structure hiérarchique attendue par Wrangler.

Non planifié : implémentez diverses pages sous src/pages/tools

Ne modifiez pas les paramètres dans astro.config.mjs. La base n’est pas définie et outDir n’est pas modifié par rapport à dist.

Au lieu de cela, nous allons résoudre ce problème en établissant des règles d’implémentation pour le côté routage basé sur les fichiers sous src/pages.

En implémentant les pages nécessaires sous src/pages/tools, vous pouvez afficher diverses pages vers dist/tools sans modifier les paramètres.

Cependant, avec cette méthode, le répertoire _astro (divers JS, CSS, actifs groupés) sera créé directement sous dist, donc le HTML sous dist/tools sera déployé, mais les actifs ne seront pas déployés.

résumé

Lors du déploiement d’un projet dans un sous-répertoire avec Cloudflare Workers, vous devez ajuster non seulement les paramètres d’itinéraire de Wrangler mais également base et outDir du côté Astro.

En alignant la hiérarchie, Wrangler pourra télécharger des fichiers correctement.