استخدام ميزة "الإعداد عن بُعد" للعرض من جهة الخادم في تطبيقات الويب

لتوفير أقصى قدر من المرونة، تتيح Remote Config منصة Firebase دمج حِزم تطوير البرامج (SDK) على كلٍّ من العميل والخادم لتطبيقات الويب. وهذا يعني أنّه يمكن لتطبيقك تنفيذ ما يلي:

  • الحصول على نماذج Remote Config وتقييمها على خادمك: يمكن ل الخادم تنزيل نموذج Remote Config وتقييم شروط التوجيه مباشرةً.
  • تحسين الأداء الأوّلي لتحميل الصفحة: في سيناريوهات المعالجة من جهة الخادم، يمكن أن يقدّم الخادم الإعدادات التي تم تقييمها إلى العميل أثناء تحميل الصفحة الأوّلي. ويؤدي ذلك إلى تحسين الأداء من خلال تقديم بيانات الضبط اللازمة في البداية.

تتيح لك هذه الطريقة إدارة سلوك تطبيقك وإعداداته بشكل ديناميكي، لا سيما في عمليات إعداد العرض من جهة الخادم.

إعداد ميزة "العرض من جهة الخادم" لتطبيقاتك

لضبط العرض من جهة الخادم باستخدام Remote Config في تطبيق الويب، حدِّث تطبيقات العميل والخادم باستخدام الخطوات التالية.

الخطوة 1: تعديل تطبيقك من جهة الخادم

في تطبيق الخادم الذي نفّذت فيه RemoteConfigFetchResponse SDK لإدارة Node.js في Firebase، أدرِج فئة 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>
  );
}

الخطوة 2: تحديث تطبيق العميل

في تطبيق العميل الذي ينفِّذ حزمة تطوير البرامج (SDK) لـ JavaScript في Firebase، أدرِج خيار إعداد initialFetchResponse لقبول القيم التسلسلية المرسَلة من تطبيق الخادم. يؤدي ذلك إلى إعادة ترطيب حالة الإعداد يدويًا بدون تقديم طلب استرجاع غير متزامن.

بالإضافة إلى ذلك، يجب تضمين خيار إعداد يتيح لك ضبط firebase-server على أنّه templateId في حزمة تطوير البرامج (SDK) للعملاء. يؤدي ذلك إلى ضبط حِزم تطوير البرامج (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>
  );
}