11

I am creating a web application using Sane stack, which uses Ember.js on the client side as a JavaScript framework, and on the server side it uses Sails.js as a node.js framework. I structured my application architecture as follows:

enter image description here

I am trying to get some data from the Jira API REST, I can, for example, GET a Project's information from the JIRA API REST with sails.js using a simple controller : 

//server/app/controllers/JiraController
module.exports = {
    loadProject : function(req, res){
        console.log("Jira contoller");
        var Http = require('machinepack-http');
        process.env.NODE_TLS_REJECT_UNAUTHORIZED = "0";
        Http.sendHttpRequest({
            url: '/rest/api/2/project/',
            baseUrl: 'https://jira.domain.com',
            method: 'get',
            headers: {
              "Authorization": "Basic YWxhYS52654f0bWFuaTphbGFhNDE0NA=="
            }
        }).exec({
            serverError: function(result) {
                res.send("server error" + JSON.stringify(result));
            },
            success: function(result) {
             // res.send("Projects loaded successfully");
             res.send(result);
            }
        });
    }    
};

In server/app/config/routes : I add : 

'get /projects' : 'JiraController.loadProject'

But what I want to do is get the Project data on the client side with Ember.js, in other words, I want that sails.js request the JIRA API Rest, and then pass the data (JSON) to Ember.js which will display it in a View.

How can I do that please !?

EDIT :

In the client side I did this :

//pods/components/project/component.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
    return Ember.$.getJSON('/api/v1/projects');
  }
});

How can I render this JSON in my view ?

Matt
  • 4,462
  • 5
  • 25
  • 35
Alaa-GI
  • 410
  • 1
  • 5
  • 19
  • Are you currently getting "Projects loaded successfully" in the client? If so, assuming `result` has the JSON data you need you can just pass that object in `res.send()`. – brittonjb May 28 '15 at 18:25
  • No, I don't know how to get the result from the client side, that's my question – Alaa-GI May 28 '15 at 22:29
  • Is there a specific reason you want the sails side to request the data? Instead of having ember query the sails api to query the other api why not just use ember to query the other api directly? – Craicerjack May 29 '15 at 09:20
  • 2
    Using Sane Stack, Ember ans Sails communicate natively, and the reason why I want Sails to communicate with the external API it's because I will have different client side (Ember Client, Mobile Client ...) I want to get all the data from Sails.js Server side. Is this architecture of my application a good idea btw ? – Alaa-GI May 29 '15 at 09:32
  • @Craicerjack Do you have any idea please :) ? – Alaa-GI May 29 '15 at 14:31
  • I havent used sails but looking at the docs quickly should your api call from ember not be to the action on the sails controller - `model(){ return Ember.$.getJSON('/api/v1/projects/loadProject) }`? – Craicerjack May 29 '15 at 15:02
  • What is the output if you enter the url `/api/v1/projects` into your browser address bar? – Craicerjack May 29 '15 at 15:03
  • these might help - http://stackoverflow.com/questions/21757848/how-to-use-external-rest-api-in-sails-js-nodejs-mvc, http://stackoverflow.com/questions/18451158/how-to-access-external-api-using-sails-js. Also your `success` method isnt returning `json` – Craicerjack May 29 '15 at 15:11
  • @Craicerjack 404 not found i tried also this URL (which is the correct one I think): 127.0.0.1:1337/projects – Alaa-GI May 29 '15 at 19:29
  • 1
    @Alaa-GI well first you need to figure out the rails side and get that showing data. Then worry about the client side. – Craicerjack May 29 '15 at 19:38
  • @Craicerjack In a experimental project I can show up my data, I think the source of my problem is that all my route are protected and can't be acceeded without credentials. – Alaa-GI May 29 '15 at 21:49
  • yeah that would do it. – Craicerjack May 30 '15 at 10:54
  • 2
    Have you tried adding a callback to your getJSON, to check whether result is returned? like `Ember.$.getJSON('/api/v1/projects', function(res) { console.log('response', res)})` – Mehdi Jun 06 '15 at 16:37
  • 1
    Actually it returns nothing : "response" Object { projects: Array[0] } – Alaa-GI Jun 08 '15 at 07:47
  • the default URL for the Project Controller in sails should be get "/project" or "/projects". If you are getting 404 - you are hitting the wrong url. – jbrass Jun 23 '15 at 23:05

1 Answers1

1

I think there is some implementation fault in your code.

Very first thing is you are writing a Ember.Route inside a component.js file, which is wrong. This way your route is called component and as this is the wrong location, your model gets empty. There is one more reason why this is not working. See, how you are calling model hook! The correct way is as follows:

import Ember from 'ember';

export default Ember.Route.extend({
    model: function() {
        return Ember.$.getJSON('/api/v1/projects');
    }
});

Put this at app/routes/components/component.js This way your route is called component. Now you must be able to access the equivalent model data in your view which should ideally be at app/templates/components/component.hbs.

Manvendra SK
  • 802
  • 1
  • 10
  • 20