3

I have a very simple angular page here

<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<div ng-app="myApp" ng-controller="myCtrl">

  <p>Today's welcome message is:</p>
  <h1>{{myData}}</h1>

</div>

<script>

  var app = angular.module('corsApp', []);

  app.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];

  }

  ]);


  // Added all header request and response.
  app.all('/*', function (request, response, next) {
    response.header("Access-Control-Allow-Origin", "*");
    response.header("Access-Control-Allow-Headers", "X-Requested-With");
    response.header("Access-Control-Allow-Methods", "GET, POST", "PUT", "DELETE");
    next();
  });



  app.controller('myCtrl', function($scope, $http) {
    $http.get("welcome.htm")
    .then(function(response) {
        $scope.myWelcome = response.data;
    });
});


</script>

I kept getting this in my console.

Uncaught TypeError: app.all is not a function

How do I prevent that ?

I'm following this :

https://stackoverflow.com/a/21455819/4480164

Community
  • 1
  • 1
code-8
  • 54,650
  • 106
  • 352
  • 604
  • 1
    app.all is middleware for nodejs (server-side javascript). It is not valid for angularJS in the client. The answer you are referencing states that plainly. – Brian Driscoll Feb 03 '17 at 20:40
  • 1
    you are mixing server side and client side code. What server side language are you using? – charlietfl Feb 03 '17 at 20:40
  • just get rid of `app.all` since it doesn't appear you are working cross domain anyway – charlietfl Feb 03 '17 at 20:41
  • I'm trying everything I could to avoid the cors error. I just want to make a GET to this URL via angular : http://d.biossusa.com/api/distributor?key=bunlongheng – code-8 Feb 03 '17 at 20:42
  • @charlietfl : The entire block of app.all = ? – code-8 Feb 03 '17 at 20:42
  • You are misunderstanding how CORS works...those headers must be set by the api you are calling. If they are not set then you can see if api supports jsonp , if not you need to use a proxy on your server to get the data – charlietfl Feb 03 '17 at 20:42
  • You mean by the server ? I need to configure it in my Nginx server right ? if I use nginx as my web server ? – code-8 Feb 03 '17 at 20:43
  • Yes...if it is your server you are getting data from – charlietfl Feb 03 '17 at 20:44
  • Yes. My server query data from database and return those data in JSON format. – code-8 Feb 03 '17 at 20:49

1 Answers1

2

Just pointing this out because I cannot comment due to low rep, but you are also calling ng-app="myApp" which is looking for a module call for myApp and you do not have a module call for myApp so your controller will not fire correctly either maybe re-word your myApp to app?

lealceldeiro
  • 14,342
  • 6
  • 49
  • 80
McMintz
  • 254
  • 6
  • 19
  • What my code should look like to make it run without console error ? – code-8 Feb 03 '17 at 20:54
  • 1
    you're calling `ng-app="myApp"` in your html, but you declared your module as `var app = angular.module()`, change the value in ng-app to `ng-app="app"` because your controller is looking for the module call and because you set that call to app.controller.... and you're call myApp in your html you're html is not going to fire correctly – McMintz Feb 03 '17 at 20:56
  • `
    ` to `
    ` no where in your script did you declare the app module as myApp
    – McMintz Feb 03 '17 at 20:58
  • You seem to know a lot about Angular JS. Do you anything about angular CORS error prevention ? Do you mind help me looking into this error that I am trying so hard to bypass it ? Here = http://stackoverflow.com/questions/42032996/angularjs-http-cors-get-nginx – code-8 Feb 03 '17 at 21:08