वेब ऐप्लिकेशन में सर्वर साइड रेंडरिंग के लिए, रिमोट कॉन्फ़िगरेशन का इस्तेमाल करना

ज़्यादा से ज़्यादा सुविधा देने के लिए, Firebase Remote Config वेब ऐप्लिकेशन के लिए क्लाइंट-साइड और सर्वर-साइड, दोनों तरह के एसडीके इंटिग्रेशन के साथ काम करता है. इसका मतलब है कि आपका ऐप्लिकेशन:

• अपने सर्वर पर Remote Config टेंप्लेट फ़ेच और उनका आकलन करें: आपका सर्वर, Remote Config टेंप्लेट डाउनलोड कर सकता है. साथ ही, सीधे तौर पर टारगेटिंग की शर्तों का आकलन कर सकता है.
• पेज लोड होने की शुरुआती परफ़ॉर्मेंस को ऑप्टिमाइज़ करें: सर्वर-साइड रेंडरिंग के मामलों में, सर्वर पेज लोड होने के दौरान क्लाइंट को कॉन्फ़िगरेशन का आकलन किया गया डेटा दे सकता है. इससे परफ़ॉर्मेंस बेहतर होती है, क्योंकि ज़रूरी कॉन्फ़िगरेशन डेटा पहले ही डिलीवर कर दिया जाता है.

अहम जानकारी: इस सुविधा का मुख्य फ़ोकस, सर्वर-साइड के आकलन पर है. क्लाइंट-साइड के आकलन की सुविधा उपलब्ध नहीं है.

इस तरीके से, आपको अपने ऐप्लिकेशन के व्यवहार और कॉन्फ़िगरेशन को डाइनैमिक तरीके से मैनेज करने में मदद मिलती है. खास तौर पर, सर्वर-साइड रेंडरिंग सेटअप में.

अपने ऐप्लिकेशन के लिए सर्वर-साइड रेंडरिंग सेट अप करना

अपने वेब ऐप्लिकेशन में Remote Config के साथ सर्वर-साइड रेंडरिंग को कॉन्फ़िगर करने के लिए, यहां दिया गया तरीका अपनाकर, अपने क्लाइंट और सर्वर ऐप्लिकेशन अपडेट करें.

पहला चरण: सर्वर साइड ऐप्लिकेशन को अपडेट करना

अपने सर्वर ऐप्लिकेशन में, जहां आपने Firebase Admin Node.js SDK लागू किया है वहां एक RemoteConfigFetchResponse क्लास शामिल करें. यह क्लास, मौजूदा ServerConfig को स्वीकार करती है. इसका इस्तेमाल, कॉन्फ़िगरेशन की उन वैल्यू को क्रम से लगाने के लिए किया जा सकता है जिन्हें आपके क्लाइंट को भेजा जा सकता है.

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>
  );
}

दूसरा चरण: अपने क्लाइंट ऐप्लिकेशन को अपडेट करना

अपने क्लाइंट ऐप्लिकेशन पर, Firebase Javascript SDK टूल लागू करें. इसके बाद, initialFetchResponse कॉन्फ़िगरेशन का विकल्प शामिल करें, ताकि आपके सर्वर ऐप्लिकेशन से पास की गई क्रम से लगाई गई वैल्यू स्वीकार की जा सकें. इससे, एसिंक फ़ेच अनुरोध किए बिना, कॉन्फ़िगरेशन की स्थिति को मैन्युअल तरीके से अपडेट किया जा सकता है.

इसके अलावा, आपको एक ऐसा इनिशियलाइज़ेशन विकल्प शामिल करना होगा जिससे क्लाइंट एसडीके पर firebase-server को templateId के तौर पर सेट किया जा सके. इससे SDK टूल, सर्वर-साइड टेंप्लेट के शुरुआती वर्शन का इस्तेमाल करता है. इससे यह पक्का होता है कि क्लाइंट और सर्वर के बीच पैरामीटर और शर्तों के हिसाब से वैल्यू एक जैसी हों.

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>
  );
}