Last updated Feb 27, 2024

Integrate with sandbox

With a sandbox integration, you can pass a configuration flag to test against a sandbox environment. The sandbox environment follows a normal offers, bidding, and matching process against your production configuration. While a sandbox environment is part of the Rokt production environment, it does not charge advertisers or generate revenue. As a result, you can use it for acceptance testing before deploying to production.

The integration follows exactly the same steps as in previous examples, with an additional sandbox attribute required to be passed to the execute function.

Warning

You must remove the sandbox attribute before going live with your placement.

Overlay placement example

To run an overlay placement in the sandbox environment, the list of attributes passed to Rokt needs to be updated to include "sandbox": "true". This can be done by updating the code from the example in the launching an overlay placement documentation to include the following:

Major Version 3

JavaScript

import { Rokt } from "@rokt/react-native-sdk";

const attributes = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};

Rokt.execute("RoktExperience", attributes, {}, () =>
  console.log("Placement Loaded")
);

TypeScript

import { Rokt } from "@rokt/react-native-sdk";

const attributes: Record<stirng, string> = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};

Rokt.execute("RoktExperience", attributes, {}, () =>
  console.log("Placement Loaded")
);

Major Version 4

JavaScript

import { Rokt } from "@rokt/react-native-sdk";

const attributes = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};

Rokt.execute("RoktExperience", attributes, {});

TypeScript

import { Rokt } from "@rokt/react-native-sdk";

const attributes: Record<stirng, string> = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};

Rokt.execute("RoktExperience", attributes, {});

Embedded placement example

To run an embedded placement in the sandbox environment, you need to update the list of attributes passed to Rokt to include "sandbox": "true". This can be done by updating the sample code from the launching an embedded placement documentation to the following:

Major Version 3

JavaScript

import { Rokt, RoktEmbeddedView } from "@rokt/react-native-sdk";

...

const placeholders = {
  RoktEmbedded1: findNodeHandle(this.placeholder1.current),
};

const attributes = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};
Rokt.execute("RoktEmbeddedExperience", attributes, placeholders, () =>
  console.log("Placement Loaded")
);

TypeScript

import { Rokt, RoktEmbeddedView } from "@rokt/react-native-sdk";

...

const placeholders: Record<string, number | null> = {
  RoktEmbedded1: findNodeHandle(this.placeholder1.current),
};

const attributes: Record<string, string> = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};
Rokt.execute("RoktEmbeddedExperience", attributes, placeholders, () =>
  console.log("Placement Loaded")
);

Major Version 4

JavaScript

import { Rokt, RoktEmbeddedView } from "@rokt/react-native-sdk";

...

const placeholders = {
  RoktEmbedded1: findNodeHandle(this.placeholder1.current),
};

const attributes = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};
Rokt.execute("RoktEmbeddedExperience", attributes, placeholders);

TypeScript

import { Rokt, RoktEmbeddedView } from "@rokt/react-native-sdk";

...

const placeholders: Record<string, number | null> = {
  RoktEmbedded1: findNodeHandle(this.placeholder1.current),
};

const attributes: Record<string, string> = {
  email: "j.smith@example.com",
  sandbox: "true",
  firstname: "Jenny",
  lastname: "Smith",
  mobile: "(323) 867-5309",
  postcode: "90210",
  country: "US",
};
Rokt.execute("RoktEmbeddedExperience", attributes, placeholders);