Hi, this is a very interesting product 
In the past I used also LightSwitch, but as we all know, that is end of life.
So, who is Radzen? The people? The Company?
Is it opensource?
What is the support you can deliver?
Hi,
Thanks for reaching out!
Radzen Ltd. is small Bulgarian company founded in April 2016 by ex-Telerik employees who created the popular Kendo UI and NativeScript frameworks. The Radzen product has been in development for more than a year and a half now and was officially released in April 2017. The team has experience with a lot of front-end technologies (both web and native), and has successful track record with shipping products that people love.
Radzen is not open source software. There is one important thing to note though. Any application created with Radzen can be built and run using open source tools that are available free of charge - Angular, Bootstrap, .NET Core and NodeJS.
We value our customer interactions a lot and do our best to answer questions and address issues as soon as humanly possible. The time spent in Telerik has taught us that customer satisfaction is what matters the most at the end of the day.
Let me know if there is anything else you would like to know about the company, product or the people behind it! 
Regards,
Atanas,
the Radzen team
1 Like
tx @korchev
if it is not open source, do you plan to make it extensible?
Like for example the VSCode extensions.
For example, one i could think of:
- An extension to write our own code generations (e.g. the other post about rz-array-form-field).
- Or to extend the authentication custom logic (e.g. using adal or msal for authenticating against azure ad)
Yes, we do have extensibility in mind. The API still isn’t very clear in our minds but we are working on it.
BTW the second thing (custom authentication logic) is something which Angular should allow even now - to replace an existing service with a new one at dependency injector level. If you are interested I can try to prepare some code example.
That would be nice @korchev
In my current ng projects I use this library: https://github.com/benbaran/adal-angular4 to authenticate against azure ad.
This a ng wrapper around adal.js
Here is a snippet (untested) which shows how to replace the OAuth service which Radzen generates
/* app.module.ts */
import {NgModule, Injectable} from '@angular/core';
import {
AppImports,
AppComponent,
AppDeclarations,
AppProviders
} from './app.module-generated';
import {MyDataAuthorizationService} from './my-data-auth.service';
@Injectable()
class CustomAuthorizationService extends MyDataAuthorizationService {
constructor(private service: Adal4Service) {
/*
Not sure if adal-angular4 will handle the callback here -
if not try in ngOnInit of one of the components
*/
service.handleWindowCallback();
}
get token(): string {
if (!this.service.userInfo.authenticated) {
this.service.login();
}
return this.service.getCachedToken();
}
}
@NgModule({
declarations: [...AppDeclarations],
imports: [...AppImports],
providers: [
...AppProviders,
/* override the OAuth service */
{
provide: MyDataAuthorizationService,
useClass: CustomAuthorizationService
}
],
bootstrap: [AppComponent]
})
export class AppModule {}
1 Like
I’m struggling with getting the access tokens in the right way
In adal you have the token for the id (as a user who authenticate against azure ad, or another authentication provider)
And second you request an access token (authorization) for one or more resources (e.g. https://graph.microsoft.com,…).
In your sample you check if the user is authenticated. But that doesn’t mean the user has an access token for a resource.
The token can be retrieved by calling the ‘acquireToken(myresource,…)’ function on the adal implementation for anguler. But that is an observable.
So I think it would better to rework the token() function as an observable (or await async implementation?) and combine it with the ‘http.request’ observables in the generated code.
Does that make any sense?
What you are describing seems to be the OAuth code grant. Radzen currently supports only the implicit grant. There seems to be a way to allow the implicit grant in Azure (not sure if this is an option for you though).
In order to support the code grant we have indeed to change the whole implementation of the services that Radzen produces. Unfortunately that’s a lot of work and won’t happen soon.
I have a question. Is your service OData? If yes - is its $metadata endpoint available without authentication? If yes Radzen should be able to infer it and allow you to use it in design time. At runtime you can follow the adal-angualr4 example and use the Adal interceptor to set the authorization header. I would have tried that myself but I don’t have immediate access to an Azure AD protected resource.
No I’m not using code grant, i’m using implicit grant, because that is best practise for spa applications
The questions are more generic, it can be a more specific odata end point, but also simple rest endpoint.
The adal-agular4 example is the case where the client and endpoint are the same. But it is more common to have client (the spa app) and the end point(s) in two different domains. See also this doc
So it is common that the spa app has more than one endpoint, and every endpoint will need an access token.
For example, an app that calls the msgraph endpoint (https://graph.microsoft.com) and the Office 365 Sharepoint Online api (e.g. mysite.onmicrosoft.com/_api/web/…) needs to access tokens.
adal is build for that (cfr endpoints settings)
Of course adal is not requesting an user login for every endpoint. But only once for your identity (and possible the first access token).
The access to the endpoint are defined in azure add with the app.
When the app calls the endpoint, and suppose there is no access token yet, then a hidden iframe is injected to request an access token to the sts server.
The same process happens when the token is expired, a hidden iframe is injected to renew the token, without user interaction.
About the metadata, you can indeed get the metadata for msgraph without authentication: https://graph.windows.net/GraphDir1.OnMicrosoft.com/$metadata?api-version=1.6
I’m not sure if it is for all public microsoft api’s.
In the meantime, I think it would be enough if adding the bearer header in an angular interceptor.
By example, this is a generated code snipped from radzen, but changed for HttpClient instead of Http:
export class MsGraphService {
basePath = environment.msGraph;
constructor(private http: HttpClient, private auth: MsGraphAuthorizationService) {
}
me() {
const headers = new Headers();
headers.append('Accept', 'application/json');
return this.http.get(Location.joinWithSlash(`${this.basePath}`, `/beta/me`))
.map(response => {
return ....;
}
})
}
And then using the interceptor logic to add the bearer token, like this:
@Injectable()
export class Adal4Interceptor implements HttpInterceptor {
constructor(public adal4Service: Adal4Service) { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return this.adal4Service.acquireToken(this.service.GetResourceForEndpoint(request.url)).flatMap((token) => {
request = request.clone({
setHeaders: {
Authorization: `Bearer ${token}`
}
});
return next.handle(request);
});
}
}
In this way, the correct token is received for the calling endpoint
The interceptor can also handle 401’s, etc…
nb: code above is not testen nore complete
Hi Bart,
It seems Azure AD has a bit different interpretation for OAuth implicit grant. The scenario you are describing (calling the Graph API and SharePoint Online) uses a mix of implicit and code grant (getting a token from an API instead of the redirect URL isn’t implicit grant IMHO).
You are right that we have to change the code Radzen generates in order to benefit from HttpInterceptors. It has to use HttpClient instead of Http. I will update this thread once this is done.
Hi korchev
Maybe my explanation is not 100% accurate, but azure authentication server is serving standard oauth 2.0, but you are right, it is an addition to oauth 2.0.
This is a snipped from the book Modern Authentication with Azure Active Directory for Web Applications from Vittorio Bertocci.'
For example the uri to the authorization server looks like this:
where &resource is the endpoint you need access to
if you have anything in preview for the authentication part, ready to test, just give me an email.
I’m eager to test for you.
@bartnetjs I have a build ready which uses HttpClient instead of Http and can potentially support the implementation that relies on HttpInterceptors.
Let me know if I can help with anything else.
1 Like
working great @korchev
this is the interceptor:
@Injectable()
export class Adal4Interceptor implements HttpInterceptor {
constructor(public adal4Service: Adal4Service) { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return this.adal4Service.acquireToken(this.adal4Service.GetResourceForEndpoint(request.url)).flatMap((token) => {
request = request.clone({
setHeaders: {
Authorization: `Bearer ${token}`
}
});
return next.handle(request);
});
}
}
nb: I have a page reload when the hash is removed from the uri, but I think it an issue with adal-angular4
Glad it worked.
Re: page reload - did you override the security service that Radzen generated as per my response? If yes then probably adal-angular4 is causing the reload. And I think I know why it does it - to avoid confusing the Angular router considering the hash a parameter and trying to resolve a route from it.
MSGraph and OAuth2 are on my short list of things to try in Radzen. Would love to see a ‘How To’ article about this.
Thanks in advance and keep up the great work!
Hi @joshbooker
I will post an example project in github when it works flawless
I have a working sample project, but with a reload issue in the adal-angular4, see my previous post/link
I am just posting an update that Radzen supports Azure AD out of the box. We also have a few resources about using MSGraph:
I hope this helps.
1 Like