How to update my browser as HTTP 303 is received by my angularjs controller

2.1k Views Asked by At

My RestEasy code dispatches a 303-response to angularjs controller. Furthermore, Chrome network debugging shows that both the HTTP 303 is received AND that the new URL is loaded (showing as HTTP 200) - but never shown!

If I try calling the RestEasy-endpoint directly from my browser, it will redirect nicely!

But, alas, my angularjs controller seems unable to update the browser - it stays put on the same page!

Here is my angularjs controller:

var mod = angular.module('login', []);
mod.controller('RestController', [
        '$http',
        '$scope',
        function($http, $scope) {

            $scope.submit = function(v1, v2) {
              $http.post("rest/login/submit", {
                  param1 : v1,
                  param2    : v2
                }).success(function(data, status, headers, config) {
                    $scope.submitmsg = "";

            }).error(function(data, status, headers, config) {
                $scope.submitmsg = "Error...";
            });
        }
    } ]);

My question is simple: should I do something special to handle update of the browser page. Perhaps set some $scope variable or $doc or something?? Or should I maybe do some handling in the error()-part of the function - to address the 303 code?

Any help is appreciated. All testing has been done in Chrome.

2

There are 2 best solutions below

0
On BEST ANSWER

It is not a good idea to send HTTP 303 from your endpoint. I think it may be intercepted by the browser. A better alternative is to return information about the URL you want to redirect to (along with an appropriate HTTP response - could be 200 or 400 or whatever) and use the $window.location.href to perform the redirect:

var mod = angular.module('login', []);
mod.controller('RestController', [
        '$http',
        '$scope',
        '$window',
        function($http, $scope,$window) {

            $scope.submit = function(v1, v2) {
              $http.post("rest/login/submit", {
                  param1      : v1,
                  param2    : v2
                }).success(function(data, status, headers, config) {
                    $window.location.href = "http://host:port/path"
                }).error(function(data, status, headers, config) {
                    $scope.submitmsg = "error";
                });
            }
        } ]);
4
On

The 303 response code should not really be used in single page applications. It's processed by the browser before the angular framework.

You should return the appropriate error code instead of the 3xx redirected command; 5xx in case of server error, 401 when unauthorised and so forth.

If this should be a global exception hander or just in the controller specific, really depends of action that should be taken because of it. In the light of the information available, I would recommend an global hander to the application which would redirect the user using the $location.path("...");