Question

在角路由中，有任何方法可以重定向到同一域上的外部目录。我有一个WordPress博客和angular应用程序，我希望它使用相同的域而不是子域。

示例

http://example.com-> Angular应用
http://example.com/blog-> WordPress博客

请帮助我提出您的建议。

Answer 1

我了解您为什么要使用Angular路由器执行此操作。从Angular应用程序导航到外部URL非常容易。使用window.location或锚标记是直截了当的，但是它有很大的缺点，它绕过了Angular Router 。

@Adrian提出了一种使用写在Using the Angular Router to navigate to external links内的Angular Router导航到外部URL的好方法。我喜欢他的实现，它看起来干净且正确。他也在stackblitz中准备了最终结果。

Answer 2

如果正确理解，它应该可以根据内容类型进行重定向。

解决方案：

根据域和路径将（301、302、303、307）重定向到内部/外部页面或文件：

Github-TYPO3.UrlForwarding
请参阅-Full documentation

其他选择是使用redirect.center处的DNS重定向作为示例。

最后也是最后一个，使用WordPress插件，乍看之下似乎有很多选择可以尝试。

更多信息-https://redirection.me

Answer 3

您可以简单地使用window.open(url, '_blank');，它将打开新标签页，并在其中设置了网址

Answer 4

角度路由器旨在在角度应用程序中提供路由，并且没有固有的外部路由。

您可以路由到一个几乎为空的组件，该组件将重定向到您的外部链接。这似乎是最简单的解决方案。

app-routing.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { BlogComponent } from './blog/blog.component';    

const routes: Routes = [
  { path: 'blog', component: BlogComponent}
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

blog.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  template: ''
})
export class BlogComponent implements OnInit {
  ngOnInit(): void {
    window.location.href = 'http://example.com/blog';
  }
}

PS：确保您可以访问wordpress安装，而不必被服务器重定向到angular应用。

Answer 5

我认为您可以使用重定向功能来实现以下代码示例。

$routeProvider.when("/blog", {
  redirectTo: function () {
    window.location.href = window.location.origin + "/blog";
    // remove below line if it is not working.
    return "/some redirecting animation page";
  }
});

如果使用状态提供程序。

var aboutState = {
  name: 'blog',
  url: '/blog',
  redirectTo: function () {
    window.location.href = window.location.origin + "/blog";
    // remove below line if it is not working.
    return "/some redirecting animation page";
  }
}

重定向到Angular应用之外但在同一域上的URL

5 个答案: