JSPとSpring-mvcを使用した動的JSON URL

Question

webappの変数-IdをJSON GETからSpring-mvc Controllerに渡したいとします。私はjsonで動作する静的URLに問題はありませんが、動的/パラメトリックURLを使用してそれを行うのがベストプラクティスであるかどうかはわかりません。

コントローラ部：

@RequestMapping(value="/delete/{wordId}", method = RequestMethod.GET) 
@ResponseStatus(HttpStatus.NO_CONTENT) 
public void deleteWord(@RequestParam ("wordId") Long wordId, Principal principal) { 

    wordService.deleteWord(wordId, principal.getName()); 
} 

JSPパーツ：これまで

<c:choose> 
    <c:when test="${not empty accountWords}"> 
     <c:forEach items="${accountWords}" var="word" varStatus="status"> 
      <li class="word"> 
       <input type="checkbox" name="word" class="word_checkbox" value="" /> 
       <span>${word.word}</span> 
       <s:url value="/words/delete/${word.wordId}" var="delete_word"></s:url> 
       <a href="${delete_word}"><img src="resources/gfx/delete.png" /></a> 
      </li> 
     </c:forEach> 
    </c:when> 
</c:choose> 

jQueryの一部：

$("li.word a").click(function(e) { 
    e.preventDefault(); 
    var deleteUrl = ... 
    $.getJSON(deleteUrl, function() { 

    }); 
}); 

wordId変数をコントローラーに渡すためにjqueryの部分がどのように見えるのでしょうか？私はタグのhref属性からURLを得ることができますが、私は相対的なURLを持っていると思います。私はstuckedだ...

UPDATE：

$("#testJSON").click(function() { 
    $.getJSON("admin/json.html", function(w) { 
     $('#span_json').html("w.wordId + "<br>" + w.word); 
    }); 
}); 

Answer 1

wordIdはURLの一部であるため、あなたの代わりに@RequestParamの@PathVariableアノテーションを使用する必要があります。

また、ベストプラクティスについて尋ねたので、冪等ではないアクションに対してHTTP GETメソッドを使用するのは良い方法ではないことを指摘しておきます。つまり、データベースからレコードを削除するなど、サーバー側のデータを変更する操作にはGETを使用しないでください。

適切な HTTP削除メソッドは、HTTP DELETEメソッドです。古いブラウザの中にはDELETEをサポートしていないものがありますので、削除の代わりにPOSTを行うコードがたくさんあります。私はそれがもう多くの問題だとは思わない。詳細については、http://annevankesteren.nl/2007/10/http-method-supportを参照してください。

GETの代わりにDELETEを使用するのは、「適切なやり方をする」ための良い考えではありません。実際には、いくつかの厄介な問題を回避するのに役立ちます。ページ上のすべてのリンクをプリフェッチし、それらをローカルキャッシュに保存することで、Web上の人々の経験をスピードアップするブラウザプラグインがあります。ユーザーにこれらのプラグインの1つがインストールされている場合、プラグインはページ上のすべての削除リンクを「クリック」します！また、公開アプリケーションを構築する場合は、検索エンジンのクローラも削除リンクに従います。私はこれが現実の世界で起こるのを見ました。それで本当に心配です！

RESTfulなもう1つのベストプラクティスは、/ noun/{id}のパターンに続くURLをHTTPメソッドを動詞として使用することです。したがって、/ delete/{wordId}の代わりにGETを使うと、/ word/{wordId}とDELETEを併用する方がよいでしょう。私の提案のすべてに

はあなたのコードは次のようになります変更：

コントローラ

残念ながら

@RequestMapping(value="/word/{wordId}", method = RequestMethod.DELETE) 
@ResponseStatus(HttpStatus.NO_CONTENT) 
public void deleteWord(@PathVariable ("wordId") Long wordId, Principal principal) { 
    wordService.deleteWord(wordId, principal.getName()); 
} 

あなたがGETの代わりにDELETEを使用する場合、jQueryとJSPは少しトリッキーになります。GETあなたはこのように行ったようにあなただけの、リンクを構築することができますので、本当に魅力的です。

<a href="${delete_word}"><img src="resources/gfx/delete.png" /></a> 

代わりにDELETEを使用するには、ブラウザを取得するには、次のいずれかは、その方法DELETEであるフォームを持っている必要があります、またはあなたがする必要がありますAjax DELETEを行うJavaScriptを呼び出します。 （すでにアヤックスを使用しているので、それは私が一緒に行くよ技術です。）私はボタンにあなたのリンクを変更することにより、起動したい：これは言葉のIDを保存するボタンを作成

<button class="delete-button" id="delete_${delete_word}"><img src="resources/gfx/delete.png" /></button> 

ますボタン自体のIDで削除したいどういうわけか、すべてのボタンで削除する単語のIDを関連付ける必要があります。これがその方法の1つです。私は他の人がボタンの隣の隠れた範囲にidを置くのを見ました。 （正直言って、私はこれらのテクニックを一度も愛していませんでした。誰かが私の答えをより良い方法でフォローしてくれることを願っています。）とにかく、JSP本体の変更すべての削除ボタンのクリックを処理するいくつかのjQueryを追加したいと思います。 （私はjQueryの中で参照しやすくなるように、「削除ボタン」というボタンにクラスを入れて注意してください。）

をjQueryの：私はから単語IDを抽出する方法

$(".delete-button").on("click", function() { 
    var wordId = $(this).attr("id").substring("delete_".length); 
    $.ajax({ 
     type: "DELETE", 
     url: "/word/" + wordId, 
     success: function() { 
      // Maybe put some code here that deletes the <li> ? 
     } 
    }); 
}); 

お知らせクリックされたボタンのid属性：

var wordId = $(this).attr("id").substring(7); 

：

もちろん

var wordId = $(this).attr("id").substring("delete_".length); 

あなたはこのようにそれを行うこともでき

私はそれが部分文字列が何をしているのかを自己文書化するので、最初のやり方が好きです。 2番目の例では、数字7は何が起こっているのかを説明しないマジックナンバーです。