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

前端之家收集整理的这篇文章主要介绍了如何在nginx或apache httpd中构建angular 4应用程序?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

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

构建构建

在我的amazon ec2实例中,我运行的是apache.遵循的步骤 –

  1. #!/bin/bash
  2. yum install httpd -y
  3. yum update -y
  4. cp dist/* /var/www/html/
  5. service httpd start
  6. chkconfig httpd on

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

我的申请表 – 404未找到.

app-problem

我尝试构建像ng build –base-href.它没有用!
请帮助我如何构建这个,请注意,当我在本地使用服务时,一切都很棒.但当我尝试部署到生产时,它给出了这个错误.我非常确定在构建应用程序时我正在做的事情.

我试过Nginx docker容器,它给出了同样的错误.我的docker文件看起来像这样.

来自Nginx
COPY dist /usr/share / Nginx / html

> docker build -t ng-auth0-web-dev.
> docker run -d -p 8080:80 ng-auth0-web-dev

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

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

07002 – No error in logs,that means auth0 is working fine but I am getting build error with angular.

确切的错误

enter image description here

auth0 callback settings

更新 –

我也尝试过像这样的建筑 –
ng build –base-href http://34.213.164.54/
和ng build –base-href http://34.213.164.54:80/,但同样的错误.

所以问题是如何缩小到我如何构建Angular App

  1. public handleAuthentication(): void {
  2. this.auth0.parseHash((err,authResult) => {
  3. if (authResult && authResult.accessToken && authResult.idToken) {
  4. window.location.hash = '';
  5. this.setSession(authResult);
  6. localStorage.setItem('email',profile.email);
  7. this.verticofactoryService.registerUser(u);
  8. this.router.navigate(['/home']);
  9. });
  10. } else if (err) {
  11. this.router.navigate(['/home']);
  12. console.log(err);
  13. alert(`Error: ${err.error}. Check the console for further details.`);
  14. }
  15. });
  16. }
最佳答案
Angular应用程序是使用简单的静态HTML服务器提供服务的理想选择.您不需要服务器端引擎来动态组合应用程序页面,因为Angular在客户端执行此操作.

如果应用程序使用Angular路由器,则必须将服务器配置为在被要求提供其没有的文件时返回应用程序的主机页面(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,它终于工作了.

server conf

猜你在找的Nginx相关文章