[SOLVED] Return fetch api response from a function | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 2

[SOLVED] Return fetch api response from a function

How can I return the response received from fetch() api using a function and assign a function to a variable and use it's result values. Example code: fetchData = () => { fetch('https://example.com/api', { method: 'POST', body: "some-data", }) .then(response => response.json()) .then(data => { result = JSON.stringify(data); console.log('Success:', result); return result; }) .catch((error) => { console.error('Error:', error); }); } // a = compile() console.log(a.Result)

19th Oct 2020, 10:15 AM
Bibek Oli
Bibek Oli - avatar
12 Answers
+ 2
https://code.sololearn.com/WPxj5iCZsBue/?ref=app Bibek Oli all i did was put the fetch inside "new Promise((resolve, reject) => fetch(....))" and inside .then(response) of fetch() i returned resolve(response). inside .catch(err) i returned reject(err) now i can compile() and tack on .then() to it which receives response as a parameter. and yeah, i put the first line "let usercode = ...." inside the onclick function, coz we have to get the newer value onclick, not the old value when it was initialized.
19th Oct 2020, 5:19 PM
maf
maf - avatar
+ 4
You would have to make a promise, that takes resolve and reject as parameters. const fetchData = () => { return new Promise((resolve, reject) => ( fetch("https://jsonplaceholder.typicode.com/posts") .then(res => res.json()) .then(data => resolve(data)) .catch(err => reject(err)) )) } async function getData() { const data = await fetchData() console.log(data); } getData()
19th Oct 2020, 10:25 AM
maf
maf - avatar
+ 3
you would have to make an async function so that u can use "await" keyword if you dont wanna make an async function u can use .then() fetchData().then(data => { // ... })
19th Oct 2020, 10:27 AM
maf
maf - avatar
+ 3
u mean this? : fetchData().then(data => ()) data is received as a parameter because we are passing data from above, resolve(data) and if there is an error, inside catch block, we will do reject(err) so we can receive these arguments in .then and .catch respectively.
19th Oct 2020, 1:13 PM
maf
maf - avatar
+ 3
Bibek Oli well i dont know the answer to that question coz i havent tried doing that object syntax with dom elements, but there's a mistake in ur code in that question: let alertBox = { //properties have colons (:) not (=) header: document.getElementById() }
19th Oct 2020, 5:54 PM
maf
maf - avatar
+ 2
maf Thank you for your help ๐Ÿ˜๐Ÿ˜๐Ÿ˜ The final code is easier than I expected. Thank you soon much.๐Ÿ™๐Ÿฅฐ
19th Oct 2020, 5:38 PM
Bibek Oli
Bibek Oli - avatar
+ 2
Bibek Oli glad i could help :) if u still dont understand, ask again.
19th Oct 2020, 5:41 PM
maf
maf - avatar
+ 2
maf I understood itโ˜บ๏ธโ˜บ๏ธโ˜บ๏ธ Thank you.๐Ÿฅฐ If you have time, can you look at my newer question also, I didn't got any response on that.๐Ÿ˜
19th Oct 2020, 5:44 PM
Bibek Oli
Bibek Oli - avatar
+ 1
maf how is the data sent in this method, as a second parameter of fetch or??
19th Oct 2020, 11:12 AM
Bibek Oli
Bibek Oli - avatar
+ 1
maf not that, in getting confused in this, can you apply this in my real code? It is a very simple code, just focused on above topic only. So that I can understand it better.๐Ÿ™
19th Oct 2020, 1:48 PM
Bibek Oli
Bibek Oli - avatar
+ 1
This is my code, it's very simple code; https://code.sololearn.com/WikTK27SFG0N/?ref=app
19th Oct 2020, 1:58 PM
Bibek Oli
Bibek Oli - avatar
+ 1
maf ohh๐Ÿ˜‚๐Ÿ˜‚ I don't notice that, I was just making a dummy template to show an example.๐Ÿ˜
19th Oct 2020, 5:58 PM
Bibek Oli
Bibek Oli - avatar