jjzjj

AngularJS SEO for 404 Status for Document Similar to This Website

coder 2024-02-27 原文

我正在尝试弄清楚如何为我的 AngularJS 应用程序上未找到的页面获取 404 文档状态错误 以保持良好的 SEO。我想做一些类似于 Red Bull Sound Select 网站 做的事情，但我不确定他们是怎么做的？

示例 404 网址

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

如您在上面的示例中所见，URL 更改为/404，您会收到 URL 中原始路径的 404 文档状态错误，即 no-page-here

在我的 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'
});

我可以使用类似的东西:

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

这与 redbull 站点的类似，但它仍然没有给出 404 文档状态错误。 (也将 URL 更改为 404 而不是保留原始 URL，这对 SEO 也不是很好，但至少 Google 不会将错误的 URL 编入索引。)

我想我可以尝试在 Angular 中发出一个不存在的 http 请求来获得 404 xhr 状态，但我认为这还不够。

我读过一些 answers建议使用 prerender.io，但这是您必须支付的费用，这似乎只是为了让 404 页面正常工作。

或许，我们可以在 .htaccess 中做一些事情来以不同的方式处理 404 页面？目前我们重写了规则，以便任何不存在的请求资源都将使用/index.html。或许我们可以为 Apache 处理 404 页面的方式破例。

更新

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

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

尽管如此，我还是不明白这个逻辑是如何运作的。我查看了他们的 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]

#如果请求的资源不存在，使用index.html 重写规则 ^/index.html

最佳答案

RedBull Sound Select 在做什么

有效网址:https://www.redbullsoundselect.com/artists/gherbo

无效网址:https://www.redbullsoundselect.com/artists/gherbo2

打开 DevTools，在 Network 选项卡中选择“Preserve log”，打开无效的 URL。

  1. Angular 应用加载了 200 或 304(如果在缓存中)
  2. 对 /api/v1/groups/gherbo2?type=artist 进行 API 调用
  3. API 以 404 响应
  4. Angular 代码执行window.location.assign("/404"); artists-profile.js:577

他们提供 Angular 文件的 Express 应用知道有效的 URL 模式，如果 URL 与定义的模式不匹配则发送 404。但是，如果 URL 匹配上述无效 URL 的模式，则 Angular 会使用 window.location.assign 导航到新页面。

抓取工具 (GoogleBot) 的行为如何

  1. 假设 Google 访问了无效的 URL
  2. 它得到的第一个响应代码是 200
  3. 现在 Google 可能执行也可能不执行 JS。 Source
  4. 如果它执行 JS，Angular 会尝试将其导航到新页面。 (这里不确定爬虫会如何 react )

总的来说，在我看来，这对于 SEO 来说不是很好的设置(但对于用户来说，这很好)。我们正在将自托管 Prerender 集成到我们用于 SEO 的 Angular 部署中。

Prerender在 MIT 许可下是开源的。

We host this as a service at prerender.io but we also open sourced it because we believe basic SEO is a right, not a privilege!

关于AngularJS SEO for 404 Status for Document Similar to This Website，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41547213/

AngularJSforredbullsoundselectcodenoreferrerseo

有关AngularJS SEO for 404 Status for Document Similar to This Website的更多相关文章

  1. ruby-on-rails - 为什么在安装 Ruby 1.9.3 时出现 404 错误？ - 2

    我最近对我的计算机(OS-MacOSX10.6.8)进行了删除，并且我正在重新安装我所有的开发工具。我再次安装了RVM；但是，它不会让我安装Ruby1.9.3。到目前为止我已经尝试过:rvminstall1.9.3rvm安装1.9.3-p194rvm安装1.9.3-p448rvminstall1.9.3--with-gcc=clang所有返回相同的命令行错误:Searchingforbinaryrubies,thismighttakesometime.Nobinaryrubiesavailablefor:osx/10.6/x86_64/ruby-1.9.3-p448.Continuin

  2. ruby - 如何使用 Ruby HTTP::Net 处理 404 错误？ - 2

    我正在尝试解析网页，但有时会收到404错误。这是我用来获取网页的代码:result=Net::HTTP::getURI.parse(URI.escape(url))如何测试result是否为404错误代码？ 最佳答案 像这样重写你的代码:uri=URI.parse(url)result=Net::HTTP.start(uri.host,uri.port){|http|http.get(uri.path)}putsresult.codeputsresult.body这将打印状态码和正文。

  3. ruby - 404 未找到，但可以从网络浏览器正常访问 - 2

    我在这方面尝试了很多URL，在我遇到这个特定的之前，它们似乎都很好:require'rubygems'require'nokogiri'require'open-uri'doc=Nokogiri::HTML(open("http://www.moxyst.com/fashion/men-clothing/underwear.html"))putsdoc这是结果:/Users/macbookair/.rvm/rubies/ruby-2.0.0-p481/lib/ruby/2.0.0/open-uri.rb:353:in`open_http':404NotFound(OpenURI::HT

  4. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  5. ruby - 在 Jekyll 中过滤 site.related_posts - 2

    我对Jekyll和Ruby很陌生(但是，非常兴奋)。在不使用插件的情况下，我试图找到一种方法来过滤site.related_posts。例如，我正在阅读标题为Foo且类别为A、B的帖子。该站点总共包含3个帖子:Foo(类别:A、B)条形图(类别:A、C、D)动物园(类别:B、F)默认情况下，在Jekyll中我们这样做:{%forpostinsite.related_postslimit:5%}{%endfor%}但是，上面的代码返回所有(3)个帖子。一个帖子包含很多类别，所以类别应该是一个数组。如何修改代码并仅返回类别与当前帖子类别相交的类别？(在此示例中，我希望代码仅返回Foo和Zo

  6. ruby-on-rails - Rails 以 JSON 格式返回所有 404 和 500 错误 - 2

    我是Rails的新手，正在使用Rails4。在我的应用程序中，我想返回所有JSON格式的404和500错误{"status":404,"message":"notfound"}有一个简单的方法可以做到这一点吗？因为我只是找到了使用rails3.x执行此操作的解决方案。谢谢我正在尝试执行此解决方案NeedtoreturnJSON-formatted404errorinRails但我在故障安全响应期间收到错误:未初始化的常量ErrorsController 最佳答案 也许您正在寻找这个:render:json=>@error_objec

  7. Ruby Open-URI 库在 404 HTTP 错误代码中中止 - 2

    我使用OpenURI库。object=open("http://example.com")如果http://example.com服务器代码响应等于200我的程序按预期运行。但是如果http://example.com服务器响应代码等于400(或其他)，然后脚本中止并显示OpenURI::HTTPError:404NotFound。如果我使用“开始救援”构造并处理“HTTPError异常”，我可以避免这种情况。这是正确的方法吗？我应该使用Net/Http库而不是OpenURI来处理所有情况吗？ 最佳答案 挽救OpenURI::HTT

  8. ruby-on-rails - 如何在 Rails 中实现动态 404、500 等错误页面？ - 2

    如何在Rails中实现动态的自定义错误页面？例如使用您的application.html.erb布局和页面中的一些动态字段的自定义404错误页面。另外，如何从本地机器测试它？ 最佳答案 我在Google上查看了一些关于如何执行此操作的博客文章，不幸的是，大多数文章似乎都依赖于污染您的ApplicationController。我所做的是创建一个带有404消息的模板，然后使用该模板从rake任务更新public/404.html文件:#Rakefiletogeneratestatic404pagefile"public/404.htm

  9. ruby-on-rails - Rails 3 上的 404 err 部署到 AWS...很好，除了 EB 不复制/ondeck 到/current - 2

    当我部署Rails应用程序时，我遇到了一些导致nginx1.2.3404错误的错误。在部署期间，EB说:“错误:某些实例未响应命令。未从[i-a054e9de]收到响应。”我可以登录到我的EC2并在var/app中“mvondecktocurrent”然后“touchcurrent/tmp/restart.txt”然后应用程序将正确部署并正常工作。它具有所有依赖项并正确连接到RDS数据库。问题是:我如何让aws服务器(elasticbeanstalk)进行最后的部署步骤，将ondeck复制到当前？我的配置文件中是否遗漏了什么？是否有我不小心更改了EB配置中的设置？顺便说一句，一切都很好

  10. ruby - 你如何在 Jekyll 中按帖子计数对 site.tags 进行排序？ - 2

    抱歉，我是Ruby的新手，但我正在尝试向我的模板添加一个liquid标签，我可以循环显示五个最流行标签的列表。出于某种原因，这个插件在我使用时只输出一个标签。这是我在mu插件中的内容:moduleJekyllclassPopularTags这是我在模板中输入的内容:{%popular_tags%} 最佳答案 也可以在没有插件的情况下执行此操作，这意味着它可以在GitHubPages上运行.我已经在myblog上做类似的事情(也没有插件)，我在这里显示了一个标签列表，其中包含帖子数，按字母顺序排序。Thesourcecodeisher

随机推荐