https://github.com/romagny13/ng2-auth0
Auth0 with Angular 2
https://github.com/romagny13/ng2-auth0
angular2 auth0
Last synced: about 2 months ago
JSON representation
Auth0 with Angular 2
- Host: GitHub
- URL: https://github.com/romagny13/ng2-auth0
- Owner: romagny13
- Created: 2017-02-27T16:32:49.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2017-04-02T10:57:47.000Z (about 8 years ago)
- Last Synced: 2025-01-29T00:52:38.423Z (4 months ago)
- Topics: angular2, auth0
- Language: TypeScript
- Size: 17.6 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Auth0 with Angular 2
## Usage
Replace clientID and domain in auth.config.ts
```
npm i
ng serve
```
go http://localhost:4200
## Memento
- Create an Auth0 account
- On the dashboard, create "new client"... then choose "single page application" and "Angular 2"
- In the settings, set an Allowed callback URL (example: http://localhost:4200)
Use Quickstart and samples code
```
npm i angular2-jwt auth0-lock -S
```
Add in index html page
```
```
Create config 'auth.config.ts' + options (login dialog box)
```js
interface AuthConfiguration {
clientID: string;
domain: string;
}
export const config: AuthConfiguration = {
clientID: '...',
domain: '...eu.auth0.com'
};
// options : https://auth0.com/docs/libraries/lock/v10/customization
export const options = {
allowedConnections: ['facebook', 'google-oauth2', 'Username-Password-Authentication'],
allowForgotPassword: true,
allowSignUp: true,
theme: {
logo: '/assets/angular.png',
primaryColor: '#C30E2E'
},
languageDictionary: {
title: 'Mon app'
},
popupOptions: { width: 300, height: 400, left: 200, top: 300 },
language: 'fr'
};
```
"AppModule"
Add AUTH_PROVIDERS to AppModule 'providers' array
```js
import { AUTH_PROVIDERS } from 'angular2-jwt';
```
Issue with Angular Cli 1.0.0 https://github.com/auth0/angular2-jwt/issues/258
```js
import { AuthHttp, AuthConfig } from 'angular2-jwt';
export function authHttpServiceFactory(http: Http, options: RequestOptions) {
return new AuthHttp(new AuthConfig({}), http, options);
}
@NgModule({
declarations: [
AppComponent,
HomeComponent,
ProfileComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
routing
],
providers: [
{
provide: AuthHttp,
useFactory: authHttpServiceFactory,
deps: [Http, RequestOptions]
},
AuthService, AuthGuard],
bootstrap: [AppComponent]
})
export class AppModule { }
```
Create AuthService, components, guard, etc.