JSON.parse() fails with unexpected token using Songkick API - json

Question

I'm trying to parse a response from the Songkick API with the following in Node:
router.post('/', function(req, res) {
var artist = req.body.artist;
var id;
res.render('artist', { title: 'Artist', artist: artist });
http.request({host: 'api.songkick.com', path: '/api/3.0/search/artists.json?query=' + artist + '&apikey=myAPIKey'}, function(res) {
res.on("data", function(chunk) {
id = JSON.parse(chunk).resultsPage.results.artist[0].id;
console.log(id);
http.request({host: 'api.songkick.com', path: '/api/3.0/artists/' + id + '/gigography.json?apikey=Z2JWQTvgk4tsCdDn'}, function(res) {
res.on("data", function(chunk) {
console.log(JSON.parse(chunk).resultsPage.results);
});
}).end();
});
}).end();
});
However, JSON.parse fails with SyntaxError: Unexpected token t (the last character changes depending on the artist requested).
Here's an example API response.
How can I fix the syntax error?

Answer 1

basically the same as the other answer. you need to concat the chunks of data and register for an end event and do the parsing there.
Here's one I tried and it seems to work as expected.
var http = require('http');
var artist = 'Beatles'
http.request({host: 'api.songkick.com', path: '/api/3.0/search/artists.json?query=' + artist + '&apikey=Z2JWQTvgk4tsCdDn'}, function(res) {
var response_data = '';
var id;
res.on("data", function(chunk) {
response_data += chunk;
});
res.on('end', function(){
id = JSON.parse(response_data).resultsPage.results.artist[0].id;
console.log(id);
http.request({host: 'api.songkick.com', path: '/api/3.0/artists/' + id + '/gigography.json?apikey=Z2JWQTvgk4tsCdDn'}, function(res) {
var inner_data = '';
res.on("data", function(chunk) {
inner_data += chunk;
});
res.on("end", function(){
console.log(JSON.parse(inner_data).resultsPage.results);
});
}).end();
});
}).end();

Answer 2

I would try to concat the string (arriving in chunks) and then use the end event. Like:
router.post('/', function(req, res) {
var artist = req.body.artist;
var id;
var data1 = '';
res.render('artist', { title: 'Artist', artist: artist });
http.request({host: 'api.songkick.com', path: '/api/3.0/search/artists.json?query=' +
artist + '&apikey=myAPIKey'}, function(res) {
res.on("data", function(chunk) {
data1 += chunk;
});
res.on('end', function(){
id = JSON.parse(data1).resultsPage.results.artist[0].id;
console.log(id);
var data2 = '';
http.request({host: 'api.songkick.com', path: '/api/3.0/artists/' + id + '/gigography.json?apikey=Z2JWQTvgk4tsCdDn'}, function(res) {
res.on("data", function(chunk) {
data2 += chunk;
});
res.on('end', function(){
console.log(JSON.parse(data2).resultsPage.results);
});
}).end();
});
}).end();
});
Basically, it is using data1 and data2 as buffers and calls your function only when all data has arrived.