Come faccio butto un vero e proprio 404 o 301 con un URL pushState angolare

Question

sto usando $ routeProvider e $ locationProvider per gestire URL pushState in una singola pagina app (SPA), qualcosa di simile:

angular.module('pets', []) 

    .config(function($routeProvider, $locationProvider) { 
    $locationProvider.html5Mode(true); 
    $routeProvider.when('/pet/:petId', { 
     controller: 'petController' 
    }); 
    }) 

    .controller('petController', function($scope, petService, $routeParams){ 
    petService.get('/api/pets/' + $routeParams.petId).success(function(data) { 
     $scope.pet = data; 
    }); 
    }); 

L'URL viene utilizzato per estrarre il contenuto dal server che può o non può esistere.

Se si trattava di un sito Web a più pagine ordinario, una richiesta di contenuto mancante avrebbe attivato una risposta dell'header 404 dal server e una richiesta di contenuto spostato avrebbe attivato un 301. Ciò avviserebbe Google del contenuto mancante o spostato.

diciamo per esempio mi ha colpito un URL simile a questo:

http://example.com/pet/123456

e dire non c'è tale animale domestico nel database, come può il mio SPA restituire un 404 su quel contenuto.

In caso contrario, esiste un altro modo per avvisare correttamente l'utente o il motore di ricerca che l'URL richiesto non esiste? C'è qualche altra soluzione che non sto considerando?

Answer 1

La vera domanda è non http://example.com/pet/123456 ritorno niente?

Se il punto di partenza è http://example.com/ e c'è un link per http://example.com/pet/123456 poi angolare chiamerà il petController che a sua volta fa una chiamata AJAX per http://example.com/api/pet/123456.

Un crawler non lo farebbe, ma invece proverebbe a chiamare direttamente http://example.com/pet/123456.

Quindi il tuo server deve essere in grado di gestire quella chiamata. Se non esiste un animale domestico con l'id 123456 allora dovrebbe restituire 404. Problema risolto. Se c'è allora dovrebbe restituire la SPA. L'applicazione dovrebbe quindi gestire la situazione di conseguenza.

Answer 2

Prova questa

angular.module('pets', []) 
 

 
    .config(function($routeProvider, $locationProvider) { 
 
    $locationProvider.html5Mode(true); 
 
    $routeProvider.when('/pet/:petId', { 
 
     controller: 'petController' 
 
    }). otherwise({ yourUrl:'/404.html'}) // Render 404 view; 
 
    })

Answer 3

In base a questa risposta How do search engines deal with AngularJS applications?, è necessario utilizzare Browser senza testa per elaborare le richieste di crawler e restituire istantanee della pagina con il codice di risposta appropriato. https://developers.google.com/webmasters/ajax-crawling/docs/html-snapshot

L'esempio di google non ha incluso 301.302 o 404 casi. Tuttavia, il loro codice potrebbe essere modificato per analizzare il contenuto dell'istantanea e modificare il codice di risposta.

Ho trovato prerender.io offre questo servizio, ma non è gratuito. Tuttavia, hanno un piano gratuito se hai meno di 250 pagine. Il Prerender chiede che in caso di 404 o 301, si aggiunge un meta tag al DOM.

questo metatag viene quindi rilevato dal browser headless e il codice di risposta viene modificato.