使用破折号而不是 ID 将 URL 设置为 SEO 友好标题

Question

我正在使用 AngularJS 创建一个文章页面，其中包含单个文章详细信息的链接。这些链接基于 ID 以确保它们是唯一的，但我希望 URL 是带有破折号的标题（对 SEO/用户更友好）而不是 ID。这是产品详细信息是干净标题的 Angular 示例：

http://angular.github.io/angular-phonecat/step-11/app/#/phones

我当前的 URL 是通过 ID 链接的，因此它们显示为 article/66D5069C-DC67-46FC-8A51-1F15A94216D4

我希望它们显示为文章标题，例如文章/开始投资，并确保它们对 SEO 友好。

我担心的是，如果不同作者的两篇文章具有相同的标题（例如了解投资），如果我尝试按标题链接/查找而不是每篇文章唯一的 ID，我会出错。

这是我的控制器：

var pfcControllers = angular.module('pfcControllers', []);

pfcControllers.controller('pfcCtrl', ['$scope', 'pfcArticles', function ($scope, pfcArticles) {
$scope.articles = pfcArticles.query();
}]);

pfcControllers.controller('pfcCtrl2', ['$scope', '$routeParams', 'pfcArticles', function ($scope, $routeParams, pfcArticles) {
$scope.article = pfcArticles.get({ articleID: $routeParams.articleID });
}]);

这是我的路由器：

var pfcModule = angular.module('pfcModule', ['ngRoute', 'pfcServices', 'pfcControllers']); pfcModule.config(['$routeProvider', function ($routeProvider) { $routeProvider. when('/home', { templateUrl: './views/home.html'}). when('/categories', { templateUrl: './views/categories.html', controller: 'pfcCtrl' }). when('/article/:articleID', { templateUrl: './views/articles.html', controller: 'pfcCtrl2' }). otherwise({ redirectTo: '/home' }); }]);

这是我的两个部分：

Categories.html（多篇文章）

<div class="row">
<div class="col-md-4">
    <h2>Heading</h2>
    <table class="table table-striped">
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>Category ID</th>
            <th>Link</th>
        </tr>
        <tr ng-repeat="article in articles">
            <td>{{article.id}}</td>
            <td>{{article.articletitle}}</td>
            <td>{{article.articlecategoryid}}</td>
            <td><a href="#articles/{{article.id}}">Link</a></td>
        </tr>
    </table>
</div>

Article.html（单篇文章）

<div class="row">
<div class="col-md-4">
    <h2>Heading</h2>
    <table class="table table-striped">
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>Category ID</th>
            <th>Summary</th>
        </tr>
        <tr>
            <td>{{article.id}}</td>
            <td>{{article.articletitle}}</td>
            <td>{{article.articlecategoryid}}</td>
            <td>{{article.articlesummary}}</td>
        </tr>
    </table>
</div>

这是我的 JSON 输出示例：

[{"id":"66D5069C-DC67-46FC-8A51-1F15A94216D4","articletitle":"Start Investing","articlecategoryid":1,"articlesummary":"Investing is not gambling, but many people treat it with fear, excitement and apprehension like they are playing a game of chance. They act under the assumption that an investor was born with money and understands rules that are not known by anyone else. While it is true that some of the biggest risks hold the largest gains, you can take a controlled and planned approach. There is nothing wrong with a long term reasonable gain on an investment. Question: It seems so complicated, how does someone start investing? Answer: In fact, it is easy start investing, without taking giant risks, and with a plan in place. The key is \"3D Investing\"; Diversify, Dollar Cost Averaging, and Determination. Need motivation? Use The Investing Calculator to determine your future value with compound interest. ","articlelink":"http://www.thebudgetcalculator.com/start-investing.html"},{"id":"4E94D4A5-15A3-4D3D-BAD5-C1E9264145A2","articletitle":"Why Budget","articlecategoryid":2,"articlesummary":"A budget is one of the most overlooked, yet powerful tools in a financial plan. You have to know what you have, what you don't have, and follow a \"road-map\" in order to get where you want to be! If you stick to your budget, it will be the best friend you have, because a lot of financial stress comes from not knowing where your finances are, and not having a plan. In your budget is where you lay out your plan of how your dollars are spent, what debts are being paid down (read about debt), and how much you can save for the future. Question: So why do so few people actually sit down and do a budget? Answer: Many people just don't know where to start. ","articlelink":"http://www.thebudgetcalculator.com/why-budget.html"},{"id":"E1E90A53-1839-4F1E-9C69-EFD1F77DD322","articletitle":"Managing Debt","articlecategoryid":3,"articlesummary":"Debt is both physical and emotional, because it not only affects both all physical finances and value, but also weighs on us through stress and uncertainty. A lot of this uncertainty comes from not knowing where you stand each month, and that is why a budget is so important to determine what you can and cannot spend. But let’s be realistic, at some point in our lives most of us have debt, whether it is in the form of credit cards, student loans, mortgage, etc. Question: So if you have debt, how do you go about paying it off? Answer: There are many approaches to paying down debt, and here are there of them. ","articlelink":"http://www.thebudgetcalculator.com/managing-debt.html"},{"id":"102CC729-465B-4893-8374-0F30AA4FC751","articletitle":"Retirement Planning","articlecategoryid":4,"articlesummary":"The word retirement sounds relaxing, but if you did not save for your golden years you had better start hoping for a miracle. If this statement does not scare you, let’s put it into proper perspective. If you do not save for retirement you will be a burden upon your loved ones, your society, and yourself. This is probably the shortest section on thebudgetcalculator.com because it is the most straightforward. Participate in your company’s retirement plan, or get an IRA (Individual Retirement Account). IRA's are offered at most banks and brokerages. So if your company does not have a retirement plan or you are self-employed, do yourself and the world a favor by starting your retirement savings today! The younger your start, the more you have at retirement, because the money put into an retirement account has more time to gain value before you need the funds.","articlelink":"http://www.thebudgetcalculator.com/retirement-planning.html"},{"id":"03119912-D732-4C68-B41E-F34B28FCD20F","articletitle":"Investing Basics","articlecategoryid":1,"articlesummary":"Learn the investing basics using these resources and start investing today. Whether you are a beginner investor, or seasoned broker, it is always valuable to understand the fundamentals of investing.","articlelink":"http://www.theinvestingcalculator.com/investing-basics.html"}]

我是否需要执行某种 URL 重写，如果需要，我如何在 Angular 中执行此操作？是否有另一种方法可以使链接具有唯一的 ID，或者其他人只是链接到标题？

Answer 1

我建议你在 URL 中也使用作者的用户名，这样路由看起来像

.when('/article/:userID/:articletitle', { 
    templateUrl: './views/articles.html', 
    controller: 'articleCtrl' 
  })

这将解决不同作者具有相同文章标题的问题（但现在如果作者发布两篇具有相同标题的文章会出现问题。为此您可以在URL中引入年份或月份来制作独一无二）

您还可以创建另一个视图，作者可以在其中查看他们的所有文章（路线如下）

.when('/article/:userID', { 
    templateUrl: './views/allArticles.html', 
    controller: 'allArticleCtrl' 
  })

Answer 2

您可以使用以下选项之一，我已根据自己的喜好对其进行了排序：

1. 只需在 url 中使用格式化的标题，不要添加任何其他内容，除非标题之间存在冲突。如果标题发生冲突，请使用以下方法之一来区分它们。您的路线看起来像“/articles/:formattedTitle”。如果数据库中有多个具有相同标题的文章，并且没有明确指示选择哪一篇，则继续选择最早创建的一篇。
2. 创建一个名为 textKey 的新字段，并根据文章标题自动填充该字段。例如一个将导致http://my.url.com/articles/start-investing，下一个将导致http://my.url.com/articles/start-investing-2。你的路线看起来像'/articles/:textKey'
3. 创建一个名为 discriminator 的新字段，默认值为 Null，仅当标题中发生冲突时才会填充它。例如一个将导致http://my.url.com/articles/start-investing，下一个将导致http://my.url.com/articles/start-investing/1。你的路线看起来像'/articles/:formattedTitle/:discriminator'
4. 同时添加 ID 和标题，例如一个将导致http://my.url.com/articles/start-investing/66D5069C-DC67-46FC-8A51-1F15A94216D4，下一个将导致http://my.url.com/articles/start-investing/AAE5069C-ABCD-46FC-8A51-1F15A94213A5。您的路线看起来像 '/articles/:formattedTitle/:id'

Answer 3

我建议在现有路线之外添加另一条路线

  when('/phones/:phoneId', {
    templateUrl: 'partials/phone-detail.html',
    controller: 'PhoneDetailCtrl'
  }).
  when('/phones/:phoneId/:title', {
    templateUrl: 'partials/phone-detail.html',
    controller: 'PhoneDetailCtrl'
  })

对于您的情况，您可以使用以下链接进入同一页面。

 <a href="http://my.url.com/articles/#66D5069C-DC67-46FC-8A51-1F15A94216D4">Start Investing</a>

 <a href="http://my.url.com/articles/#66D5069C-DC67-46FC-8A51-1F15A94216D4/Start+Investing">Start Investing</a>

第二个和第一个完全一样

Answer 4

使用 js 生成页面不太符合 SEO... 还有，为什么你的 JSON 中有一个 "article-link" 属性..？

如果此链接没有用，那么您可以只获取 html 内容并解析输出以构建您的产品对象。

或者，更好的是，您应该重新设计服务器端实现，因为如果您能够通过http://www.thebudgetcalculator.com/start-investing.html 上的 GET 请求获取 html，那么您应该以与 http://www.thebudgetcalculator.com/api/articles/start-investing 等 JSON api 调用相同的方式实现它