SDK Setup & Local Development
This guide walks you through setting up a local development environment to test your Embedded Messaging integration from scratch. Following these steps will ensure your machine is correctly configured to communicate with the Optimove SDK.
1. Create a Test Page
First, create a basic HTML file to serve as your test page.
-
Create a new file named
index.html
. -
Add the following boilerplate code:
<!DOCTYPE html> <html> <head> <title>Embedded Messaging Test</title> </head> <body> <h1>Hello, World!</h1> </body> </html>
2. Run a Local Web Server
To load the Optimove SDK, your page must be served from a web server. The simplest way to do this is using Python's built-in HTTP server.
-
Open your terminal or command prompt.
-
Navigate to the directory where you saved
index.html
. -
Run the following command:
python3 -m http.server 8092
-
Open your web browser and go to
http://localhost:8092/
. You should see your "Hello, World!" page.
3. Add the Optimove SDK
Now, add the Optimove Web SDK script tag to your HTML file. This will load the necessary code to interact with Embedded Messaging.
-
Add the
<script>
tag inside the<head>
section of yourindex.html
file. Remember to replace<YOUR_TENANT_ID>
and<YOUR_TENANT_TOKEN>
with your actual credentials.<!DOCTYPE html> <html> <head> <title>Embedded Messaging Test</title> <script src="[https://sdk.optimove.net/v2/websdk/?tenant_id=](https://sdk.optimove.net/v2/websdk/?tenant_id=)<YOUR_TENANT_ID>&tenant_token=<YOUR_TENANT_TOKEN>"></script> </head> <body> <h1>Hello, World!</h1> </body> </html>
4. Configure Domain Mapping
For the SDK to initialize correctly on your local machine, you must map localhost
to your brand in the Optimove settings.
-
Add
localhost
to the list of domains that resolve to your brand.Setting localhost to map to your brand
Caching and VerificationDue to caching, it can take up to 10 minutes for the new domain mapping to take effect.
You can verify that the mapping is working by checking your browser's Developer Tools. Look for a successful network request to a
config
URL. If the call fails, the domain mapping may not have propagated yet.If the call is successful, or if you don't see it, check the
Application
tab for cached config data in Local Storage.
5. Test Your Setup
Once the SDK is loaded and configured, you can perform a simple test to ensure the out-of-the-box UI components work.
-
Open your browser's JavaScript console.
-
Execute the following command to show the inbox UI:
optimoveSDK.API.Inbox.showInbox();
This should display the Web Inbox component on your page, which will initially be empty. This confirms that your local setup is correct and ready for you to start developing with Embedded Messaging.
Test page with inbox opened via a JavaScript call
Updated 1 day ago