问题标签 [hash-location-strategy]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
8 回答
89139 浏览

html - 在 Angular 6 中使用 HTML 锚链接#id

我正在使用一个 Angular 6 项目,在该项目中我禁用/删除了从 URL 中删除 # 的 hash-location-strategy。

由于此更改,链接具有:

不再工作它只是跳过当前组件 URL 并将 #contactTypes 放在 localhost 之后。

我发现这个github 问题应该使用

它将 #contactTypes 放在 URL 的末尾,但它不会滚动到浏览器的顶部。

来源:https ://github.com/angular/angular/issues/6595

0 投票
1 回答
1311 浏览

angular - 使用 HashLocationStrategy 通过 Angular 路由处理 OAuth2 隐式重定向

我在 SPA 上启用 OAuth2,如下所示:

  • 隐式授权类型是唯一支持的授权类型
  • 我的 Angular 5 应用程序使用 HashLocationStrategy 进行路由

我无法更改这些约束中的任何一个。

当我登录到我的应用程序并被重定向时,来自授权端点的重定向 url 如下所示:

这符合 OAuth2 规范的预期;重定向 url 中的参数必须作为片段附加(在“#”之后)。

我遇到的问题是 Angular 正在根据其散列位置策略解释散列之后的字符。它正在尝试重定向到access_token=...不存在的路径。

我该如何解决这个问题?

0 投票
1 回答
129 浏览

angular - 有条件地改变角度定位策略

我正在尝试通过条件 prod/dev 替换位置策略

然后

虽然 IonicEnv.mode 返回 prod,但条件为真。但它总是使用 HashlocationStrategy。根本没有合乎逻辑的解释……</p>

如果我做

然后一切都在服务器上正常工作。它符合真实条件并进入使用 pathLocationStrategy ......任何解释......任何人?

0 投票
1 回答
223 浏览

angular - Angular 构建 - 刷新到 404,有没有办法在不实现 HashLocationStrategy 的情况下解决这个问题

Angular 构建托管在服务器中并且工作正常,除了在刷新任何页面时,它会转到 Web 服务器404页面。

在寻找解决方案时,每个人都建议使用HashLocationStrategy。有没有其他方法可以解决这个问题,这样哈希符号就不会出现在 url 中。

网络服务器:阿帕奇。

注意:一种解决方案是使用 .htaccess 将 404 错误响应重定向到 angular build 的 index.html,但在这种情况下,从注册邮件中点击的帐户激活点也会转到 index.html

提前致谢。

0 投票
1 回答
405 浏览

angular - 在 Angular 中启用 HashLocationStrategy 时,Okta 重定向 URL 不起作用

我正在尝试在我的应用程序中添加 Okta SSO。但由于HashLocationStrategyokta 无法解析令牌。

有没有办法关闭HashLocationStrategy特定路线?

0 投票
1 回答
800 浏览

angular - Angular 5避免针对特定路线的HashLocationStrategy

在我的 Angular 5 应用程序中,我有多个路线。我已经添加{ provide: LocationStrategy, useClass: HashLocationStrategy }了 app.module.ts 文件的提供者。但我想HashLocationStrategy从特定路线中删除它。

谢谢你。

0 投票
2 回答
153 浏览

angular - 在 IIS 服务器上托管时的位置策略

我在本地服务器上运行我的应用程序,它工作正常,当我们托管它时,它开始工作正常,直到我刷新页面并发生 404 错误。在此处输入图像描述

然后我想出了使用 HashLocationStrategy 的解决方案。它工作得很好。但它在我的网址中添加了一个“#”符号作为“ http://everest.syslogix.ca/#/fastcom/admin-dash ”。但它工作得很好。之后,我想在此应用程序中添加linkedIn 登录,但它需要一个不带“#”符号的受信任 url。

在此处输入图像描述

现在我该怎么办?我在互联网上搜索过,尝试了很多解决方案,但没有一个对我有用。我想要一个没有哈希的 URL,它在我重新加载页面时可以正常工作。或者我想要某种方法来启用带有哈希的 URL 以在linkedIn 上存储为受信任的 URL。

0 投票
1 回答
62 浏览

angular - 如何在最新的 Angular 中正确设置 HashLocationStrategy?

所以我有一个用 Angular 制作的水疗中心。我是为朋友做的,所以我只能访问 ftp 服务器,并且无法将其配置为使用默认的 Angular 导航。在项目生成期间,我“勾选”了路由选项。我尝试根据 Angular 教程设置 HashLocationStrategy 但它不起作用,我不知道为什么。这是我的代码:

应用路由.module.ts:

这是我的导航栏:

应用模块.ts

这是我的 app.component.html:

我没有在 index.html 中设置基本 href,所以理论上它应该可以工作。我的 node.js 网址在启动时看起来像这样:http://localhost:4200/#/。每次我单击导航项时,它都不会重定向,但导航栏和主组件会毫无问题地加载。有人可以帮忙吗?

0 投票
0 回答
1061 浏览

angular - 使用 HashLocationStrategy 时,Angular 应用程序在 OAuth2 登录后无法重定向

我正在开发一个现有的、生产中的 Angular 7 应用程序。我的任务是从本地身份验证方案迁移到现有的公司范围内的身份提供者。身份提供者符合 OAuth2。我正在使用 oidc-client 库来尝试完成此操作。

Angular 应用程序正在使用 HashLocationStrategy,我相当肯定这个要求不会改变。我不是这个应用程序的原作者,所以我不知道选择 HashLocationStrategy 而不是默认 PathLocationStrategy 的确切原因。现在,我宁愿不去更改为 PathLocationStrategy 的兔子洞。我可能会要求更多的麻烦。

身份提供者不允许在重定向 URI 中使用哈希字符,如 OAuth 2.0 规范中所述:https ://www.rfc-editor.org/rfc/rfc6749#section-3.1.2 (“端点 URI不得包括一个片段组件。”)。

对于开发,我希望成功登录后的重定向URI为“http://localhost:8080/#/dashboard”,但由于上述限制,我不能这样做。拥有身份提供者 API 的开发人员告诉我在重定向 URI 中编码哈希字符,例如:“http://localhost:8080/%23/dashboard”。我已经尝试过了,但是当我的应用程序遇到重定向时,它不会对其进行解码,因此我收到此错误:

无法获取 /%23/仪表板

从身份提供者返回到应用程序的登录后重定向 URL 如下所示:

http://localhost:8080/%23/dashboard?code=7d25a8af920d219631a15019fc243ca2&state=9821f4153a1b45d3b6ed9a6813bd70c9&session_state=5c59c99f31156aa805b7267f82b0aa8e499d3f81cf5caab0335595c6e397bbf8.8_QJpOLj75eOfarD091Snw

我的 authservice 的登录功能如下所示,为了调用登录页面:

我的问题是:在尝试路由之前,我可以在 Angular 应用程序中监听一个事件来捕获和解码登录后重定向 URL 吗?如果是这样,我可以将 %23 转换为 # 并继续重定向。

或者,有没有办法可以暂时暂停对这条路线使用 HashLocationStrategy ?如果这是可能的,我也许可以使用“http://localhost:8080/dashboard”作为我的重定向 URI,并且仍然让它路由到正确的组件。

我一直在网上寻找,但到目前为止,我看到的所有 Angular 示例都使用 PathLocationStrategy 而不是 HashLocationStrategy。

我也在这里搜索过,没有发现和我一模一样的问题。所以我不认为这是一个重复的问题。

感谢您的任何建议。

更新:不管怎样,我永远无法解决这个问题,除非将应用程序从使用 HashLocationStrategy 更改为使用 PathLocationStrategy。所以,这就是我所做的。我对我们的源代码控制进行了更多研究,发现了对 HashLocationStrategy 进行更改的人员和时间,基于此,我猜测原作者没有意识到 Web 服务器上的某些配置是支持 PathLocationStrategy 所必需的,这(希望)是他选择使用 HashLocationStrategy 的唯一原因。我们将 webpack dev-server 用于我们的开发(localhost)Web 服务器,因此将“historyApiFallback: true”添加到 webpack.config.js 以支持重新加载相同的 URL 是一件相对简单的事情。当我可以访问使用 nginx 的登台和生产服务器时,

0 投票
3 回答
508 浏览

angular - Azure OAuth2 因 Angular HashLocationStrategy 失败

这是Angular App Hosting Azure Storage Container - Azure Authentication Callback and Routing failed的后续问题。

概括:

我想在 Azure 存储帐户上托管我的 Angular 8 应用程序。为了使路由工作,我必须打开 HashLocationStrategy。这个策略在路由前加上一个标签,如下所示:https://<projectname>.z6.web.core.windows.net/#/auth/login

路由现在可以正常工作,但 Azure OAuth2 进程也通过使用主题标签将访问令牌信息添加到基本 url: <baseurl>/<callbackurl>#access_token=eyJ0eXAiOiJKV1Q...。不使用 HashLocationStrategy 路由将是这样的(回调路由是/auth/callback):

使用 HashLocationStrategy 它应该是这样的:

但它的作用是:

它只是吞下回调 url 部分并将 access_token 部分直接添加到基本 url 后面。重定向失败。

有没有办法让 Azure OAuth2 与 HashLocationStrategy 一起工作?