2016-04-19 5 views
0

私はJavaの世界では非常に新しいので、資格情報のJSON文字列(以下を参照)を変数に格納してからそれを表示できるJSONオブジェクトに変換する方法#welcometext divにあります。JSON HttpServletRequest/HttpServletResponse

私はすでに多くの回答を見ており、何も機能していません。もし誰かが私に何か助けを与えることができたら、私はそれをとても感謝します!

ActionServlet.javaのdoPost:

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
// String body = request.getReader().lines().reduce("", (acc, actual) -> acc + actual); 
    String body = request.getParameter("data"); 
    System.out.println("Body is: " + body); 

    JsonReader jsonReader = Json.createReader(new StringReader(body)); 
    JsonObject obj = jsonReader.readObject(); 
    System.out.println("obj is: " + obj); 
    jsonReader.close(); 

    response.setContentType("application/json"); 
    response.setCharacterEncoding("UTF-8"); 

    } 
} 

のindex.html:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Ajax Demo</title> 
<script src="http://code.jquery.com/jquery-latest.js">    
</script> 
<script> 
    $(document).ready(function() { 

    var form2object = function(form) { 
     var data = {}; 
     $('form').find('input').each(function(index, element) { 
     var type = $(this).attr('type'); 
     if ($(this).attr('name') && type !== 'submit' && type !== 'hidden') { 
      data[$(this).attr('name')] = $(this).val(); 
     } 
     }); 

     return data; 
    }; 

    var wrap = function wrap(root, formData) { 
     var wrapper = {}; 
     wrapper[root] = formData; 
     return wrapper; 
    }; 

    var callback = function callback(error, data) { 
     if (error) { 
     console.error(error); 
     $('#welcometext').val('status: ' + error.status + ', error: ' + error.error); 
     return; 
     } 

     $('#welcometext').val(JSON.stringify(data, null, 4)); 
    }; 


    $('#submit').on('click', function(e) { 
     e.preventDefault(); 
     console.log(form2object(this)); 
     var credentials = wrap('credentials', form2object(this)); 
     console.log("credentials is: " + credentials); 

     $.ajax({ 
     method: 'POST', 
     url: 'JQueryAjaxDemo/ActionServlet', 
     contentType: 'application/json', 
     data: JSON.stringify(credentials, null, 4), 
     dataType: 'json' 
     }, callback); 

    }); //end of on click function 
    }); //end of doc ready 
</script> 
</head> 
<body> 
    <form id="form1"> 
    <h1>AJAX Demo using Jquery and Servlets</h1> 

    Enter your Info: 
    <br> 
    <input name ="name" type="text" id="user" placeholder="name" /> 
    <br> 
    <input name="age" type="text" id="age" placeholder="age"/> 
    <br> 
    <input type="button" id="submit" value="Ajax Submit"/> 
    <div id="welcometext"> 
    </div> 
    </form> 
</body> 
</html> 

答えて

0

あなたはURLのクエリ文字列の値を取得しますrequest.getParameter("data")を呼び出します。しかし、あなたのJavaScriptは、クエリ文字列を使ってサーバにリクエストを送信しているようには見えません。 javascriptが{"credentials": {...}}という本文のPOST要求を送信するように見えます。要求の本文を読むにはrequest.getInputStream()を使用してください。