How to properly login with database connection in a SPA?

I use Auth0.js for signin/signup in my angular2 application. User can use social networks or email/password.
So, for email/password login I use the following code:

this.auth0.client.login({
       realm: 'Username-Password-Authentication',
       responseType: 'token',
       username: credentials.username,
       password: credentials.password,
       scope: 'openid profile email'
     })

All worked fine for the last week, but today I got error

Grant type ‘http://auth0.com/oauth/grant-type/password-realm’ not allowed for the client.

I have found this question today. And, there is written:

In relation to the root cause of the actual error the explanation is that by default the resource owner password grant is not included in the allowed grant types for new client applications. Given this grant implies the capability for an application to directly exchange user credentials for tokens we did not include it by default as this should be a conscious decision from the part of the developer and should only be enabled for highly trusted clients…

So, the question is my code correct for login when I use default database or I use some deprecated things?

If all is correct then do I have to update grants for the all new clients in the future?

Saying it’s correct it’s a difficult decision to do without all the details; I’ll try to expand on this with a few assumptions in order to highlight some consideration, but in general it needs to be a decision from the client application developer as you/they can make a better informed decision.

In terms of the reason we do not include the resource owner password credentials (ROPC) grant by default, what you quoted is the main point, more specifically:

Given this grant implies the capability for an application to directly exchange user credentials for tokens we did not include it by default as this should be a conscious decision from the part of the developer and should only be enabled for highly trusted clients.

Going back to your particular use case, given your client application is a SPA, is your own application (developed by you) and it’s where users registered for your service and created their username and password credentials then it may make sense to handle the input of user credentials directly in that applications and then call the method you’re currently using.

Have in mind that for a SPA this means that the client application cannot perform client authentication when doing the ROPC grant which means anyone else can also try to call that endpoint directly as a way to exchange user credentials for tokens. They would only need the client identifier which is public and easily retrieved from the source code. Having said that, if you’re okay with this situation and other restrictions imposed by the use of that grant (for example, the grant does not establish any sort of user authenticated session at the identity provider) then you could consider what you’re doing as “correct”.

In general, the recommended approach would be to make use of the hosted login page to perform the user authentication (see the authorize method of Auth0.js) instead of the grant you’re trying to use.

Finally, if you do decide to stick with the ROPC grant then yes, you’ll need to take that under consideration when you create new clients and ensure they include that grant type.