iframe Support

Embed the Halliday Anychain Onramp in an iFrame

By default, the Halliday Anychain Onramp opens in a separate window or tab. If you would like to embed the Halliday Anychain Onramp in an iframe, you can do so in just 2 additional lines of code. The iframe has a height of 638 pixels and a width of 480 pixels.

import { openHallidayOnramp } from "halliday-sdk";

// openHallidayOnramp will be in an iframe that begins the onramp flow.
openHallidayOnramp({
  apiKey: "HALLIDAY_PUBLIC_API_KEY",
  verifierClientId: "VERIFIER_CLIENT_ID",
  destinationBlockchainType: "DFK",
  destinationCryptoType: "JEWEL_DFK",
  inGamePlayerId: "in-game-player-id",
  useSandbox: false, 
  
  // ADD these lines to enable iframe
  windowType: "EMBED",
  targetElementId: "element-id", // The HTML element id to render the iframe inside of 
});
import { openHallidayOnrampToEOA } from "halliday-sdk";

// openHallidayOnrampToEOA will open a popup that begins the onramp flow.
openHallidayOnrampToEOA({
  apiKey: "HALLIDAY_PUBLIC_API_KEY",
  destinationBlockchainType: "DFK",
  destinationCryptoType: "JEWEL_DFK",
  useSandbox: false,
  
  // ADD these lines to enable iFrame
  windowType: "EMBED",
  targetElementId: "element-id", // The HTML element id to render the iframe inside of 
});
import { openHallidayOnramp } from "halliday-sdk";

const walletAddress = "0x...";  // The user's EOA address
const loggedInEmail = "[email protected]"; // The email associated with the user
    
// Function we can call to pass in a Halliday session key for the user to sign. 
// This session key expires at the end of the onramp session.
const sessionKeySignerCallback = async (sessionKey: Uint8Array) => {
  // remove "Signed Ethereum message" prefix to sign since ethers adds it
  return ownerSigner.signMessage(sessionKey.slice(28));
};
    
openHallidayOnramp({
  apiKey: SANDBOX_API_KEY,
  verifierClientId: "",
  destinationBlockchainType: "SHRAPNEL",
  destinationCryptoType: "SHRAPTOKEN_SHRAPNEL",
  destinationAddress: walletAddress,
  sessionKeySignerCallback: sessionKeySignerCallback,
  loggedInEmail: ownerEmail,
  inGamePlayerId: walletAddress,
  useSandbox: true,
  
  // ADD these lines to enable iFrame
  windowType: "EMBED",
  targetElementId: "element-id", // The HTML element id to render the iframe inside of 
});

🚧

Stripe Does Not Support iframe Mode

This feature is not supported if you wish to enable onramp through Stripe.