Questions and discussions about using the Shopify CLI and Shopify-built libraries.
Hi,
Going through the tutorial Get session tokens using App Bridge utilities (shopify.dev).
What would be the ES5 and the CDN-hosted equivalent of this code?
import createApp from "@shopify/app-bridge";
import { getSessionToken } from "@shopify/app-bridge-utils";
const app = createApp({ apiKey: "12345", });
const sessionToken = await getSessionToken(app);
The tutorial Getting started with Shopify App Bridge illustrates the app-bridge part nicely but I'm unclear on the "app-bridge-utils" part.
Thanks
Solved! Go to the solution
This is an accepted solution.
@CaveDiverI found it!
On a whim, I tried adding another script based on the naming of their import.
<script src="https://unpkg.com/@shopify/app-bridge-utils@2"></script>
window['app-bridge-utils'].getSessionToken(app).then(token => ...)
Shopify's reliance on old-fashioned build tools is short-sighted, and their insistence on marketing-style documentation instead of formal is not helpful.
But at least this is solved 🙂
Bump. This hint of possible ES5 support paired with the lack of documentation is both unprofessional and baffling.
This is an accepted solution.
@CaveDiverI found it!
On a whim, I tried adding another script based on the naming of their import.
<script src="https://unpkg.com/@shopify/app-bridge-utils@2"></script>
window['app-bridge-utils'].getSessionToken(app).then(token => ...)
Shopify's reliance on old-fashioned build tools is short-sighted, and their insistence on marketing-style documentation instead of formal is not helpful.
But at least this is solved 🙂
app-bridge-utils looks like it has been deprecated because the utils moved into a utilities directory in app-bridge.
I'm a little confused on how to access that subdirectory of the app-bridge package when it doesn't appear to be exported by the top-level of app-bridge. Can anyone think of an example of how to use getSessionToken or authenticatedFetch from that sub-directory through the CDN-hosted approach? It does not seem as simple as
const authenticatedFetch = window["app-bridge"].utilities.authenticatedFetch
const authenticatedFetch = window["app-bridge"].utilities.authenticatedFetch(app)
This is an update since app-bridge-utils is deprecated.
Then you can use the const authenticatedFetch just like you would use fetch.