fix: adding action to fetch token from unified shell

Adobe-Marketing-Cloud · Oct 6, 2024 · 397a632 · 397a632
1 parent db5fcfb
commit 397a632
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 51 deletions.
diff --git a/web-src/assetDetails.html b/web-src/assetDetails.html
@@ -6,6 +6,7 @@
     <title>Asset Detail</title>
     <link rel="stylesheet" href="./assetDetails.css"> <!-- Adjust path as needed -->
     <link rel="stylesheet" href="https://use.typekit.net/dil4fkj.css">
+    <script src="./src/index.js" type="module"></script>
 </head>
 <body>
 <h1 class="asset-details-title">Asset Details</h1>

diff --git a/web-src/assetsUsageReport.html b/web-src/assetsUsageReport.html
@@ -6,6 +6,7 @@
     <title>Assets Usage Report</title>
     <link rel="stylesheet" href="assetsUsageReport.css">
     <link rel="stylesheet" href="https://use.typekit.net/dil4fkj.css">
+    <script src="./src/index.js" type="module"></script>
 </head>
 <body>
 <div class="assets-usage-report">

diff --git a/web-src/src/assetDetails.js b/web-src/src/assetDetails.js
@@ -1,4 +1,7 @@
 const defaultThumbnail = require('../no-image.png');
+import { getState } from './index.js';
+
+let accessToken;
 (async () => {
   // eslint-disable-next-line no-undef
   const queryParams = new URLSearchParams(window.location.search);
@@ -9,6 +12,14 @@ const defaultThumbnail = require('../no-image.png');
     const jsonString = decodeURIComponent(encodedJsonString);
     data = JSON.parse(jsonString);
   }
+
+  try {
+    let state = await getState();
+    accessToken = state.imsToken;
+
+  } catch (error) {
+    console.log(error);
+  }
   init(data);
 
   function init(data) {
@@ -114,7 +125,13 @@ const defaultThumbnail = require('../no-image.png');
         });
         pageDiv.appendChild(viewDetail);
         pagesSection.appendChild(pageDiv);
-        fetch(`https://288650-edsassettracker-stage.adobeio-static.net/api/v1/web/EDS-Asset-Tracker1/fetchList?hlxUrl=${hlxUrl}`)
+        fetch(`https://288650-edsassettracker-stage.adobeio-static.net/api/v1/web/EDS-Asset-Tracker1/fetchList?hlxUrl=${hlxUrl}`, {
+            method: 'GET', // or 'POST' if you want to send data
+            headers: {
+              'Authorization': `Bearer ${accessToken}`, // Send the access token in the Authorization header
+              'Content-Type': 'application/json' // Specify the content type as JSON
+              }
+            })
             .then(response => response.json())
             .then(data => {
               console.log(data.payload.pageDetails[page].tags);

diff --git a/web-src/src/assetsData.js b/web-src/src/assetsData.js
@@ -1,21 +1,12 @@
 import { PublicClientApplication } from './msal-browser-2.14.2.js';
+import excApp, { init } from '@adobe/exc-app';
+
+import { getState } from './index.js';
 
 var defaultThumbnail = require('../no-image.png');
 let accessToken;
-let connectAttempts = 0;
-(async () => {
 
-  const sp = {
-    clientApp: {
-      auth: {
-        clientId: '2b4aa217-ddcd-4fe0-b09c-5a472764f552',
-        authority: 'https://login.microsoftonline.com/fa7b1b5a-7b34-4387-94ae-d2c178decee1',
-      },
-    },
-    login: {
-      redirectUri: '/spauth.html',
-    },
-  };
+(async () => {
 
   // Create mask and spinner elements
   const mask = document.createElement('div');
@@ -34,43 +25,13 @@ let connectAttempts = 0;
   const pagePath = queryParams.get('pagePath');
   let data = {};
   async function connectAndFetchData() {
-    const publicClientApplication = new PublicClientApplication(sp.clientApp);
-    const accounts = publicClientApplication.getAllAccounts();
-
-    if (accounts.length === 0) {
-      // User is not logged in, show the login popup
-      await publicClientApplication.loginPopup(sp.login);
-
-    }
-
-    const account = publicClientApplication.getAllAccounts()[0];
-    const accessTokenRequest = {
-      scopes: ['files.readwrite', 'sites.readwrite.all'],
-      account,
-    };
 
     try {
-      const res = await publicClientApplication.acquireTokenSilent(accessTokenRequest);
-      accessToken = res.accessToken;
+      let state = await getState();
+      accessToken = state.imsToken;
+
     } catch (error) {
-      // Acquire token silent failure, and send an interactive request
-      if (error.name === 'InteractionRequiredAuthError') {
-        try {
-          const res = await publicClientApplication.acquireTokenPopup(accessTokenRequest);
-          accessToken = res.accessToken;
-          console.log(accessToken);
-        } catch (err) {
-          console.error(`Cannot connect to SharePoint: ${err.message}`);
-          document.body.removeChild(mask);
-          document.querySelector('.assets-usage-report').style.display = 'block';
-          return; // Exit if token acquisition fails
-        }
-      } else {
-        console.error('Error acquiring token silently:', error.message);
-        document.body.removeChild(mask);
-        document.querySelector('.assets-usage-report').style.display = 'block';
-        return;
-      }
+      console.log(error);
     }
 
     // Proceed if we have a valid access token

diff --git a/web-src/src/index.js b/web-src/src/index.js
@@ -103,8 +103,7 @@ window.onload = () => {
     // fallback mode, run the application without the Experience Cloud Runtime
   }
 
-  console.log("I am in console");
-  //showActionsList()
+  showActionsList()
   document.getElementById('actionForm').onsubmit = (event) => {
     event.preventDefault()
     setTimeout(doSubmit, 1)
@@ -120,7 +119,6 @@ function initRuntime () {
   // ready event brings in authentication/user info
   runtime.on('ready', ({ imsOrg, imsToken, imsProfile, locale }) => {
     // tell the exc-runtime object we are done
-    console.log(imsToken);
     runtime.done()
     state = { imsOrg, imsToken, imsProfile, locale }
     console.log('exc-app:ready')
@@ -205,3 +203,10 @@ async function invokeAction (action, _headers, _params) {
   const result = await actionWebInvoke(action[1], headers, params)
   return result
 }
+
+export async function getState() {
+  while (!state.imsToken) {
+    await new Promise(resolve => setTimeout(resolve, 100));
+  }
+  return state;
+}