JS Function returns the value before promise resolves

Question

I want to block the function from returning value before promise resolves. And, pushheaders returns an promise obj instead of just value,

i just want pushheaders to return token which fetched from the firebase

import firebase from 'firebase';

let promise1 = new Promise((resolve, reject) => {
    firebase.auth().currentUser.getIdToken().then(token => {
      resolve(token);
    }).catch(err => {
      reject(err)
    });
});


export function pushHeaders (ct) {
  let b = await promise1.then(data => data);
  let headerz = {
    headers: {
      Authorization: 'Bearer ' + b,
  
    }
  }
  ct ? (headerz.headers['Content-Type'] = ct) : null; 
  return headerz;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.6.2/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/15.6.2/react-dom.min.js"></script>

Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Jared Smith, Feb 15 '19 at 13:56
`await promise1.then(data => data)` is an anti-pattern; replace with `await promise1` — Mulan, Feb 15 '19 at 14:49

Sylwester · Answer 1 · 2019-02-15T09:55:48.887

2

There is no way to synchronize promises so with await your function needs to be async:

export async function pushHeaders(ct) {
    const token = await promise1; // no need for a noop
    const headers = {
        headers: {
            Authorization: `Bearer ${token}`,
            ...(ct ? { 'Content-Type': ct } : {}), // ECMAScript2018
        },
    };
    return headers;
}

This also means that it returns a promise and not headers directly. To get the actual result you either need to use then or use asycn/await again on the callee.

edited Feb 15 '19 at 09:55

answered Feb 15 '19 at 09:46

Sylwester

47,942
4
47
79

Sir, Is there is any other way with which i can get headers directly instead of putting then in callee. Because i have 100s of callee. Changing all would kill time – sundar Feb 15 '19 at 10:00
@sundar Not really. If you call this 100 places I think your abstractions can be better. – Sylwester Feb 15 '19 at 11:14

score 0 · Answer 2 · answered Feb 15 '19 at 08:42

0

I see you are using await, which is a typescript keyword, which is only allowed when you mark your function with Async, try that

export async function pushHeaders (ct) {

answered Feb 15 '19 at 08:42

Mocas

1,403
13
20

`async`/`await` is in standard in JS conforming to ECMAScript 2017 and later. – Sylwester Feb 15 '19 at 09:51
Thanks, but you just posted an answer that matches mine, where is the value in that? – Mocas Feb 15 '19 at 13:03
My answer mentions elements of you answer, but it does add value as well. Just doing your suggestion doesn't really help alone. – Sylwester Feb 15 '19 at 14:00
What else that is needed to be done as well as marking the function as async, that you mentioned and I didn't? – Mocas Feb 15 '19 at 15:24
Well. I mention that he needs to alter the callees since he obviously didn't anticipate it returning promises. – Sylwester Feb 15 '19 at 22:03

JS Function returns the value before promise resolves

2 Answers2