I am currently starting a Vue SPA application to join MS PowerBI and wanted to authentication with Microsoft.

In azure portal, we registered an application client as SPA and we gave http://localhost as redirect URI.

Then, on my view app, I run this code:

const formUrl = `https://login.microsoftonline.com/${values.tenantId}/oauth2/v2.0/authorize`
  const params= {
    client_id: values.clientId,
    redirect_uri: "http://localhost:3000",
    response_type:"code",
    response_mode:"query",
    scope:"https://analysis.windows.net/powerbi/api/.default",
    state:"mystate",
    prompt: "consent"
  }
  const url = new URL(formUrl)
  Object.keys(params).forEach(k => url.searchParams.set(k, params[k]))
  window.location=url.href ;

However, the login page always answers AADSTS900971: No reply address provided.

What can I do?

As asked in the comments, here is the configuration of my SPA