我正在尝试配置auth0 API。最后我做到了,昨天它有效。今天它不是 - 但我没有改变任何代码 - 我在WebStorm中有文件历史记录。
看起来问题在于
构造函数(公共路由器:路由器)
这是我的配置:
@angular/cli: 1.0.0
node: 7.7.3
os: win32 x64
@angular/common: 2.4.10
@angular/compiler: 2.4.10
@angular/core: 2.4.10
@angular/forms: 2.4.10
@angular/http: 2.4.10
@angular/platform-browser: 2.4.10
@angular/platform-browser-dynamic: 2.4.10
@angular/router: 3.4.10
@angular/cli: 1.0.0
@angular/compiler-cli: 2.4.10
auth.service.ts
import { Injectable } from '@angular/core';
import { tokenNotExpired } from 'angular2-jwt';
import { myConfig } from './auth.config';
// Avoid name not found warnings
declare var Auth0Lock: any;
@Injectable()
export class Auth {
// Configure Auth0
lock = new Auth0Lock(myConfig.clientID, myConfig.domain, {});
constructor() {
// Add callback for lock `authenticated` event
this.lock.on("authenticated", (authResult) => {
localStorage.setItem('id_token', authResult.idToken);
});
}
public login() {
// Call the show method to display the widget.
this.lock.show();
}
public authenticated() {
// Check if there's an unexpired JWT
// This searches for an item in localStorage with key == 'id_token'
return tokenNotExpired('id_token');
}
public logout() {
// Remove token from localStorage
localStorage.removeItem('id_token');
}
}
import { Router, NavigationStart } from '@angular/router';
import 'rxjs/add/operator/filter';
constructor(public router: Router) {
this
.router
.events
.filter(event => event instanceof NavigationStart)
.filter((event: NavigationStart) => (/access_token|id_token|error/).test(event.url))
.subscribe(() => {
this.lock.resumeAuth(window.location.hash, (error, authResult) => {
if (error) return console.log(error);
localStorage.setItem('id_token', authResult.idToken);
this.router.navigate(['/']);
});
});
}
这是控制台抛出的内容:
ERROR in C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,26): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,36): ';' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,1): Cannot find name 'constructor'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,13): Cannot find name 'public'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): Cannot find name 'router'.
ERROR in C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,26): ',' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,36): ';' expected.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,1): Cannot find name 'constructor'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,13): Cannot find name 'public'.
C:/xampp/htdocs/untitled/SmartHome/src/app/auth.service.ts (40,20): Cannot find name 'router'.
ERROR in ./src/app/auth.service.ts
Module parse failed: C:\xampp\htdocs\untitled\SmartHome\node_modules\@ngtools\webpack\src\index.js!C:\xampp\htdocs\untitled\SmartHome\src\app\auth.service.ts The keyword 'public' is reserved (44:12)
You may need an appropriate loader to handle this file type.
| import { Router, NavigationStart } from '@angular/router';
| import 'rxjs/add/operator/filter';
| constructor(public, router, Router);
| {
| this
@ ./src/app/login/login.component.ts 11:0-39
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
webpack: Failed to compile.
任何人都可以帮忙吗?
答案 0 :(得分:3)
这段代码错了:
import { Router, NavigationStart } from '@angular/router';
import 'rxjs/add/operator/filter';
constructor(public router: Router) {
this
.router
.events
.filter(event => event instanceof NavigationStart)
.filter((event: NavigationStart) => (/access_token|id_token|error/).test(event.url))
.subscribe(() => {
this.lock.resumeAuth(window.location.hash, (error, authResult) => {
if (error) return console.log(error);
localStorage.setItem('id_token', authResult.idToken);
this.router.navigate(['/']);
});
});
}
错误消息:
| import { Router, NavigationStart } from '@angular/router';
| import 'rxjs/add/operator/filter';
| constructor(public, router, Router);
| {
| this
因此构造函数必须属于一个类,而不是独立的。
例如:
export class YouClassService {
constructor(public router: Router) {}
}