angularjs - 在 aws ec2 ubuntu 16.04 上部署 angular 6 时的路由问题
问题描述
我创建了平均堆栈应用程序并使用 ubuntu 16.04 将其上传到 AWS Ec2 服务器上。现在,当我访问我的链接“ http://xx.xxx.xx.xx:4200 ”时,它可以正常工作并打开“ http://xx.xxx.xx.xx:4200/login ”。但是,当我尝试重新加载或输入“ http://xx.xxx.xx.xx:4200/userhome ”或“ http://xx.xxx.xx.xx:4200/login ”时,它会给我 404 错误。此外,登录后注销不起作用。当我使用“ng serve”时,所有项目都运行良好我已阅读此内容:https ://angular.io/guide/deployment 。我已经在我的文件夹中创建了“.htaccess”文件,但仍然是同样的问题。
我在 StackOverflow 上阅读了许多解决方案,但似乎没有一个对我有用。我想我错过了或没有正确执行某些步骤。我无法设置这个 .htaccess。
请参见下面的 .htaccess 文件代码
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html
我在 apache.conf 中添加了以下代码
<Directory "/var/www/html">
Options Indexes FollowSymLinks
AllowOverride All
Require all granted
</Directory>
请参阅 app-routing.module.ts
import { NgModule } from '@angular/core';
import {Routes, RouterModule} from '@angular/router';
import { LoginComponent } from './login/login.component';
import { RegisterComponent } from './register/register.component';
import { UserhomeComponent } from './userhome/userhome.component';
import { DriverComponent } from './driver/driver.component';
const routes:Routes = [
{path:'',redirectTo:'login',pathMatch:'full'},
{path:'login',component:LoginComponent},
{path:'register',component:RegisterComponent},
{path:'userhome',component:UserhomeComponent},
{path:'driver',component:DriverComponent}
];
@NgModule({
imports:[RouterModule.forRoot(routes)],
exports:[RouterModule]
})
export class AppRoutingModule { }
我使用 'http://xx.xxx.xx.xx:4200/' 作为我的 url 项目放在 'var/www/html'
请在这方面帮助我!谢谢
解决方案
您需要配置所有不是文件或目录的东西,都将被重定向到主 index.html 文件......然后角路由将完成剩下的工作
如果您使用 apache 添加 .htaccess 文件和那些行,
如果您使用 nginx,那么您需要通过 SSH 登录到服务器并更新 nginx conig
在路径:/etc/ngins/sites-enabled/{THE_CONFIG_FILE}
不要忘记重启nginx服务
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule (.*) index.html [L,R]
推荐阅读
- reactjs - 如何将项目 (React) 从公共沙箱导入到本地项目文件夹?
- .net - 从 Internet 下载 URL 中具有特定日期时间的图像
- go - 记录未处理的 Golang 恐慌
- performance - 程序运行时分析中“冷点”与“热点”的定义是什么?
- r - 在 R 中操作向量和数据框
- c# - 日期格式 Windows 10 v.1703 的问题 CreateProcessWithLogonW
- sql-server - JOIN 共享相同主键的多个表
- java - AWS Lambda Java 应用程序
- xamarin - FFImageLoading, SVGCachedImage 从绑定设置 HeightRequest/WidthRequest 时模糊
- node.js - 无法在 Cloud9 中使用 Node.js 获得 Hello World