Dawood Abbas

Dawood Abbas

  • NA
  • 32
  • 2.8k

Mix angularjs http error handling and MVC custom page error?

Apr 2 2020 10:08 AM
How to Mix angularjs http error handling and MVC custom page error?
  • I need to manage page not found and server propblem erros by redirect to my own custom error pages, so I done this by following, and its working fine.
 
web.config
  1. "On">  
  2.       "400" redirect="~/Error/Error400"/>  
  3.       "404" redirect="~/Errors/Error404" />  
  4.       "403" redirect="~/Error/Error403" />  
  5.       "500" redirect="~/Errors/Error500" />  
  6.       
  • so now when I need to get the angularjs http erros like 404 by follwing code in which passing wrong methode (GetDetai) which is not available in controller (actual is 'GetDetails').
  1. $http({  
  2.         method: 'GET',  
  3.         url: '/Admin/Dashboard/GetDetai',  
  4.         headers: { "Content-Type""application/json" }  
  5.     }).then(function (result) {  
  6.         console.log(result);  
  7.         $scope.GetCustomer = result.data;  
  8.     }, function (reason) {  
  9.             console.log(reason);  
  10.         if (reason.status == '404') {  
  11.             console.log('Invalid Methode/Url.');  
  12.         }  
  13.         else if (reason.status == '505') {  
  14.             console.log('Internal server error.');  
  15.         }  
  16.     }); 
  •  then its not ctaching the 400 error in error function, its going into then function and displaying below
First Console log
 
  1. {data: "  
  2. ↵  
  3. ↵  
  4. ↵>  
  5. <html>  
  6. <head>  
  7. ↵    <meta c…white;">Go Back To Homea>  
  8. body>  
  9. html>  
  10. ↵  
  11. ↵", status: 200, config: {…}, statusText: "OK", headers: ƒ, …}  
  12. data: "  
  13. ↵  
  14. ↵  
  15. ↵>  
  16. <html>  
  17. <head>  
  18. ↵    <meta charset="utf-8" />  
  19. ↵    <title>title>  
  20. ↵    <style>  
  21. ↵        body {  
  22. ↵            display: inline-block;  
  23. ↵            background: #00AFF9 url(https://cbwconline.com/IMG/Codepen/Unplugged.png) center/cover no-repeat;  
  24. ↵            height: 100vh;  
  25. ↵            margin: 0;  
  26. ↵            color: white;  
  27. ↵        }  
  28. ↵  
  29. ↵        h1 {  
  30. ↵            margin: .8em 3rem;  
  31. ↵            font: 4em Roboto;  
  32. ↵        }  
  33. ↵  
  34. ↵        p {  
  35. ↵            display: inline-block;  
  36. ↵            margin: .2em 3rem;  
  37. ↵            font: 2em Roboto;  
  38. ↵        }  
  39. ↵    style>  
  40. head>  
  41. <body>  
  42. ↵    <h1>Whoops!h1>  
  43. ↵    <p>Something went wrongp><br /><br />  
  44. ↵                 
  45. ↵    <a href="/Home/Index" style="color:white;">Go Back To Homea>  
  46. body>  
  47. html>  
  48. ↵  
  49. ↵"  
  50. status: 200  
  51. headers: ƒ (name)  
  52. config: {method: "GET", transformRequest: Array(1), transformResponse: Array(1), jsonpCallbackParam: "callback", paramSerializer: ƒ, …}  
  53. statusText: "OK"  
  54. xhrStatus: "complete"  
  55. __proto__: Object 
  •  But when I commented/removed that web.config custom error code then this angularjs http call error function working properly, getting expected 404 error.
So How to manag these both kind of errors properly with non dipendencies and non effect on other codes?