是否可以在 Angular 应用程序中添加重定向（301）？答案

【问题标题】：Is it possible to add redirect (301) inside angular app?是否可以在 Angular 应用程序中添加重定向（301）？
【发布时间】：2019-04-12 14:01:18
【问题描述】：

假设我的应用程序在 domain.com 上运行，互联网上大多数指向该站点的链接如下所示：domain.com/:id。

我想稍微改进一下 SEO 并添加重定向 (301)： domain.com/:id => domain.com/:title。但是要获得 id 的标题，我必须运行 angular app 并在 DB 中检查它。

所以我想做的是：

用户转到domain.com/:id
检查 title 的 id 来自 Angular 应用程序内的 url
将状态为 301 的用户重定向到 domain.com/:title

【问题讨论】：

标签： angular redirect angular-router

【解决方案1】：

您必须使用 Angular Universal 和服务器端渲染来运行 Angular。有一个指南可以帮助您入门，如果它是一个新的 Angular 项目，添加起来相对容易。

https://angular.io/guide/universal

然后你必须告诉 Express 执行 301 重定向，这可以通过配置用于 SSR 的主模块来完成。

https://gist.github.com/KostyaEsmukov/ce8a6486b2ea596c138770ae393b196f

【讨论】：

【解决方案2】：

您可以进行一些更改或在server.ts 文件中添加条件。

在列出的代码中，所有路由都先到这里，然后快速服务器（SSR）呈现前端的角度 HTML 文件。所以在向浏览器发送任何响应之前，我们可以发送 301 状态码。我们可以像这样添加条件

// All regular routes use the Universal engine
  server.get('*', (req, res) => { 
   // req.originalUrl in this object we can read the requested URL
    if(req.originalUrl == '/old-url-example'){      
        res.redirect(301, 'http://localhost:4000/new-url');
    }else{
        res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
    }
  });

您可以在此article获得更多详细信息

【讨论】：

这仅在页面从第一次加载或重新加载时有效，但在角度路线发生变化时无效。
@jcdsr 您不能从 Angular 应用程序内部“进行重定向 301”。你可以放 location.href='new url'，但它不会是 301。301 是从服务器端制作的。如果你想在这两个方面都这样做，你必须编写两次代码——在上面代码中显示的 express 部分，以及在你的 Angular 部分。