使用 slug 而不是 id 获取链接以成为 SEO 友好的 URL。将 Prismic io 与 Angular js 集成

2024-02-18

https://github.com/heshamelmasry77/javascript-angular-starter https://github.com/heshamelmasry77/javascript-angular-starter

我正在将 Prismic io CMS 与 Angular js 集成,我做到了,并且它与我一起正常工作,但我使用每个文档的 id 获取链接,这对 SEO 不友好。我正在尝试找到一种方法来使用那里的 slug 获取文档而不是 id,但它非常复杂,我在 prismic io API 调用 getByUID 中使用了一个函数,我尝试通过 slug 获取,但它不起作用。在此存储库中,我发布在这里,您将找到我集成的完整工作项目,并且我还发布了我尝试使用 API 中的 getByUID 的代码。

克隆我的项目并启动它来看看我在说什么。 这是我得到的链接以及我想要使其 SEO 友好的链接:

http://127.0.0.1:52486/app/index.html#/document/WG90FCkAMUrJCKv/tata http://127.0.0.1:52486/app/index.html#/document/WG90FCkAAMUrJCKv/tata

我想生成类似的东西:

http://127.0.0.1:52486/app/index.html/document/whatever/tata http://127.0.0.1:52486/app/index.html/document/whatever/tata

并且还想删除这个#。

我对 $locationProvider.html5Mode(true); 感到红色但它在集成时会阻止所有内容,即使我使用它也无法获得链接。

 .controller('DocumentCtrl', ['$scope', '$routeParams', 'Prismic', '$location', function($scope, $routeParams, Prismic, $location) {
        Prismic.api('https://carzar.prismic.io', function(err, api){
            api.getByUID('Make', $routeParams.id).then(function(err, document){

                console.log(document);
                console.log(err);
            })
        })
        Prismic.api().then(function(api){
            api.getByUID('Make', $routeParams.slug).then(function(document){
                console.log(document);
            })
        })
        Prismic.api().then(function(api){
        api.getByUID('make', $routeParams.slug).then(function(document){

            $scope.document = document;
            console.log(document);

//          if (document.slug === $routeParams.slug) {
//              Prismic.ctx().then(function(ctx) {
//                    $scope.document = document;
//
//                    console.log(document);
//              })
//          }
//          else if (document.slugs.indexOf($routeParams.slug) >= 0) {
//              $location.path('/document/'+document.id+'/'+document.slug);
//          }
//          else {
//              // Should display some kind of error; will just redirect to / for now
//              $location.path('/');
//          }
        });
        });
    }])

None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 slug 而不是 id 获取链接以成为 SEO 友好的 URL。将 Prismic io 与 Angular js 集成 的相关文章

随机推荐