How to connect to European Data Center with the web SDK?

[mistyharsh]

I am having difficulty in connecting to the Iterable's European data center. I tried using NPM approach as well as CDN approach as documented here. But, SDK always connects to the default endpoint (https://api.iterable.com/api).

As the guidelines says:

To do this, on the web server that hosts your site, set the IS_EU_ITERABLE_SERVICE environment variable to true.

I used following different means to setup this flag.

• process.env.IS_EU_ITERABLE_SERVICE = true.
• globalThis.IS_EU_ITERABLE_SERVICE = true.
• window.IS_EU_ITERABLE_SERVICE = true.

CDN approach.

I used following script to initialize the Iterable SDK:

<script src="https://unpkg.com/@iterable/web-sdk/index.js"></script>

But as I see in this compiled code, the flag is used as shown below:

var t="https://".concat("true"==={VERSION:"1.1.0-beta"}.IS_EU_ITERABLE_SERVICE?"api.eu.iterable.com":"api.iterable.com","/api")

As far as I understand, the condition will always be false and would always pick the default api.iterable.com URL,

NPM approach

With NPM approach, I get the same requests. I tried using both files specified by main and browser field in the package.json file of the package:

• package.json main field points to index.node.js file.
• package.json browser field points to index.js file.

We are using two bundlers - Vite and Webpack. And, we can configure to to pick any file. But it looks like the code is already compiled where the IS_EU_ITERABLE_SERVICE flag is never initialized anywhere in the compiled code. Both files contain the code similar to the one served by CDN.

---

I used versions 1.0.8 and latest 1.1.0-beta. Is there any other solution for this?

[mprew97]

Hi @mistyharsh, currently investigating this. Thanks for the writeup.

[mprew97]

@mistyharsh we are cutting a new release. once that is out, please use that version and try again and your issue should be resolved :)

[mprew97]

@mistyharsh this update is in release v1.0.9. Please let us know if this resolves your issue!

[mistyharsh]

Hey @mprew97,

I tried this last week and the issue still persists with version v1.0.9 if I follow official documentation. I tested this with Vite and defined the environment variable like this:

import { defineConfig } from 'vite';

export default defineConfig({
  define: {
    'process.env.IS_EU_ITERABLE_SERVICE': '"true"',
   
    // As well as this too
   'process.env.IS_EU_ITERABLE_SERVICE': 'true',
  },
});

However, the requests never reaches the EU API endpoint. I used both the files @iterable/web-sdk/index.js as well as @iterable/web-sdk/index.node.js as defined by the respective browser and main fields of package.json file. After the compilation by Webpack, the Webpack simply removes process.env.* variable references. The compiled code contains only following:

const t=`https://${"true"==={VERSION:"1.0.9"}.IS_EU_ITERABLE_SERVICE?"api.eu.iterable.com":"api.iterable.com"}/api`;

However, this flag works when I use the un-minified import from @iterable/web-sdk/dist/index.js instead of @iterable/web-sdk. But, I also need to set global = globalThis for it to work.

[mprew97]

@mistyharsh interesting. will work on reproducing... in the meantime, can you try making use of the config object?

You should be able to import and call config.setConfig({ baseURL: 'https://api.eu.iterable.com' }); which should work in the meantime.

[mprew97]

@mistyharsh Alright, we have a fix released for this particular issue!

In order to get this working, you will need to upgrade the SDK to v1.0.11 and make some minor updates to the SDK initialization method.

Instead of using the initialize method to initialize the SDK, you will need to call the new method initializeWithConfig. This will enable you to pass in a new configuration object which contains the toggle isEuIterableService . When that is set to true, it will make the SDK call the EU API.

See these docs for more details.

[mistyharsh]

Thanks @mprew97 for the update.

I tested this new SDK yesterday with both the suggested approaches: config.setConfig() and initializeWithConfig(). And they are now working and SDK is properly sending requests to EU data center.

The only change I had to do with initializeWithConfig what instead of passing three parameters as documented, I needed to pass a single object containing three arguments as per this API doc:

const { setEmail } = initializeWithConfig({
  authToken: process.env.API_KEY,
  configOptions: {
    isEuIterableService: true,
  },
  generateJWT: fetchJWT
});

One last question. Is the config.setConfig() method officially supported? I ask this because, currently, it is not documented!