如何在 nginx 或 apache httpd 中构建 angular 4 个应用程序?

How to build angular 4 apps in nginx or apache httpd?

您好,我正在尝试构建 Angular 4 应用程序,接下来的步骤如下 -

建造ng build

在我的 amazon ec2 实例中,我 运行ning apache。遵循的步骤 -

#!/bin/bash
yum install httpd -y
yum update -y
cp dist/* /var/www/html/
service httpd start
chkconfig httpd on

一切正常,但我的应用程序使用 auth0 进行身份验证,我看到他们回调 http://ip/callback

我的应用程序显示 - 404 未找到。

我尝试像 ng build --base-href . 那样构建,但没有用 ! Please help me how to build this one, please note that when I useng serve` 在我的本地一切都很棒。但是当我试图部署到生产环境时,它给出了这个错误。我很确定我在构建应用程序时做错了什么。

我试过nginxdocker容器,它给出了同样的错误。我的 docker 文件如下所示。

FROM nginx COPY dist /usr/share/nginx/html

  1. docker build -t ng-auth0-web-dev .
  2. docker 运行 -d -p 8080:80 ng-auth0-web-dev

上面的 docker 文件有什么问题吗?

https://github.com/auth0-samples/auth0-angular-samples/tree/master/01-Login - 示例应用程序代码

https://manage.auth0.com/#/logs - No error in logs, that means auth0 is working fine but I am getting build error with angular.

确切错误:

更新 -

我也试过这样建造 - ng build --base-href http://34.213.164.54/ng build --base-href http://34.213.164.54:80/,但同样的错误。

所以问题缩小到我如何构建 Angular 应用程序

public handleAuthentication(): void {
    this.auth0.parseHash((err, authResult) => {
      if (authResult && authResult.accessToken && authResult.idToken) {
        window.location.hash = '';
        this.setSession(authResult);
          localStorage.setItem('email', profile.email);
          this.verticofactoryService.registerUser(u);
          this.router.navigate(['/home']);
        });



      } else if (err) {
        this.router.navigate(['/home']);
        console.log(err);
        alert(`Error: ${err.error}. Check the console for further details.`);
      }
    });
  }

Angular 应用程序非常适合使用简单的静态 HTML 服务器进行服务。您不需要服务器端引擎来动态组合应用程序页面,因为 Angular 在客户端执行此操作。

如果应用程序使用 Angular 路由器,您必须将服务器配置为 return 应用程序的主机页面 (index.html) 当被要求提供它没有的文件时。

假设在你的 nginx 服务器 conf 中添加这样的东西。 try_files $uri $uri/ /index.html;

参考 - https://github.com/auth0-samples/auth0-angular-samples/tree/master/02-User-Profile

谢谢JB Nizet,终于成功了。