Internationalization with Edge functions
Provide an example of how to implement locale detection and content internationalization within Edge functions.
exports.handler = async (event) => {
// Get the accept-language header from the client request
const langHeader = event.request.headers.get('accept-language');
// Set a default locale
const defaultLocale = 'en';
// Parse the accept-language header and extract the preferred locale
// This regex extracts the first locale ignoring the quality values
// For a more robust solution, consider using a library to parse the Accept-Language header
const preferredLocale = langHeader ? langHeader.split(',')[0].split(';')[0].trim() : defaultLocale;
// Load the localized content for the preferred locale
let content;
switch (preferredLocale) {
case 'es':
content = 'Hola, mundo!';
break;
case 'fr':
content = 'Bonjour, le monde!';
break;
case 'en':
default:
content = 'Hello, world!';
break;
}
// Respond with the localized content
return new Response(content, {
headers: {
'content-type': 'text/plain',
'content-language': preferredLocale
}
});
};
This Edge function intercepts HTTP requests, detects the preferred locale from the 'Accept-Language' header, and serves localized text content based on the detected locale. If the 'Accept-Language' header is not present or a matching locale can't be found, it defaults to English (en). The function responds with the localized greeting text in the preferred language.