Angular 5 路由问题 [英] Angular 5 routing issue

查看:27
本文介绍了Angular 5 路由问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的前端应用程序使用 Angular 5,服务器端应用程序使用 Java.我有 Angular 路由的问题.

I am using Angular 5 for my frontend application and Java for the server side stuff. I have an issue with Angular routing.

我的问题是:

当用户在他的浏览器 URL 栏中输入此 URL http://example.net/public/public-data 并按回车键时,他会得到 404.由于这个请求的资源在服务器上不可用,所以为了解决这个问题,我编写了 .htaccess 文件,该文件将每个请求重定向到 index.html 页面.

When a user enters this URL http://example.net/public/public-data in his browser URL bar and hits enter he gets 404. Because of this requested resource is not available on the server so to deal with this problem I have written .htaccess the file which redirects each and every request to the index.html page.

经过这次更改,404 问题解决了,但我面临一个新问题,

After this change, the 404 problem is solved but one new problem I am facing,

新的问题是:当用户点击http://example.net/public/public-data 他被重定向到index.html 页面,现在不知道他请求的是哪个页面本来.

The new problem is: When a user hits http://example.net/public/public-data he gets redirected to index.html page, now I don't know which page he has requested originally.

如何知道原始网址?

编辑

这是我的.htaccess文件的代码

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule (.*) index.html [QSA,L]
</ifModule>

注意

我正在使用子文件夹,例如,http://example.net/public/public-data 这里的 public 是我的子文件夹,我的 Angular 应用程序代码放置在其中.并且 http://example.net 包含一些与我的 Angular 应用程序没有任何连接的 .php 文件.

I am using subfolders, for example, http://example.net/public/public-data here public is my subfolder in which my Angular app code is placed. And http://example.net contains some .php files which do not have any connection with my Angular app.

推荐答案

删除 .htaccess 代码并使用

Remove that .htaccess code and make use of <base href="/public/">

您的 .htaccess 将始终检查 index.html 以外的路径并重定向到该路径.

Your .htaccess will always check for the path other than index.html and redirect to it.

index.html

<head>
<base href="/public/">
<!-- Rest of your code here -->
</head>

这篇关于Angular 5 路由问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆