Samsung Tizen দিয়ে শুরু করুন

PAL ব্যবহার করে একটি নন্স তৈরি করে এমন একটি নমুনা অ্যাপ দেখতে, GitHub থেকে CTV Samsung Tizen উদাহরণটি ডাউনলোড করুন।

এই নির্দেশিকাটি একটি Samsung Tizen অ্যাপ্লিকেশনে PAL SDK অন্তর্ভুক্ত করে, একটি নোটের অনুরোধ করে এবং বিজ্ঞাপনের ইম্প্রেশন নিবন্ধন করে।

পূর্বশর্ত

এই নির্দেশিকাটি শুরু করার আগে, আপনাকে একটি মৌলিক Tizen অ্যাপ তৈরি করতে হবে। অ্যাপটি সেট আপ করার জন্য আপনি Tizen IDE ব্যবহার করতে পারেন। আরও তথ্যের জন্য Tizen ব্যবহার শুরু করার বিষয়ে এই ভিডিওটি দেখুন।

একটি ননস তৈরি করুন

"nonce" হল PAL দ্বারা NonceLoader ব্যবহার করে তৈরি করা একটি একক এনক্রিপ্ট করা স্ট্রিং। PAL SDK-এর জন্য প্রতিটি নতুন স্ট্রিম অনুরোধের সাথে একটি নতুন জেনারেট করা nonce থাকা বাধ্যতামূলক। তবে, একই স্ট্রিমের মধ্যে একাধিক বিজ্ঞাপন অনুরোধের জন্য nonces পুনরায় ব্যবহার করা যেতে পারে।

আপনার অ্যাপের জন্য একটি HTML ফাইল তৈরি করুন। আপনার HTML ফাইলে webapis.js নির্ভরতা অন্তর্ভুক্ত করুন। PAL-এর কাজ করার জন্য এই নির্ভরতা প্রয়োজন। আরও তথ্যের জন্য, Samsung WebApi ডকুমেন্টেশন দেখুন।

আপনার index.html ফাইলে CTV PAL SDK এর জন্য একটি নির্ভরতা অন্তর্ভুক্ত করুন। webapis.js এর জন্য স্ক্রিপ্ট ট্যাগের পরে স্ক্রিপ্ট ট্যাগটি লোড করুন। উদাহরণের জন্য নিম্নলিখিত index.html ফাইলটি দেখুন।

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
 <script src="$WEBAPIS/webapis/webapis.js"></script>
 <script src="//imasdk.googleapis.com/pal/sdkloader/pal_ctv.js"></script>
 <script src="app.js"></script>
</head>
<body>
  <header>
    <hgroup>
      <h1>Samsung Tizen app for PAL sdk</h1>
    </hgroup>
  </header>
  <div id="placeholder-video"></div>
</body>
</html>

PAL স্প্যাম সিগন্যালগুলি সঠিকভাবে কাজ করার জন্য নির্দিষ্ট Tizen সুবিধাগুলির প্রয়োজন। নিম্নলিখিত সুবিধা ঘোষণা সহ একটি config.xml ফাইল তৈরি করুন:

  • "http://tizen.org/privilege/internet"
  • "http://tizen.org/privilege/system"
  • "http://tizen.org/privilege/telephony"
  • "http://tizen.org/privilege/tv.inputdevice"
  • "http://developer.samsung.com/privilege/network.public"
  • "http://developer.samsung.com/privilege/productinfo"

config.xml ফাইলের উদাহরণের জন্য নিম্নলিখিত কোড স্নিপেটটি দেখুন:

<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns:tizen="http://tizen.org/ns/widgets" xmlns="http://www.w3.org/ns/widgets" id="http://yourdomain/BasicProject" version="1.0.0" viewmodes="maximized">
    <tizen:application id="PACKAGE_STRING.BasicProject" package="PACKAGE_STRING" required_version="2.3"/>
    <content src="index.html"/>
    <feature name="http://tizen.org/feature/screen.size.normal.1080.1920"/>
    <icon src="icon.png"/>
    <tizen:metadata key="http://tizen.org/metadata/app_ui_type/base_screen_resolution" value="extensive"/>
    <name>BasicProject</name>
    <tizen:privilege name="http://tizen.org/privilege/internet"/>
    <tizen:privilege name="http://tizen.org/privilege/system"/>
    <tizen:privilege name="http://tizen.org/privilege/telephony"/>
    <tizen:privilege name='http://tizen.org/privilege/tv.inputdevice'/>
    <tizen:privilege name="http://developer.samsung.com/privilege/network.public"/>
    <tizen:privilege name="http://developer.samsung.com/privilege/productinfo"/>
    <tizen:profile name="tv-samsung"/>
    <tizen:setting screen-orientation="landscape" context-menu="enable" background-support="disable" encryption="disable" install-location="auto" hwkey-event="enable"/>
    <access origin="*" subdomains="true"/>
</widget>

তারপর, একটি জাভাস্ক্রিপ্ট ফাইল তৈরি করে একটি nonce তৈরি করুন। এই ধাপে PAL ওয়ার্কফ্লো অন্তর্ভুক্ত রয়েছে: একটি NonceLoader তৈরি করা, একটি NonceRequest তৈরি করা এবং তারপর NonceLoader.loadNonceManager() ব্যবহার করে একটি nonce অনুরোধ করা।

let videoElement;
let nonceLoader;
let managerPromise;
let nonceManager;
let playbackStarted = false;

/**
 * Initializes the PAL loader.
 */
function init() {
  const videoElement = document.getElementById('placeholder-video');
  videoElement.addEventListener('mousedown', onVideoTouch);
  videoElement.addEventListener('touchstart', onVideoTouch);
  videoElement.addEventListener('play', function() {
    if (!playbackStarted) {
      sendPlaybackStart();
      playbackStarted = true;
    }
  });
  videoElement.addEventListener('ended', sendPlaybackEnd);
  videoElement.addEventListener('error', function() {
    // Handle video error.
    sendPlaybackEnd();
  });

  // The default value for the `allowStorage` parameter is false. You must
  // set this value to true to let PAL determine whether limited ads applies
  // based on the TCF data. You can optionlly use the `forceLimitedAds`
  // parameter to enable limited ads regardless of the TCF data.
  const consentSettings = new goog.pal.ConsentSettings();
  consentSettings.allowStorage = true;

  nonceLoader = new goog.ctv.pal.NonceLoader(consentSettings);

  generateNonce();
}

/**
 * Generates a nonce with sample arguments and logs it to the console.
 *
 * The NonceRequest parameters set here are example parameters.
 * You should set your parameters based on your own app characteristics.
 */
function generateNonce() {
  const request = new goog.ctv.pal.NonceRequest();
  request.adWillAutoPlay = true;
  request.adWillPlayMuted = false;
  request.continuousPlayback = false;
  request.descriptionUrl = 'https://example.com';
  request.iconsSupported = true;
  request.playerType = 'Sample Player Type';
  request.playerVersion = '1.0';
  request.ppid = 'Sample PPID';
  request.sessionId = 'Sample SID';
  // Player support for VPAID 2.0, OMID 1.0, and SIMID 1.1
  request.supportedApiFrameworks = '2,7,9';
  request.url = 'https://developers.google.com/ad-manager/pal/ctv';
  request.videoHeight = 480;
  request.videoWidth = 640;

  managerPromise = nonceLoader.loadNonceManager(request);
  managerPromise
      .then(function(manager) {
        nonceManager = manager;
      })
      .catch((error) => {
        // Handle nonce generating error.
      });
}

window.addEventListener("load", function(event) {
  init();
});

বিজ্ঞাপনের অনুরোধের সাথে আপনার নন্স সংযুক্ত করুন

জেনারেট করা nonce ব্যবহার করতে, আপনার বিজ্ঞাপনের অনুরোধ করার আগে আপনার বিজ্ঞাপন ট্যাগটিতে একটি givn প্যারামিটার এবং nonce মান যুক্ত করুন।

  /**
   * The ad tag for your ad request, for example:
   * https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/single_ad_samples&ciu_szs=300x250&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ct%3Dlinear&correlator=
   *
   * For more sample ad tags, see https://developers.google.com/interactive-media-ads/docs/sdks/html5/client-side/tags
   */
  const DEFAULT_AD_TAG = "Your ad tag";

  ...

  managerPromise = nonceLoader.loadNonceManager(request);
  managerPromise
      .then(function(manager) {
        nonceManager = manager;
        
        // Append the nonce to the ad tag URL.
        makeAdRequest(DEFAULT_AD_TAG + "&givn=" + nonceString);
        
      })

প্লেব্যাক ইভেন্টগুলি ট্র্যাক করুন

পরিশেষে, আপনার প্লেয়ারের জন্য বিভিন্ন ইভেন্ট হ্যান্ডলার বাস্তবায়ন করতে হবে। পরীক্ষার উদ্দেশ্যে, আপনি এগুলি বোতাম ক্লিক ইভেন্টগুলিতে সংযুক্ত করতে পারেন, তবে বাস্তব বাস্তবায়নে, এগুলি উপযুক্ত প্লেয়ার ইভেন্ট দ্বারা ট্রিগার করা হবে:

/**
 * Informs PAL that an ad click has occurred. How this function is
 * called will vary depending on your ad implementation.
 */
function sendAdClick() {
  if (nonceManager) {
    nonceManager.sendAdClick();
  }
}

/**
 * Handles the user touching on the video element, passing it to PAL.
 * @param {!TouchEvent|!MouseEvent} touchEvent
 */
function onVideoTouch(touchEvent) {
  if (nonceManager) {
    nonceManager.sendAdTouch(touchEvent);
  }
}

/** Informs PAL that playback has started. */
function sendPlaybackStart() {
  if (nonceManager) {
    nonceManager.sendPlaybackStart();
  }
}

/** Informs PAL that playback has ended. */
function sendPlaybackEnd() {
  if (nonceManager) {
    nonceManager.sendPlaybackEnd();
  }
}

আপনার বাস্তবায়নে, আপনার ভিডিও প্লেব্যাক সেশন শুরু হওয়ার সাথে সাথে sendPlaybackStart কল করা উচিত। আপনার ভিডিও প্লেব্যাক সেশন শেষ হওয়ার সাথে সাথে sendPlaybackEnd কল করা উচিত। দর্শক যখনই কোনও বিজ্ঞাপনে ক্লিক করে তখনই sendAdClick কল করা উচিত। প্লেয়ারের সাথে প্রতিটি স্পর্শ ইন্টারঅ্যাকশনে sendAdTouch কল করা উচিত।

(ঐচ্ছিক) থার্ড-পার্টি বিজ্ঞাপন সার্ভারের মাধ্যমে Google বিজ্ঞাপন ম্যানেজার সিগন্যাল পাঠান

বিজ্ঞাপন পরিচালকের জন্য তৃতীয় পক্ষের বিজ্ঞাপন সার্ভারের অনুরোধ কনফিগার করুন।

আপনার থার্ড-পার্টি বিজ্ঞাপন সার্ভার কনফিগার করুন যাতে অ্যাড ম্যানেজারের কাছে সার্ভারের অনুরোধে nonce অন্তর্ভুক্ত থাকে। থার্ড-পার্টি বিজ্ঞাপন সার্ভারের ভিতরে কনফিগার করা একটি বিজ্ঞাপন ট্যাগের উদাহরণ এখানে দেওয়া হল:

'https://pubads.serverside.net/gampad/ads?givn=%%custom_key_for_google_nonce%%&...'

আরও বিস্তারিত জানার জন্য, Google বিজ্ঞাপন ম্যানেজার সার্ভার-সাইড বাস্তবায়ন নির্দেশিকা দেখুন।

বিজ্ঞাপন ব্যবস্থাপক ননস মান সনাক্ত করার জন্য givn= অনুসন্ধান করে। তৃতীয় পক্ষের বিজ্ঞাপন সার্ভারকে তার নিজস্ব কিছু ম্যাক্রো সমর্থন করতে হবে, যেমন %%custom_key_for_google_nonce%% , এবং এটিকে পূর্ববর্তী ধাপে আপনার দেওয়া ননস কোয়েরি প্যারামিটার দিয়ে প্রতিস্থাপন করতে হবে। এটি কীভাবে সম্পন্ন করবেন সে সম্পর্কে আরও তথ্য তৃতীয় পক্ষের বিজ্ঞাপন সার্ভারের ডকুমেন্টেশনে পাওয়া উচিত।

ব্যস! এখন আপনার নন্স প্যারামিটারটি PAL SDK থেকে আপনার মধ্যস্থতাকারী সার্ভারের মাধ্যমে এবং তারপর Google Ad Manager-এ প্রচারিত হওয়া উচিত। এটি Google Ad Manager-এর মাধ্যমে আরও ভালোভাবে নগদীকরণ সক্ষম করে।