Handle auth + cors

web/pages/index2.tsx

@@ -3,7 +3,7 @@ import { BROADCASTER, fetchData } from './utils/apis';
 
 export default function Admin() {
   const [broadcasterStatus, setBroadcasterStatus] = useState({});
-  let getStatusIntervalId = null;
+  const getStatusIntervalId = null;
 
 
   const getBroadcastStatus = async () =>  {
@@ -12,7 +12,8 @@ export default function Admin() {
       const active = !!result.broadcaster;
 
       setBroadcasterStatus({ ...result, active });
-    } catch(error) {
+    } catch (error) {
+      
       setBroadcasterStatus({ ...broadcasterStatus, message: error.message });
     };
 
@@ -22,7 +23,6 @@ export default function Admin() {
   useEffect(() => { getBroadcastStatus(); }, []);
 
 
-  console.log("============",broadcasterStatus)
   // getStatusIntervalId = setInterval(getBroadcastStatus, 15000);
   return (
     <div>

web/pages/utils/apis.ts

@@ -31,29 +31,31 @@ export const HARDWARE_STATS = `${API_LOCATION}hardwarestats`;
 // export const STREAM_STATUS = '/api/status';
 
 export async function fetchData(url) {
-  const headers = new Headers();
   const encoded = btoa(`${ADMIN_USERNAME}:${ADMIN_STREAMKEY}`);
-  // headers.set('Authorization', `Basic ${encoded}`);
-  console.log({encoded}, `${ADMIN_USERNAME}:${ADMIN_STREAMKEY}`)
-
 
+  try {
     const response = await fetch(url, {
       headers: {
         'Authorization': `Basic ${encoded}`,
-      'Credentials': 'include',
       },
-    mode: 'no-cors',
+      mode: 'cors',
+      credentials: 'include',
     });
     // waits until the request completes...
     // console.log(response);
 
     if (!response.ok) {
+      console.log(response)
       const message = `An error has occured: ${response.status}`;
       throw new Error(message);
     }
 
     const json = await response.json();
+    console.log(json)
     return json;
+  } catch (error) {
+    console.log(error)
+  }
 }
 
 // fetch error cases