0

假设您有一个 AngularJS 应用程序连接到一个 RESTful API，并且您有一个“/item/:itemId”的路由。

.when('/item/:itemId', {
    templateUrl: '/static/partials/item-detail.html',
    controller: ItemDetailController
})

angular.module('angServices', ['ngResource']).factory('Item', function($resource) {
    return $resource('/api/item/:itemId', {}, {
        query: { method: 'GET', params: { itemId: '' }, isArray: true }
    });
});

如果用户转到“/item/9”并且 itemId 为 9 的对象不存在，Angular 将从 API 收到 404，但不会自然地向用户返回 404。

在其他问题中，我看到人们建议创建一个拦截器并在找不到资源时让 Angular 重定向到 404 错误页面。

var interceptor = ['$rootScope', '$q', function(scope, $q) {
    ...
    function error(response) {
        if (response.status == 404) { window.location = '/404'; }
    ...
$httpProvider.responseInterceptors.push(interceptor);

但是，为了 SEO 目的，我想返回一个正确的 404 和原始请求的 URL。

此外，上面的解决方案首先加载页面，然后重定向（就像 Twitter 过去所做的那样），所以它不是最理想的。

在将请求传递给 Angular 应用程序之前，我是否应该先检查服务器端以查看资源是否存在？这样做的缺点是它不适用于应用程序中的断开链接。

解决这个问题的最佳方法是什么？

4

1 回答 1

0

也许这个 jsfiddle 可以帮助你。

http://jsfiddle.net/roadprophet/VwS2t/

angular.module('dgService', ['ngResource']).factory("DriveGroup", function ($resource) {
    return $resource(
        '/', {}, {
        update: {
            method: 'PUT'
        },
        fetch: {
            method: 'GET',
            // This is what I tried.
            interceptor: {
                response: function (data) {
                    console.log('response in interceptor', data);
                },
                responseError: function (data) {
                    console.log('error in interceptor', data);
                }
            },
            isArray: false
        }
    }
    );
});

var app = angular.module('myApp', ['ngResource', 'dgService']);
app.controller('MainController', ['$scope', 'DriveGroup', function ($scope, svc) {

    $scope.title = 'Interceptors Test';

    svc.fetch(function (data) {
        console.log('SUCCESS');
    }, function () {
        console.log('FAILURE');
    });

}]);

我试过这个并且工作正常。我只将fetch方法更改为get。

在您的情况下，您需要将 更改console.log('FALIURE');为$location.path('/404');。

GL！

于 2014-01-14T17:18:25.020 回答