How to get a json response from yaler

Question

I create an account with yaler, to comunicate with my arduino yun. It works fine, and i'm able to switch on and off my leds. Then i created a web page, with a button that calls an ajax function with GET method to yaler (yaler web server accept REST style on the URL)

$.ajax({
   url: "http://RELAY_DOMAIN.try.yaler.net/arduino/digital/13/1",
   dataType: "json",
   success: function(msg){
      var jsonStr = msg;
    },
   error: function(err){
       alert(err.responseText);
   }

});

This code seem to work fine, infact the led switches off and on, but i expect a json response in success function (msg) like this:

{
"command":"digital",
"pin":13,
"value":1,
"action":"write"
}

But i get an error (error function). I also tried to alert the err.responseText, but it is undefined....

How could i solve the issue? Any suggestions??? Thanks in advance....

Hi, the Yaler relay forwards requests to the Yun Web server, which "accepts REST style on the URL". If the Yun sends a reply, it's forwarded back via the relay to your client. If there's no Yun you'll get a 504 response from the relay. In any other case it's quite safe to assume the response comes from your device, in this case the Yun. A good first step to debug might be to make sure the code works in your local network. Kind regards, Thomas (founder of Yaler.net) — tamberg, Feb 28 '15 at 22:27
Hi and thanks for your reply, the ajax function is able to switch off and on the leds on the yun, quit fine. That code is located in a localhost html page, and it comunicates with the yun. What i need is to recive in the sucess the json data as described above, to manipulate data, and i think it could be a browser limitation, as it is a cross domian request... Wich kind of approach could i use to get that json data in my html page? — pasluc74669, Feb 28 '15 at 22:58
Why "cross domian request"? Doesn't the HTML come from the same Yun? — tamberg, Mar 02 '15 at 00:05
hi tamberg, i need to control the yun from an HTML page, that resides in a different domain. in other word the yun resides in my home, and the HTML in the domain www.xxxxxxx.com. in this case, i am able to work with yun from all over. I don't know if this is the best way to do it. actually i am able to comunicate with yun (i can switch off an on the yun's pin), but i'm not able to recive informations in json format, as if it would be the yaler page, that shows me the pin's state in json format. i need the json response, to manipulate data and, for example, insert them into a db... — pasluc74669, Mar 02 '15 at 10:01
Yaler just forwards request and response back and forth. But it's possible, that the same origin policy is different for local IPs and sites on the Web. A general solution is to add "Access-Control-Allow-Origin: *" to the headers (see https://en.wikipedia.org/wiki/Cross-origin_resource_sharing and http://www.w3.org/TR/cors/#access-control-allow-origin-response-hea), but I'm not sure how to achieve this for the Yun's built in REST API. — tamberg, Mar 02 '15 at 13:07
PS. Started a thread in the Yun forum http://forum.arduino.cc/index.php?topic=304804 — tamberg, Mar 02 '15 at 13:19

score 2 · Accepted Answer · edited Apr 05 '21 at 05:50

If the Web page containing the above Ajax request is served from a different origin, you'll have to work around the same origin policy of your Web browser.

There are two ways to do this (based on http://forum.arduino.cc/index.php?topic=304804):

CORS, i.e. adding the header Access-Control-Allow-Origin: * to the Yun Web service
JSONP, i.e. getting the Yun to serve an additional JS function if requested by the Ajax call with a query parameter ?callback=?

CORS can probably be configured in the OpenWRT part of the Yun, while JSONP could be added to the Brige.ino code (which you seem to be using).

score 0 · Answer 2 · edited Apr 13 '15 at 05:12

I had the same problem. I used JSONP to solve it. JSONP is JSON with padding. Basically means you send the JSON data with a sort of wrapper. Instead of just the data you have to send a Java Script function and this is allowed by the internet.

So instead of your response being :

{"command":"digital","pin":13,"value":0,"action":"write"}

It should be:

showResult({command:"analog",pin:13,value:0,action:"write"});

I changed the yunYaler.ino to do this.

So for the html :

 var url = 'http://try.yaler.net/realy-domain/analog/13/210';
      $.ajax({
        type: 'GET',
        url: url,
        async: false,
        jsonpCallback: 'showResult',
        contentType: "application/json",
        dataType: 'jsonp',
        success: function(json) {
          console.dir(json.action);
        },
        error: function(e) {
         console.log(e.message);
        }
        });
 
        };
    function showResult(show)
      {
      
          var str = "command = "+show.command;// you can do the others the same way.
          alert (str);
      }

My JSON is wrapped with a showResult() so its made JSONP and its the function I called in the callback.

Hope this helps. If CORS worked for you. Could you please put up how it worked here.

How to get a json response from yaler

2 Answers2