Adding Auth0 to .NET Core gives me a 404 (Not Found)

recently added Auth0 to my .NET core app GitHub - aindriu80/Vega: ASP.NET Core website with Angular and EF Core and I’m getting some errors that I can’t fix. My project won’t load in the browser:

  1. Failed to load resource: the server responded with a status of 404 (Not Found)

  2. Unhandled Promise rejection: Failed to load app.component.html ; Zone: ; Task: Promise.then ; Value: Failed to load app.component.html undefined

I followed the steps on installed the auth0.js library and the API is working - I can retrieve API (checked on Postman) but I cannot load the site on my browser when I run it. One thing I had to change was →

In index.cshtml I had to remove (or placed an X before asp)

Because I was getting an error :

Exception: Call to Node module failed with error: Prerendering failed because of error: TypeError: require is not a function

This is my auth.service.ts

import { Auth0Lock } from 'auth0-lock';
// src/app/auth/auth.service.ts

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';
import 'rxjs/add/operator/filter';
import auth0 from 'auth0-js';

export class AuthService {

    auth0 = new auth0.WebAuth({
        clientID: 'smlkRNkeVFWJUpu9l9w6rVf2ShJLYoNT',
        domain: '',
        responseType: 'token id_token',
        audience: '',
        redirectUri: 'http://localhost:4200/callback',
        scope: 'openid'

    constructor(public router: Router) {}

    public login(): void {


It looks like the directory structure is all wrong.
GET http://localhost:5000/app.component.html 404 (Not Found)

What is causing the problem
![Failed to load resource: the server responded with a status of 404 (Not Found)][1]

This does not really seem to be related to Auth0 as such, but rather an case of your ASP.NET Core application not serving the Angular application properly. Does it actually work at all when you remove Auth0 from the equation completely?

It was working before I added it, The Auth0 API also worked but when I tried to add a logon feature I started getting the errors. I’m removing the Auth0 now but I’m getting other errors like

external “vendor_64a239d…”?aba7:1 Uncaught ReferenceError: vendor_64a239d6942c40a72cd8 is not defined

I don’t think I have all of it gone because If I put back the pre render on index.cshtml I get

An unhandled exception occurred while processing the request.

Exception: Call to Node module failed with error: Prerendering failed because of error: Error: [HMR] Hot Module Replacement is disabled.

Thing is that those errors you are getting seems to indicate that the ASP.NET Core application is not able to serve up the Angular related files properly. Which is why I am saying this does not appear to be related to Auth0 at all.

Perhaps you changed something else when you integrated Auth0 into the appliction?

Also, is there a specific reason you are mixing your Angular frontend with your ASP.NET API backend? Why not have them completely separate?

Another thing, this appears to be the Microsoft.AspNetCore.SpaTemplates templates you are using, right? Maybe asking on their GH repo may also be helpful

I just rolled back to my previous version without Auth0 and it is working fine (bar running a npm install undercore line). Problem is with Auth0. The instructions to get it working with Angular 2 are not very clear. I have to say I’m having a lot of trouble with your service.

Project is run on a .NET Core project with Angular front end and API end points.

This is strange, since the error messages are not related to Auth0 at all.

In any case, I am not too familiar with Angular. Let’s see if someone else can chirp in who is more familiar with it to help you

I have the same problem as aindriu80. My Angular 2 and .NET core application was working fine. This was created from the instructions at: [dotnet new] Angular Single Page Application – Setup and How The Template Works – A Journey In .NET Core
(There is a type at the above website: “dotnew new angular” should be “dotnet new angular”
![alt text][1]

Then I followed the instructions at: Auth0 Angular SDK Quickstarts: Login
I implemented the steps up to and including 'Checkpoint: Try calling the login method from somewhere in your application.
When I now run the website, I get the following error:
“Exception: Call to Node module failed with error: Prerendering failed because of error: TypeError: require is not a function”

![alt text][2]

I suspect that this is not an auth0 problem, but adding auth0 highlights the problem.

stephen.webb does your app still run if you disable prerender in views\home\index.chtml ?
to disable → put an X in front of asp

<app xasp-prerender-module="ClientApp/dist/main-server">Loading...</app>
1 Like

@aindriu80 I have remove the line. This leads onto a lot of problems starting with:
AppComponent_Host.html:1 ERROR Error: The selector “app” did not match any elements

@aindriu80 and @stephen.webb

I played around with this a bit today, but sadly I am also running into all sorts of strange issues. And once I fix one error, I get a new error. I will continue to play around with this but the prognosis is not too good at this stage.

One question however which I already asked:
Is there a specific reason you cannot use a standalone Angular application (using the Angular CLI)?

This is a scenario that we know works.

Also, using server rendered Angular app is creating other issues in my mind. For one, the OAuth flow being used for Single Page applications is the Implicit Grant flow ( which means that the id_token and access_token will be passed in a hash fragment.

Now, if you use a server rendered Angular app, I am not sure that this will even work, since the hash fragment will not be available.

So even once we can get past some of these other issues, I am not sure how this will work, because you will be trying to use a client side authorization flow with what is in effect a server side application.

@jerrie1 @aindriu80
I have decided to go down the route of a standalone Angular application using the CLI. (I was just hoping for a quick win with the starter project mentioned above)
Thanks for your help.

I think this is the better route - to keep your client application(s) separate from your Backend API.

BTW, you can download and use the sample(s) from the Angular Quickstart which will give you even more of a headstart

Here is the link to the sample repo: