Springブートを使用して同じページに反復的なフォーム提出

2つのセクションを持つページがあります。最初のセクションはフォームで、2番目のセクションはフォームの応答を示します。このフォームは、添付されたWebカメラからの画像を受け入れます。その結果、Webcam jsラッパーを次のサイトから使用する必要があります。https://github.com/jhuckaby/webcamjs フォームの送信は定期的なプロセスである必要があります。フォームが送信されると、2番目のセクションはフォームの結果を表示し、同じページを使用する必要があります。フォームを再度送信してください。私はこれを達成するためにSpring Boot/Thymeleafを使用しています。次のように私のコードの一部は次のとおりです。Springブートを使用して同じページに反復的なフォーム提出

次のように

<form name="mainform" action=""> 
    <input type="text" name="sbid[]" id="sbid"> 
    <td><input type="submit" value="Compare" onclick="submit_snapshot()"/></td> 
</form> 
<div id="resdiv"> 
    <div><img src="images/imgnew.jpg" alt="" width="100%" height="220" /></div> 
    <p> This is part of the second div</p> 
</div> 
<script> 
    function submit_snapshot() { 
    url=url+'sbid[]='+batchId[i].value; 
    //alert(url); 
    var batchId=document.getElementsByName('sbid[]'); 
    var url='/imagecompare-0.1.0/compare?'; 
    for(var i=0; i<batchId.length-1; i++){ 
    url=url+'sbid[]='+batchId[i].value+'&'; 
    } 

    Webcam.upload(webcamuri, url, function(code, text) { 
    document.write(text); 
    }); 

    } 
</script>

form.htmlコントローラコードは次のとおりです。

@CrossOrigin 
@RequestMapping(method = RequestMethod.POST, value = "/compare") 
public String handleCompare(@RequestParam("sbid[]") String sbid[], 
    @RequestParam("webcam[]") MultipartFile webcamFiles[], 
    RedirectAttributes redirectAttributes, Model model) throws IOException { 

    return "formresults"; 
}

formresultsページはほとんど除き、form.htmlと同じですresdivという名前の2番目のdivが異なるデータを持っていることを確認してください。

<div id="resdiv"> 
    <div><img src="images/imgnew.jpg" alt="" width="100%" height="220" /></div> 
    <p> This is part of the result div</p> 
</div>

しかし、このデザインはうまくいかないようです。 form.htmlからのフォーム提出は、適切にformresultsにリダイレクトされ、データを表示します。しかし、私がformresultsページから後続のフォームリクエストを実行すると、正しいフォームレスポンスが表示されません。代わりに自動的にform.htmlにリダイレクトされます。誰かがこの現象が起こっている理由を指摘するのに役立つでしょうか。

出典

2016-11-09 seriousgeek