Debugging the server sent jpg

web-service/client/src/Streams.js

@@ -30,12 +30,29 @@ const Streams = ({clearCookies}) => {
     }
 
     const renderThumbnails = async () => {
+        //updates all available thumbnail URIs
         const thumbs = await fetchThumbnails()
-        console.log('before', thumbnails)
         setThumbnails((thumbs));
-        console.log('after', thumbnails)
-        return thumbnails
+        console.log(thumbnails[0]);
+        //Problem possibly here, it doesn't encode it correctly?
+        const encodedURL = encodeURI(thumbnails[0]);
+        console.log('ENCODED URL', encodedURL);
+        try{
+            const someData = await fetch(`/stream/rgb?uri=${encodedURL}`)
+            if(!someData){
+                throw new Error('Vitun vitun vittu');
             }
+            const myBlob = await someData.blob
+            console.log('MYBLOB', myBlob)
+            const objectURL = URL.createObjectURL(myBlob);
+            console.log('URL ', objectURL);
+        } catch(err){
+            console.log('Kurwavaara:', err);
+        }
+        
+        return thumbnails;
+    }
+
 
 
     return(
@@ -44,7 +61,7 @@ const Streams = ({clearCookies}) => {
             <h2>Namibia here we come!</h2>
             <button onClick={clearCookies}>Logout</button>
             <br/>
-            <button onClick={() => renderThumbnails()}></button>
+            <button onClick={renderThumbnails}></button>
         </div>
     )
 }

web-service/server/src/index.js

@@ -169,14 +169,14 @@ app.get('/stream/depth', (req, res) => {
 
 //app.get('/stream', (req, res))
 
-/** 
+/*
  * Route for Google authentication API page
  */
 app.get('/google', passport.authenticate('google', {
 	scope: ['profile']
 }))
 
-/** 
+/* 
  * Google authentication API callback route. 
  * Sets the JWT to clients browser and redirects the user back to front page (now has thumbnails).
  */