Para brindar la máxima flexibilidad, Firebase Remote Config admite integración de SDKs del cliente y del servidor para aplicaciones web. Esto significa que tu app puede hacer lo siguiente:
- Recuperar y evaluar plantillas de Remote Config en tu servidor: Tu servidor puede descargar la plantilla de Remote Config y evaluar directamente las condiciones objetivo.
- Optimizat el rendimiento inicial de la carga de la página: En situaciones de renderización del servidor, este puede proporcionar la configuración evaluada al cliente durante la carga inicial de la página. Esto mejora el rendimiento, ya que entrega los datos de configuración necesarios de antemano.
Este enfoque te permite administrar el comportamiento y la configuración de tu app de forma dinámica, en particular en las configuraciones de renderización del servidor.
Configura el procesamiento del servidor para tus apps
Para configurar la renderización del servidor con Remote Config en tu app web, actualiza tus apps de cliente y de servidor con los pasos que se indican a continuación.
Paso 1: Actualiza tu aplicación del servidor
En tu app del servidor (en la que implementaste el SDK de Firebase Admin para Node.js), incluye una clase RemoteConfigFetchResponse que acepte el ServerConfig existente. Puedes usar esto para serializar los valores de configuración que se pueden pasar al cliente.
export default async function MyServerComponent() {
const serverApp = initializeApp();
const serverSideConfig = getRemoteConfig(serverApp);
const template = await serverSideConfig.getServerTemplate();
const config = template.evaluate({randomizationId: 'some-uuid'});
const fetchResponse = new RemoteConfigFetchResponse(serverApp, config);
return (
<div>
<MyClientComponent initialFetchResponse={fetchResponse}></MyClientComponent>
</div>
);
}
Paso 2: Actualiza la app cliente
En tu app cliente, que implementa el SDK de Firebase JavaScript, incluye una opción de configuración initialFetchResponse para aceptar los valores serializados que se pasan desde tu app de servidor. Esto hidrata manualmente el estado de configuración sin hacer una solicitud de recuperación asíncrona.
Además, debes incluir una opción de inicialización que te permita configurar firebase-server como templateId en el SDK cliente. Esto configura el SDK para que use la plantilla inicial del servidor para las recuperaciones posteriores, lo que garantiza parámetros y valores condicionales coherentes entre el cliente y el servidor.
export default function MyClientComponent({initialFetchResponse= ''} = {}) {
const app = initializeApp(firebaseConfig);
const config = getRemoteConfig(app, {
templateId: 'firebase-server',
initialFetchResponse
});
const paramValue = getString(config, 'my_rc_parameter_key');
return (
<div>{paramValue}</div>
);
}