AngularJS SEO for 404 Status for Document与本网站类似

Question

AngularJS SEO for 404 Status for Document与本网站类似

我正在试图找出如何在我的AngularJS应用程序上找到页面未找到404文档状态错误以保持良好的SEO.我想做一些类似于Red Bull Sound Select网站的做法,但我不确定他们是怎么做到的？

示例404 URL

https://www.redbullsoundselect.com/no-page-here

正如您在上面的示例中所看到的,URL更改为/ 404,并且您在URL中的原始路径中获得404文档状态错误,即无页面 - 此处

在我的AngularJS应用程序上,我只有:

.otherwise({
    class: 'page-not-found',
    title: '404 Page Not Found',
    description: '404 Page Not Found',
    templateUrl: '/app/static/404.html',
    controller: 'mainController as mainCtrl'
});

Run Code Online (Sandbox Code Playgroud)

我可以使用类似的东西:

otherwise({
    redirectTo: '/404'
});

Run Code Online (Sandbox Code Playgroud)

这类似于redbull站点的内容,但它仍然没有给出404文档状态错误.(也将URL更改为404而不是维护原始URL,这对SEO来说也不是很好,但至少谷歌不会将错误的URL编入索引.)

我想我可以尝试在Angular中创建一个不存在的http请求以获得404 xhr状态,但我不认为这就足够了.

我已经阅读了一些建议使用prerender.io的答案,但这是你必须付出的代价,这似乎只是让404页面正常工作.

也许,我们可以在.htaccess中做一些事情,以便不同地处理404页面？目前我们已经重写规则,以便任何不存在的请求资源都使用/index.html.也许我们可以对Apache中如何处理404页面做出例外.

UPDATE

我在redbullsoundselect.com上发现他们在app.js中使用了以下内容

$stateProvider.state("404", {
  url: "/404",
  templateUrl: "/views/site/404.html",
  controller: "NotFoundController"
});

Run Code Online (Sandbox Code Playgroud)

虽然,我仍然不明白这个逻辑是如何工作的.我查看了他们的NotFoundController,但似乎没有发生太多.

它可以与他们使用ui.router而不是ngRoute像我一样吗？

第二次更新

这是我的.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]

Run Code Online (Sandbox Code Playgroud)

#如果请求的资源不存在,请使用index.html RewriteRule ^ /index.html