Cette solution permet de configurer le backend OAuth de Decap CMS directement via les Cloudflare Pages Functions, sans passer par un serveur/worker tiers ou une application externe obsolète.
1. Arborescence à créer
À la racine de votre dépôt Hugo / Git :
Plaintext
functions/
└── api/
├── auth.js
└── callback.js
2. Fichiers Serverless (Cloudflare Functions)
functions/api/auth.js
JavaScript
export async function onRequestGet(context) {
const clientId = context.env.GITHUB_CLIENT_ID;
const redirectUri = `https://github.com/login/oauth/authorize?client_id=${clientId}&scope=repo`;
return Response.redirect(redirectUri, 302);
}
functions/api/callback.js
JavaScript
export async function onRequestGet(context) {
const { searchParams } = new URL(context.request.url);
const code = searchParams.get('code');
const clientId = context.env.GITHUB_CLIENT_ID;
const clientSecret = context.env.GITHUB_CLIENT_SECRET;
const response = await fetch('https://github.com/login/oauth/access_token', {
method: 'POST',
headers: {
'content-type': 'application/json',
'accept': 'application/json',
},
body: JSON.stringify({
client_id: clientId,
client_secret: clientSecret,
code,
}),
});
const data = await response.json();
if (data.error) {
return new Response(JSON.stringify(data), { status: 400 });
}
const token = data.access_token;
const content = `
<script>
const receiveMessage = (message) => {
window.opener.postMessage(
'authorization:github:success:${JSON.stringify({ token, provider: 'github' })}',
message.origin
);
window.removeEventListener("message", receiveMessage, false);
}
window.addEventListener("message", receiveMessage, false);
window.opener.postMessage("authorizing:github", "*");
</script>
`;
return new Response(content, {
headers: { 'content-type': 'text/html;charset=UTF-8' },
});
}
3. Configuration de la GitHub OAuth App
Sur GitHub (Settings > Developer Settings > OAuth Apps) :
- Homepage URL :
https://<votre-site>.pages.dev - Authorization callback URL :
https://<votre-site>.pages.dev/api/callback
4. Variables d’environnement (Cloudflare Pages)
Dans le dashboard Cloudflare Pages (Settings > Environment variables) :
GITHUB_CLIENT_ID: Votre Client ID GitHubGITHUB_CLIENT_SECRET: Votre Client Secret GitHub
5. Configuration Decap CMS (static/admin/config.yml)
YAML
backend:
name: github
repo: MON_ORGANISATION/MON_DEPOT
branch: main
base_url: https://<votre-site>.pages.dev
auth_endpoint: /api/auth