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

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

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

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

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

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

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

في تطبيق الخادم الذي نفّذت فيه حزمة تطوير البرامج (SDK) الخاصة بـ Firebase Admin Node.js، أدرِج فئة 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) لجافا سكريبت من 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>
  );
}