I have just deployed my Angular project inside a Docker Container. Path for me to access to the site is: localhost:4200, because on my machine is listening on 4200, but inside the container is listening at port 80. I'm using Angular routing, here's the file:
const routes: Routes = [
{ path: 'Login', component: LandingPageComponent},
{ path: '', component: AppComponent},
{ path: 'Home', component: BlogHomeComponent, canActivate:[AuthGuard],
children:[
{ path: '', component: BlogHomeComponent},
{ path: "Posts", component: PostsComponent},
{ path: 'NewPost', component: CreatePostComponent},
{ path: 'Post/:id', component: SinglePostComponent}
]}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
This is, instead, my AuthGuard:
@Injectable({
providedIn: 'root'
})
export class AuthGuard {
constructor(private authService: AuthService, private route: Router){}
canActivate():boolean {
if(this.authService.isLoggedIn() == true){
return true;
} else {
this.route.navigateByUrl("");
return false;
}
}
}
It should check everytime I try to access routes if I'm logged. And it works fine when I run the app from consolde (without docker). Everytime I try to access a path, it checks if I'm logged, and when I'm not it throws me directly to the Login page. But this is not working when I deployed the app inside the docker container. When I go to a page I'm not allowed to, I get this error in the browser:
Why that? If I go to the exact same link (localhost:4200/Home/Posts) when I'm running it from angular cli (with ng server), it actually push me back to the login if I'm not logged into.
EDIT
Here is the Dockerfile of the Angular project:
FROM node:latest as node
WORKDIR /app
COPY . .
RUN npm install
RUN npm run build --prod
FROM nginx:alpine
COPY --from=node /app/dist/front-end-blog-demo /usr/share/nginx/html
And here's the Docker-compose file, because I'm running with docker-compose both backend and frontend:
version: "3.8"
services:
frontend:
build: ./FrontEnd-BlogDemo
ports:
- 4200:80
backend:
build: ./BackEnd-BlogDemo
ports:
- 8080:80