Passing object parameters to script tag?

Question

I am loading a JS script from a CDN in my html. This script takes in a object parameter with props loginURL and logoutURL, like so:

<script src="https://cdns.gigya.com/js/gigya.saml.js?apiKey=<your API key>">
// This part is the object parameter the script requires:
{
    loginURL:"https://my.example.com/login.html",
    logoutURL: "https://my.example.com/logout.html"
}
</script>

Note that it requires an object parameter. I've searched for similar questions on SO but they don't require objects as parameters. Here are the docs for using the script: here, section "SAP Customer Data Cloud SAML Proxy Page".

While this works, I can't use it exactly like that because I need map the apiKey, loginURL, and logoutURL to environment variables (as values change per environment).

What I tried

• To solve the env var problem, I tried using ParcelJS (a html/js bundler), but it fails to build because the object parameter is not valid:

    // Running this from terminal:
    > parcel build proxyPage.html

    // Renders this error:
    proxyPage.html: Cannot assign to read only property 'message' of object 'SyntaxError:
    proxyPage.html: Missing semicolon. (3:21)

  1 | {
  2 |             loginURL:"https://my.example.com/login.html",
> 3 |             logoutURL: "https://my.example.com/logout.html"
    |                      ^
  4 |         }'

  1 | {
  2 |             loginURL:"https://my.example.com/login.html",
> 3 |             logoutURL: "https://my.example.com/logout.html"
    |                      ^
  4 |         }'

• I tried using custom parcel extensions to ignore bundling this file altogether, but couldn't get parcel to ignore it.

• I also tried changing the original script above to pass loginURL and logoutURL as query string params, but that also doesn't work, because the script is expecting an object param, not separate variables:

script src="https://cdns.gigya.com/js/gigya.saml.js?apiKey=MY_API_KEY&loginURL=someSite.html&logoutURL=someOtherSite.html"

returns

Uncaught Error: No object params was found.

EDIT:

OK, so I found a hint. I don't think it's possible to avoid including the weird pseudo-object in the script tag like the docs say.

I prettified the script and found this snippet:

1| if (!e) throw new Error("failed to find script element");
2| var n = t.urlParams(e.src).apiKey,
3|     o = e.innerHTML.replace(/^\s+|\s+$/g, "");
4| if (!o) throw new Error("No object params was found.");

It seems like they're checking the presence of any primitive in the script tag body to determine whether a parameter was passed (they trim white space in line 3 and check if whatever is left is empty in line 4).