Odtnhj

There are two functions; function getThumbnail(url) and function getVimeoData() .

I'm using fetch() to handle the HTTP calls for retrieving the url of thumbnail of a video in Vimeo. oEmbed is used to fetch JSON data of a video, which contains thumbnail_url.

The functions goes as follow:

async function getVimeoThumb(videoUrl) 
 return await fetch(videoUrl)
 .then(response => 
 if (response.status !== 200) 
 console.log('Error occurred while fetching thumbnail.');
 return null;
 

 return response.json();
 )
 .then(data => return data['thumbnail_url'])
 .catch(err => console.log(err.reason));

The above function returns Promise with a value [[PromiseValue]]: "thumbnail_url". The returned Promise value is fetched in following function as:

function getThumbnailUrl() 
 let newUrl;

 ...

 getVimeoThumb(url).then(result => console.log(result))

 ...

The above function returns console log as thumbnail_url.

Hence, my question is that is there any workaround to store the fetched value thumbnail_url in my local variable newUrl?

You already have a local variable (newUrl), so where you are logging the result you can save there only

function getThumbnailUrl() 
 let newUrl;

 ...

 getVimeoThumb(url).then(result => newUrl = result; console.log(result) )

 ...

@Nitich is right. But if what you want is use newUrl out side you can try this. newUrl will be in the global scope.

 let newUrl;
 function getThumbnailUrl() 

 ...

 getVimeoThumb(url).then(result => newUrl = result; console.log(result) )

 ...
 

Or simply do

 ...

 getVimeoThumb(url).then(result => newUrl = result; return newUrl; )

 ...
 }
 let newUrl = getThumbnailUrl(videoUrl);

I hope this helps.