javascript - AngularJS SPA with Node.js and parse.com backend -

i have angularjs spa ui-router works perfectly. uses parse.com backend, , have working on regular apache server.

now want move node.js server-app, , want node.js handle cruds parse.com.

i set nice little node.js app act server, , works.

my question is: how handle requests between node.js server-app , angularjs spa?

i've included server.js file, in case can use it.

// set =====================================================================================================  var express			= require('express'),  	path			= require('path'),  	morgan			= require('morgan'),  	bodyparser		= require('body-parser'),  	methodoverride	= require('method-override'),  	routes			= require('routes'),  	keys			= require('./config/keys'),  	port			= 80;    var app = express();    var parse = require('parse/node').parse;    // view engine setup ==========================================================================================  app.set('views', path.join(__dirname, 'views'));  app.set('view engine', 'jade');    // configuration ==============================================================================================  app.use(require('prerender-node').set('prerendertoken', keys.prerender));  app.use(morgan('dev'));  app.use(bodyparser.urlencoded({'extended':'true'}));            // parse application/x-www-form-urlencoded  app.use(bodyparser.json());                                     // parse application/json  app.use(bodyparser.json({ type: 'application/vnd.api+json' })); // parse application/vnd.api+json json  app.use(methodoverride());  app.use(express.static(path.join(__dirname, 'public_html')));    parse.initialize(keys.app, keys.js);    // routing ====================================================================================================  app.use(function(req, res) {  	"use strict";      // use res.sendfile, streams instead of reading file memory. ===============================      res.sendfile(__dirname + '/public_html/index.html');  });    app.use('/', routes);    // catch 404 , forward error handler =====================================================================  app.use(function(req, res, next) {  	"use strict";      var err = new error('not found');      err.status = 404;      next(err);  });    // listen (start app node server.js) =====================================================================  app.listen(port);  console.log("app listening on port %d", port);

file structure:

- public_html/ <-- angularjs app --> - node_modules/ <-- installed modules node --> - config/     - keys.js - server.js - package.json 

the current setup

so, currently, deal parse.com data in (angularjs) app controller - , of in parse's cloud-code.

now, want move parse.com dealings node.js server-app, angularjs "calls" node.js server-app, in turn "calls" parse.com data need, , return angularjs app can update views (with new data parse.com).

example of want

parse.com <--> node.js server-app <--> angularjs spa (views) 

a simple thing in controller like

var profile = parse.object.extend('profile');  var query = new parse.query(profile);  query.equalto('objectid', $stateparams.authorpermalink);  query.find().then(function(results){    var object = results[0];    $scope.authorobj = results[0];    $scope.template.pagename = object.get('screenname');    $scope.template.pageauthor = object.get('screenname');    $scope.template.pagepublished = object.createdat;    $scope.template.pagelastedit = object.updatedat;    $scope.$apply();  }, function(error){    // error-handling    console.log("error: " + error.code + " " + error.message);  });

now, moving snippet of code node.js simple because can use parse.com sdk in node.js directly. how angularjs app communicate node.js server-app?

okay, managed brain way out of this.

the solution make routes handle http-requests angularjs app.

routes.js (node):

app.get('/api/article/:permalink', function(req, res) {      blog.getarticle(req.params.permalink, function(data) {          res.json(data);      });  });      // else  app.use(function(req, res) {    // use res.sendfile, streams instead of reading file memory.    res.sendfile('./public_html/index.html');  });

then create model blog object , methods, called above.

model.js (also node):

module.exports = {      getarticle : function(permalink, callback) {      "use strict";      var article = parse.object.extend('article');      var query = new parse.query(article);      query.include('category');      query.include('profile');      query.equalto('permalink', permalink);      query.find().then(function(results) {        var result = results[0];        var object = {          title: result.get('title'),          screenname: result.get('profile').get('screenname'),          profileid: result.get('profile').id,          content: result.get('content'),          publishedat: result.get('publishedat'),          updatedat: result.updatedat,          categoryname: result.get('category').get('categoryname'),          categorypermalink: result.get('category').get('categorypermalink'),          articleid: result.id        };          callback(object);              }, function(error) {        callback({error: error});      });    }    };

and in mu angularjs app, make http-request (get in example other rest verbs work well).

controller.js (angularjs):

$http.get('/api/article/' + $stateparams.articlepermalink           ).then(function successcallback(response) {    response = response.data;    $scope.articletitle = response.title;    $scope.template.pagename = response.title;    $scope.articleauthor = response.screenname;    $scope.template.pageauthor = response.screenname;    $scope.profilepermalink = response.profileid;    $scope.articlecontent = response.content;    $scope.publishdate = response.publishedat;    $scope.template.pagepublished = response.publishedat;    $scope.template.pagelastedit = response.updatedat;    $scope.category = response.categoryname;    $scope.categorypermalink = response.categorypermalink;    $scope.currentarticle = response.articleid;      console.log(response.commentobj);    }, function errorcallback(response) {    console.log("error: " + response.code + " " + response.message);  });

the callbacks magic!