-1

I am developing an application on MEAN JS. I am new on MEAN JS.
I want to access an external API to get a json respone as following -
{"id":"7gd6ud7ud5r0c","name":"jack","zip":"94109","gender":"Male"}

I have this reference here (https://nodejs.org/api/https.html)..
But I dont know how to use the http/https request inside a client controller.

Here is my express.js

'use strict';

/**
 * Module dependencies.
 */
var fs = require('fs'),
http = require('http'),     // required already
https = require('https'),   // required already
express = require('express'),
morgan = require('morgan'),
bodyParser = require('body-parser'),
.....
.....
.....

Here is my invite.client.controller.js

    'use strict';
    angular.module('core').controller('InviteController', ['$scope', 
    'Authentication', '$http',
        function($scope, Authentication, $http) {
        // This provides Authentication context.
        $scope.authentication = Authentication;

     $scope.getMembersFromAPI = function(){

            ***************************************
            // this block shows error ReferenceError: require is not defined
            var http = require('http'),  
                https = require('https');
            ***************************************
            var options = {
              hostname: 'https://api.somedemodp.com/v5/td?api_key=ec96c9afcbb6bbb8f5a687bd7&email=vlad@rapleafdemo.com',
              path: '/',
              method: 'GET'
            };

            var req = https.request(options, function(res) {
              console.log('statusCode: ', res.statusCode);
              console.log('headers: ', res.headers);

              res.on('data', function(d) {
                process.stdout.write(d);
              });
            });
            req.end();

            req.on('error', function(e) {
              console.error(e);
            });

        };
    }
]);
Mithun Sen
  • 523
  • 5
  • 19

2 Answers2

2

...are you confusing your angular and express code? You don't use require in angular. You use dependency injection.

Angular is front-end, express is backend. They are decoupled. 

angular.module('core').controller('InviteController', ['$scope', 
'Authentication', '$http',
    function($scope, Authentication, $http)

This is where you do dependency injection (similar to require in node/express) You have already injected $http.

You can actually just call the external API directly from within angular using an $http call - from the docs:

// Simple GET request example :
$http.get('/someUrl').
 success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
}).
error(function(data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
});

https://docs.angularjs.org/api/ng/service/$http

tpie
  • 6,021
  • 3
  • 22
  • 41
  • ok. I am not sure that the modules are loaded into app as dependencies or not. confused also. – Mithun Sen Apr 09 '15 at 12:46
  • You are dealing with two different monsters here - node/express and angular. They each have their own way of loading external modules (like http or $http). You need to think of them as separate entities that communicate with each other. You really should read this if you aren't that familiar with the concept: http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller – tpie Apr 09 '15 at 12:55
  • thanks for the info. but as i am working with https, so should I use $https instead of $http? The script is running now but giving "Cross-Origin Request Blocked" error. – Mithun Sen Apr 09 '15 at 13:18
  • You can just use $http with angular, just be sure to include the https in the url parameter. – tpie Apr 09 '15 at 13:21
  • and how can I get rid of this cross domain access? I think i need to change something.... http://enable-cors.org/server_expressjs.html – Mithun Sen Apr 09 '15 at 13:26
  • or should i change the function u suggested with the cors.org ? – Mithun Sen Apr 09 '15 at 13:33
  • If you are making the ajax call from angular you shouldn't need to do anything with CORS. It may be an issue with the API you are trying to interface with. – tpie Apr 09 '15 at 13:37
  • Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/74835/discussion-between-tpie-and-mithun-sen). – tpie Apr 09 '15 at 13:39
0

For those who run into this problem. I suggest to reading this blog: calling third party web api's from the mean stack

The problem you have is due to the fact that browsers block cross-domain calls. The way to go is by contacting the API from the server and sending that onto the front end.

Note: I haven't tried this myself but, appearently by enabling CORS on the receiving end + sending the right headers will allow you to do cross domain calls from the front end.

Desistreus
  • 321
  • 1
  • 4
  • 6