Skip to main content

​
Trading App Iframe Integration with TypeScript

This guide shows how to integrate the trading app as an iframe in your TypeScript application and control wallet whitelisting programmatically.

​
Installation

Embed the trading app as an iframe in your application: 
<iframe 
  id="trading-iframe" 
  src="https://frame.raze.sh/sol/" 
  frameborder="0">
</iframe>

​
Basic Setup

// Get iframe reference
const iframe = document.getElementById('trading-iframe') as HTMLIFrameElement;

// Listen for messages from iframe
window.addEventListener('message', (event: MessageEvent<IframeResponse>) => {
  if (event.source !== iframe.contentWindow) return;
  
  handleIframeMessage(event.data);
});

// Send message to iframe
function sendMessage(message: IframeMessage): void {
  iframe.contentWindow?.postMessage(message, '*');
}