Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了angularjs – 在Angular UI-Router的动态视图中添加一个SEO友好的Url Slug大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
在Angular设置中,我选择了Angular UI-router在视图之间切换.

我的配置如下所示:

.config(function($stateProvider,$urlRouterProvider) {

  $urlRouterProvider.otherwise('/app/home');

  $stateProvider

    // Nav
    .state('app',{
      url: '/app',templateUrl: 'templates/navbar.html',abstract: true,controller:'AppCtrl as app',})

    // Home
    .state('app.home',{
      url: '/home',templateUrl: 'templates/home.html',controller:'HomeCtrl as home',})

    .state('app.browse',{
      url: '/browse',templateUrl: 'templates/browse.html',controller:'BrowseCtrl as browse',})

    .state('app.browse-detail',{
      url: '/browse/:productId',templateUrl: 'templates/browse-detail.html',controller:'BrowseDetailCtrl as detail',})

})

这将导致产品的网址显示如下:

www.website.com/app/#/browse/productId

相反,我想看到像:

www.website.com/browse/productId/most-awesome-product

最棒的产品是Url Slug.

我的问题是:

>一般来说,使用路由使Angular网站seo友好的原则是什么?
>如何通过添加url slug来更改我的角度路由器的URL(见上文)?
>会改变url使我的网站seo友好吗?

谢谢!

Google一直在尝试使一个页面的应用程序更多的SEO友好,但不知道他们已经获得了多远,这就是为什么我坚持一个页面的应用程序的URL结构,当我需要一个网站是SEO友好.

使用您的设置完成此任务的一种方法添加到您的配置$LOCATIOnProvider.html5Mode(true);并添加到您的HTML标题< base href =“/ app /”/>这将转动你的url

www.website.com/app/#/browse/productId

至:

www.website.com/app/browse/productId

我发现这个设置的问题是,您需要将服务器配置为仅向前端输入一个入口点,例如www.website.com/app.这是一个tutorial设置这个.

大佬总结

以上是大佬教程为你收集整理的angularjs – 在Angular UI-Router的动态视图中添加一个SEO友好的Url Slug全部内容,希望文章能够帮你解决angularjs – 在Angular UI-Router的动态视图中添加一个SEO友好的Url Slug所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。