angular - Angular 4 和 Laravel 5.4 的刷新路由问题

Question

我使用 Angular 4 和 Laravel 5.4 创建了一个简单的应用程序来执行 CRUD 操作。

所以，基本上我有一个在 localhost:4200 上运行的 Angular 应用程序和在 localhost:8000 上运行的 Laravel 应用程序(仅用于 api)

现在我已经使用

将 Angular 4 集成到 Laravel 中

 ng build

现在我的应用程序完全在 localhost:8000 上运行，完美!

现在是问题场景!

1 2 3

所以，正如你所看到的，它采用的是 Angular 路线，但是当我刷新同一页面时，它正在寻找 laravel 路线。如何解决这个问题？

Laravel routes are only using as the api for angular for data transfer in json.

我们将不胜感激您的帮助!

Answer 1

好的，这个问题已在官方 Angular 文档的部署部分中得到解决。问题是，Angular 应用程序是单页应用程序，这意味着它只有一个 index.html 文件，所有其他路由都由 Angular 浏览器客户端管理。 如果您从页面 A 转到页面 B，则您已经有一个处理重定向的 Angular 应用程序。如果您刷新，浏览器将寻址 API，该 API 不包含您请求的页面。

这意味着您需要配置您的服务器。如果您要实时部署，请使用此 .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

它只会返回要渲染的 Angular 应用程序的 index.html 文件。否则配置你的 Laravel 路由来做同样的事情。

有关此问题的更多信息请参见:Angular Deployment