hayajo/mojolicious-jsonp.pl

## gistfile1.html
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$( function() {
  $('#hello').click(
    function() {
      $.ajax({
        url: "http://localhost:3000/hello.js",
        type: "GET",
        dataType: "jsonp",
        timeout: 1000,
        success: function(data) {
        console.log(data.hello);
          $("#response").html(data.hello);
        },
        error: function(data) {
          console.error(data);
        },
        complete: function(data) {
          console.log("complete", data);
        }
      });
    }
  );
} );
</script>
</head>
<body>
<button id="hello">Hello</button>
<div id="response"></div>
</body>
</html>

## mojolicious-jsonp.pl
#!/usr/bin/env perl
use Mojolicious::Lite;

get '/hello' => sub {
    my $self = shift;

    my $data = { hello => [qw/foo bar baz/]->[ int(rand(3)) ] };

    $self->respond_to(
        js => sub {
            my $self = shift;

            my $cb   = $self->param('callback') || 'jsonp';
            my $json = $self->render( json => $data, partial => 1 );

            $self->render(
                data   => "$cb($json)",
                format => 'js',
            );
        },
        json => { json => $data },
    );
};

app->start;
	<html>
	<head>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
	<script type="text/javascript">
	$( function() {
	$('#hello').click(
	function() {
	$.ajax({
	url: "http://localhost:3000/hello.js",
	type: "GET",
	dataType: "jsonp",
	timeout: 1000,
	success: function(data) {
	console.log(data.hello);
	$("#response").html(data.hello);
	},
	error: function(data) {
	console.error(data);
	},
	complete: function(data) {
	console.log("complete", data);
	}
	});
	}
	);
	} );
	</script>
	</head>
	<body>
	<button id="hello">Hello</button>
	<div id="response"></div>
	</body>
	</html>
	#!/usr/bin/env perl
	use Mojolicious::Lite;

	get '/hello' => sub {
	my $self = shift;

	my $data = { hello => [qw/foo bar baz/]->[ int(rand(3)) ] };

	$self->respond_to(
	js => sub {
	my $self = shift;

	my $cb = $self->param('callback') \|\| 'jsonp';
	my $json = $self->render( json => $data, partial => 1 );

	$self->render(
	data => "$cb($json)",
	format => 'js',
	);
	},
	json => { json => $data },
	);
	};

	app->start;