Web Integration Patterns

Encore.placement(id).show() (and the inline Encore.show()) resolves when the offer flow ends. On web there are no global purchase handlers to register: await the call and branch on the result. When the advertiser opens: The Claim Flow.

Branch on the result

show() resolves a bare ShowResult and never rejects. On a 'reduceChurn' placement, the default useCase, your code calls redeem() after a claim.

import Encore from '@encorekit/web-sdk';

async function onLessonFinished() {
  const result = await Encore.placement('milestone_reached', {
    useCase: 'rewardUsers',
  }).show();

  switch (result.status) {
    case 'claimed':
      // The SDK has opened the advertiser. Keep result.transactionId: it carries
      // the attribution.
      if (result.transactionId) await persistClaim(result.transactionId);
      break;
    case 'dismissed':
      // User closed/declined (result.reason says which), or an internal error
      // (result.reason.type === 'error').
      break;
    case 'unavailable':
      // No eligible offers: fall through to your own flow.
      break;
  }

  goToNextLesson(); // shared tail runs once
}

Loading state

The placement builder exposes a loading callback for spinners and button states:

const result = await Encore.placement('milestone_reached', { useCase: 'rewardUsers' })
  .onLoadingStateChange((isLoading) => setSpinner(isLoading))
  .show();

Cross-cutting telemetry

For consistent analytics across many placements, wrap the placement call in a small helper instead of duplicating tracking at each call site:

async function showOffer(placementId, placementOptions) {
  analytics.track('offer_surface_opened', { placementId });
  const result = await Encore.placement(placementId, placementOptions).show();
  analytics.track('offer_surface_resolved', { placementId, status: result.status });
  return result;
}

Rules of thumb

Always handle all three statuses. unavailable is a normal outcome (no eligible offers), not an error; have a fallback path.
Never gate access on the client result. claimed is not a conversion; verify entitlements server-side, by user, via Encore’s server-side entitlements API.
Persist transactionId on a claim. It is how a completion landing days later is traced back to this user, and it is optional on the result, so handle its absence.
Present from real moments. A cancel tap, a checkout success, a milestone. You do not need a click handler for show() itself: the advertiser tab opens inside a tap on a button in the SDK’s own sheet.

iOS

Android

Web

Bridges

Web Integration Patterns

Branch on the result

Loading state

Cross-cutting telemetry

Rules of thumb

See also

​Branch on the result

​Loading state

​Cross-cutting telemetry

​Rules of thumb

​See also

Branch on the result

Loading state

Cross-cutting telemetry

Rules of thumb

See also