// query results available in ngOnInit
@ViewChild('foo', {static: true}) foo: ElementRef;
// query results available in ngAfterViewInit
@ViewChild('foo', {static: false}) foo: ElementRef;
@ContentChild(selector)
import { Injector} from '@angular/core';
import { MyService } from './my.service';
const injector = Injector.create([MyService]);
myService = injector.get(MyService);
componentInstance.injector
Node Injector (Element Injector) Tree
const injector = Injector.create([MyService]);
const childInjector = Injector.create([MyService], injector);
childInjector.get(MyService) !== injector.get(MyService)
Token
Recipe |
{
}
InjectionToken<UserService>(‘UserService_TOKEN’, {
providedIn: ‘root’
factory: () => new UserService()
});
, multi
ExpressionChangedAfterItHasBeenCheckedError
Cases:
Solution:
ng add @angular/pwa
Authorization based on JWT
JSON Web Token
Can you spot security issue here?
export class TokenInterceptor implements HttpInterceptor {
constructor(public auth: AuthService) { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
request = request.clone({
setHeaders: {
Authorization: `Bearer ${this.auth.getToken()}`
}
});
return next.handle(request);
}
}
Post Data with malicious code
Store
Fetch
Open App
Get malicious code
Check
Sanitization out of box:
bypassSecurityTrust*
$save_text = str_replace('script', 'span', $text);
<ScRiPt>/* bad things happen here */</ScRiPt>
<INPUT TYPE="IMAGE" src="javascript:/* ... */;">
<imgsrc="xss.png" onerror="/* bad things happen here */">
login
action
bad action
done
done!
login
action
bad action
done
Token:
==
Token: ...
NO ACCESS!
!= ...
event-stream v3.3.6
right9ctrl
event-stream v4.0.0
flatmap-stream v0.1.1
flatmap-stream v0.1.0
event-stream v3.3.5
flatmap-stream v0.1.1
require("crypto").decrypt("aes256", data, npm_package_description);
copay-dash
if(!/build\:.*\-release/.test(process.arg[2])) return;
npm run-script command
"build:ios-release": "run-s env:prod && ionic cordova build ios --release"
inject malicious payload to steal private keys from wallet
npm audit
request HTTP page
redirect to HTTPS
request HTTPS page
HTTPS response
95% of HTTPS servers vulnerable to trivial MITM attack
request HTTP page
redirect to HTTPS
request HTTPS page
HTTPS response
request HTTP page
HTTP response
HTTPS → HTTP
login
steal
credentials
login HTTPS
HTTPS response
HTTP response
request HTTP page
redirect to HTTPS
request HTTPS page
HTTPS response
with Strict-transport-security header
another day
user requests HTTP page