ajaxで複数の配列を取得したい

Question

###前提・実現したいこと
ajaxでサーバー側から複数の配列を取得したいです。
お分かりの方がいらっしゃれば、回答よろしくお願い致します。

###発生している問題・エラーメッセージ

SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 2 column 1 of the JSON data

###該当のソースコード

$.ajax({
		type: "POST",
		url : "http://localhost:8080/PosSystem/AllSuggestServlet",
		contentType: "application/x-www-form-urlencoded; charset=UTF-8",
		timeout:10000,
	}).done(function(data){
			var suggest = JSON.parse(data);
			var suggestion = eval(suggest);
			for (var i = 0; i < suggestion.length-1; i++) {
				var name = suggestion[i][4]
				var price = suggestion[i][9]
				price = price.replace( /(\d)(?=(\d\d\d)+(?!\d))/g, '$1,' );
				var pic = suggestion[i][10]
				$("#popularTable").append(
			            $("<tr></tr>")
			                .append($('<td><img src="'+pic+'" alt="画像を表示できません" width="60px" height="50px"></td>'))
			                .append($('<td></td>').text(name))
			                .append($('<td><BUTTON>詳細</BUTTON></td>'))
			    );
				$('td').eq(0).addClass('pic');
				$('td').eq(1).addClass('productname');
				$('#popularTable BUTTON').addClass('detail');

				$("#modalDiv").append($('<div></div>')
							  .append($('<BUTTON></BUTTON>'))
							  .append($('<h1>詳細</h1>'))
							  .append($('<img src="'+pic+'" alt="画像を表示できません" width="260px" height="250px"></td>'))
							  .append($('<h2></h2>').text(name))
							  .append($('<table></table>')
							  .append($('<tr></tr>')
									  .append($('<th></th>').text("取扱い企業名"))
									  .append($('<th></th>').text("価格"))
									  .append($('<th></th>').text("数量"))
									  .append($('<th></th>').text("発送日"))
									  .append($('<th></th>').text("発注"))
							  )
							  .append($('<tr></tr>')
									  .append($('<td></td>').text("株式会社あいうえお"))
						              .append($('<td></td>').text('\\'+price))
						              .append($('<td></td>').text('3つ'))
						              .append($('<td></td>').text('3日'))
						              .append($('<td><BUTTON>発注する</BUTTON></td>'))
							  ))
							  .append($('<BUTTON>すべてキャンセルする</BUTTON>'))
							  .append($('<BUTTON>確定する</BUTTON>'))
				);
				$("#modalDiv div").eq(i).addClass('remodal');//一つ目にしかかからない理由は一つ目のテーブルにしかクラスdata属性をつけてないから
				$("#modalDiv div").eq(i).attr({'data-remodal-id': 'modal'+i,'data-remodal-options': 'hashTracking:false'});
				$("#modalDiv BUTTON").eq(0).addClass('remodal-close');
				$("#modalDiv BUTTON").eq(0).attr({'data-remodal-action': 'close',});
				$("#modalDiv BUTTON").eq(1).addClass('dicision');
				$("#modalDiv BUTTON").eq(2).addClass('remodal-cancel');
				$("#modalDiv BUTTON").eq(2).attr({'data-remodal-action': 'cancel',});
				$("#modalDiv BUTTON").eq(3).addClass('remodal-confirm');
				$("#modalDiv BUTTON").eq(3).attr({'data-remodal-action': 'confirm',});
				$("#modalDiv BUTTON").eq(4).addClass('remodal-close');
				$("#modalDiv BUTTON").eq(4).attr({'data-remodal-action': 'close',});
				$("#modalDiv BUTTON").eq(5).addClass('dicision');
				$("#modalDiv BUTTON").eq(6).addClass('remodal-cancel');
				$("#modalDiv BUTTON").eq(6).attr({'data-remodal-action': 'cancel',});
				$("#modalDiv BUTTON").eq(7).addClass('remodal-confirm');
				$("#modalDiv BUTTON").eq(7).attr({'data-remodal-action': 'confirm',});
				$("#modalDiv BUTTON").eq(8).addClass('remodal-close');
				$("#modalDiv BUTTON").eq(8).attr({'data-remodal-action': 'close',});
				$("#modalDiv BUTTON").eq(9).addClass('dicision');
				$("#modalDiv BUTTON").eq(10).addClass('remodal-cancel');
				$("#modalDiv BUTTON").eq(10).attr({'data-remodal-action': 'cancel',});
				$("#modalDiv BUTTON").eq(11).addClass('remodal-confirm');
				$("#modalDiv BUTTON").eq(11).attr({'data-remodal-action': 'confirm',});
				$("#modalDiv table").addClass('toriatukai');
			}
	}).fail(function(data){});

package suggestion;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.Collections;
import java.util.LinkedList;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import com.google.gson.Gson;

import myclass.WineCategory;

/**
 * Servlet implementation class ComprehensiveProposal
 */
@WebServlet(asyncSupported = true, urlPatterns = { "/AllSuggestServlet" })
public class AllSuggestServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	/**
	 * 目的：一番売れているワインの色を調べ、その属性を分析する
	 * １．一番売れている商品群を調べる
	 * ２．一番売れているカテゴリーを変数へ代入
	 * ３．その変数の詳細を分析し、どの属性(重さと味)が一番売れているか調べる
	 */

    /**
     * @see HttpServlet#HttpServlet()
     */
    public AllSuggestServlet() {
        super();
        // TODO Auto-generated constructor stub
    }

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	@SuppressWarnings({ "unchecked", "unused" })
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		int red = 0,white = 0,rose = 0,spaW = 0,spaR = 0,other = 0,maxQuantity = 0,bestLiquors = 0,bestWeightFlavorCate = 0;
		int intFullSweet = 0,intFullSpicy = 0,intMidSweet = 0,intMidSpicy = 0,intLightSweet = 0,intLightSpicy =0;
		String maxLiquor = null,maxWeight = null,maxFlavor = null;
		ArrayList<Integer> arrayLiquor= new ArrayList<Integer>(),arrayDetail = new ArrayList<Integer>();

		HttpSession session = request.getSession(true);

		LinkedList<LinkedList<String>>  saleTbl =
				new LinkedList<LinkedList<String>>();
		saleTbl =  (LinkedList<LinkedList<String>>) session.getAttribute("saleTbl");//取れてる

		WineCategory wc = new WineCategory();
		/*WineCategory{redWine,whiteWine,rose,sparklingWhite,sparklingRed,other}*/
		arrayLiquor = wc.saleCate(saleTbl);
		red = arrayLiquor.get(0);
		white = arrayLiquor.get(1);
		rose = arrayLiquor.get(2);
		spaW = arrayLiquor.get(3);
		spaR = arrayLiquor.get(4);
		other = arrayLiquor.get(5);

		/*一番売れているワインのカテゴリーを変数へ代入する*/
		Collections.sort(arrayLiquor);
		/*一番売れているワインの色を取得*/
		bestLiquors = arrayLiquor.get(arrayLiquor.size()-1);
		/*一番売れている商品のリキュールIDを取得*/
		if(bestLiquors == red){
			maxLiquor ="1";
		}else if(bestLiquors == white){
			maxLiquor ="2";
		}else if(bestLiquors == rose){
			maxLiquor ="3";
		}else if(bestLiquors == spaW){
			maxLiquor ="4";
		}else if(bestLiquors == spaR){
			maxLiquor ="5";
		}else if(bestLiquors == other){
			maxLiquor ="6";
		}

		LinkedList<LinkedList<String>> suggestCampanyTbl = new LinkedList<LinkedList<String>>();
		suggestCampanyTbl = (LinkedList<LinkedList<String>>) session.getAttribute("suggestProductTbl");
		response.setContentType("text/html; charset=UTF-8");
		PrintWriter out = response.getWriter();
		Gson gson = new Gson();
	    response.setHeader("Access-Control-Allow-Origin", "*");//これもないとダメかも
	    out.println(gson.toJson(suggestionTbl));//1つ目の配列
	    out.println(gson.toJson(suggestCampanyTbl));//2つ目の配列
		out.close();
	}
}

###試したこと
ajax側の処理doneの引数を複数選択すると2つ目のの引数にはsuccessという文字が入っている。
そして、一つ目の引数に二つの配列が格納されているので、このエラーが発生している気がする。
###補足情報(言語/FW/ツール等のバージョンなど)
eclipse 4.5
windows10
jquery1.x系

Answer 1

JSONのフォーマットを勉強してください。
たぶん、

'["aa","bb"]["cc","dd"]'

といったデータをレスポンスで返していると予想しますが、これではJSONのフォーマットに従っていないため、
サーバー側で、

{
   "arrayA": ["aa","bb"],
   "arrayB": ["cc", "dd"]
}

いった感じで、JSONフォーマットに従ったデータを返すようにするか、
JS側で

'[ "aa", "bb" ]'
'[ "cc", "dd" ]'

と二つの文字列に分割してからJSON.parse()を行うようにすればいいのではないでしょうか。

Answer 2

var suggest = JSON.parse(data); で data に代入されるのは JSON 文字列をパースした後の JavaScript オブジェクトになると思うのですが、それを再びパースするというのが問題のような気がします。（気がするだけで検証はしてませんが）

要求・応答を Fiddler などのキャプチャツールで見て、期待通り要求が出ているか、応答が帰ってきているか、返ってきた JSON 文字列は期待通りかを調べて、JSON 文字列が戻ってきていればそれを書いていただけませんか？

そうしていただいた方が確実で、さらに、Java は知らなくても jQuery.ajax は知っている人も回答できて、回答を得られるチャンスが増えると思います。

response.setHeader("Access-Control-Allow-Origin", "*");//これもないとダメかも

それはクロスドメインでサーバーに要求をかける際 Cross-Origin Resource Sharing (CORS) という方法に基づいて応答ヘッダに含めるものということは理解されてますか？

実際にクロスドメインでのやり取りなんでしょうか？ だとすると、要求ヘッダの contentType に text/html; charset=utf-8 が含まれるので「シンプルなリクエスト」にはならず、「プリフライトリクエスト」が事前に行われるはずです。その対応がされてないように見えますが・・・

でも、エラーは var suggest = JSON.parse(data); で出るということですと、実際は同一ドメインで応答は帰ってきているような気もします。

あと、その後 var suggestion = eval(suggest); としてますが、それはどういうことをしようとしているのでしょう。