1

I've been at this for a while, but am missing something. I've just set up a simple Sinatra app returning JSON:

get '/json' do
 content_type :json
 $data.to_json
end

This is working fine, and then the javascript I'm using to do a cross domain request is 

$.getJSON("http://domain.com/json?callback=?", function(data) {
 console.log(data);
});

Unfortunately with this I just keep getting the error in the console Uncaught SyntaxError: Unexpected token : and although I've tried a just using the $.ajax method instead, I still get the same result.

Is this an error on my server or client side code? any help appreciated.

asked Nov 3, 2012 at 13:18
7
  • $data is a hash compiling values from a couple of different sources. Commented Nov 3, 2012 at 13:21
  • Oh, sorry, I meant, where do you get this error? :) Commented Nov 3, 2012 at 13:24
  • through the console in Chrome Commented Nov 3, 2012 at 13:28
  • I think this is an error on the server side. There must be something wrong with the json. Also you can check if using callback without arguments will throw the error also. It should not. There must be something wrong with the hash. Commented Nov 3, 2012 at 13:35
  • a useful thing when having problems with json is to run the returned json through any of the json lint thingies on the web. (google "json lint") Commented Nov 3, 2012 at 13:49

2 Answers 2

2

You mentioned you are making a cross domain request. For JSONP, you need to wrap your json response to mimic a function call. There is a Sinatra helper which makes it easy.

answered Nov 3, 2012 at 19:39
Sign up to request clarification or add additional context in comments.

2 Comments

thanks kxb. Thought I wouldn't need a 3rd party lib, but this did the trick.
Just a note on this. Although it works, the retuned data is a sting, and needs to be then converted into a JSON object with data: jQuery.parseJSON(data) in order to be used within other functions.
1

Here working example with different port

Ruby with Sinatra 

require 'rubygems'
require 'sinatra'
require "sinatra/jsonp"
get '/note/all/' do
 data = ["hello","hi","hallo"]
 JSONP data # JSONP is an alias for jsonp method
End

HTML hosted on apache

<head id="Head1" runat="server">
 <title> English </title>
 <link href="Styles/Site.css" rel="stylesheet" type="text/css" />
 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
 <script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
 $(function () {
 // to update alternative address
 $('#Updateprofile').click(function () {
 var key = "nickname"
 var details = $('#nickname').val();
 $.ajax({
 type: 'GET',
 url: 'http://localhost:4567/note/all/',
 crossDomain: true,
 data: '',
 dataType: 'jsonp',
 success: function(responseData, textStatus, jqXHR) {
 $('#controlstatus').html(+responseData);
 },
 error: function (responseData, textStatus, errorThrown) {
 alert('POST failed.'+textStatus);
 }
 });
 });
 });
</script>
</head>
<body>
 <form id="mstform" method="post" runat="server">
<input id="nickname" type="text" style="border: thin solid #C0C0C0; background-color: #EFEFEF;
 width: 300px;" />
 <br />
 <br />
 <img alt="update" id="Updateprofile" src="images/save.png" title="Clicking this button will update your profile" />
 <br />
 <br />
<div id="controlstatus"> details should be here
</div>
 </form>
</body>
answered Sep 28, 2013 at 3:03

Comments

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

By clicking "Post Your Answer", you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.