javascript
Spring MVC,Ajax和JSON第1部分–设置场景
我一直在考慮在Spring,Ajax和JSON上寫博客,但是我從來沒有做過。 這主要是因?yàn)樗浅?fù)雜,并且所需的技術(shù)一直處于變化狀態(tài)。 當(dāng)我決定撰寫此博客時(shí),我在Internet上有一個(gè)偵察員,如果您查看諸如Stack Overflow之類的地方,您會(huì)看到許多不同且通常相互矛盾的答案,這些問題是“我如何編寫Spring Ajax / JSON應(yīng)用程序? ” 我認(rèn)為這是Spring專家的錯(cuò),因?yàn)樗麄円恢痹诿τ诟纳芐pring對(duì)JSon的支持。 不僅是JQuery的專家們也很忙,這意味著在過去的幾年中,總體情況發(fā)生了巨大變化,并且給出了“如何編寫Spring Ajax / JSON應(yīng)用程序”的答案。 已經(jīng)過時(shí)了。
如果查看Keith Donald的原始Spring 3 MVC Ajax應(yīng)用程序,您會(huì)發(fā)現(xiàn)它非常復(fù)雜。 支持JSON集成需要大量的樣板代碼和一些怪異JavaScript。 在最新版的Spring中,所有更改都已完成。 正如我所說的,Spring和JQuery的Guy一直很忙,現(xiàn)在事情變得簡(jiǎn)單得多。 編寫此類應(yīng)用程序時(shí),需要考慮一些步驟。 首先,您需要將能夠發(fā)出Ajax請(qǐng)求的頁面加載到瀏覽器中。 其次,您必須編寫一些代碼來服務(wù)Ajax請(qǐng)求,最后,頁面必須顯示其結(jié)果。 為了演示Spring MVC,Ajax和JSON,我將使用購物網(wǎng)站場(chǎng)景。 在這種情況下,當(dāng)用戶單擊“電子商務(wù)頁面”鏈接時(shí),該應(yīng)用程序?qū)哪夸浿屑虞d一些項(xiàng)目并將其顯示在頁面上。 然后,用戶檢查多個(gè)項(xiàng)目并按“確認(rèn)購買”。 現(xiàn)在,這就是Ajax和JSON的來源,在按“確認(rèn)購買”時(shí),瀏覽器向向其發(fā)送項(xiàng)目ID的服務(wù)器發(fā)出Ajax請(qǐng)求。 然后,服務(wù)器從數(shù)據(jù)庫中檢索項(xiàng)目,并將它們作為JSON返回到瀏覽器。 然后,瀏覽器處理JSON,并在屏幕上顯示項(xiàng)目。 在編寫代碼時(shí),第一步是使用Spring儀表板上可用的項(xiàng)目模板來創(chuàng)建Spring MVC項(xiàng)目。
擁有空白項(xiàng)目后,需要對(duì)項(xiàng)目的POM文件進(jìn)行一些更改。 首先,您需要添加Jackson JSON Processor依賴項(xiàng)。 接下來,您需要將Spring的版本更新為3.2.2。 這是因?yàn)槟0屙?xiàng)目生成器仍會(huì)生成3.1.1版本的項(xiàng)目。
<dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-core</artifactId><version>2.0.4</version></dependency><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.0.4</version></dependency><org.springframework-version>3.2.2.RELEASE</org.springframework-version>如果查看我在Github上可用的代碼,您會(huì)發(fā)現(xiàn)我還添加了Tomcat Maven插件并將Java編譯器源/目標(biāo)版本設(shè)置為1.7。 這些都是可選步驟。
接下來要做的是創(chuàng)建一個(gè)Item類來定義用戶將從我們虛構(gòu)的目錄中購買的項(xiàng)目。
public class Item { private final int id; private final String description; private final String name; private final BigDecimal price; private Item(int id, String name, String description, BigDecimal price) { this.id = id; this.name = name; this.description = description; this.price = price; } public final BigDecimal getPrice() { return price; } public final int getId() { return id; } public final String getDescription() { return description; } public final String getName() { return name; } public static Item getInstance(int id, String name, String description, BigDecimal price) { Item item = new Item(id, name, description, price); return item; } }上面的代碼定義了我們簡(jiǎn)單的Item 。 它的屬性包括id , name , description和price 。
此購物場(chǎng)景的下一步是編寫在屏幕上顯示商品的代碼,以便用戶可以進(jìn)行選擇并將其提交給服務(wù)器。 如您所料,這涉及編寫包含表單的JSP并使用Spring MVC控制器處理來自表單的請(qǐng)求。 我將首先討論控制器代碼,因?yàn)樗鼪Q定了JSP的編寫方式。
/** * Create the form */ @RequestMapping(value = "/shopping", method = RequestMethod.GET) public String createForm(Model model) { logger.debug("Displaying items available in the store..."); addDisplayItemsToModel(model); addFormObjectToModel(model); return FORM_VIEW; } private void addDisplayItemsToModel(Model model) { List<Item> items = catalogue.read(); model.addAttribute("items", items); } private void addFormObjectToModel(Model model) { UserSelections userSelections = new UserSelections(); model.addAttribute(userSelections); }使我們的表單顯示在屏幕上的控制器方法是createForm(…) 。 該方法由通常的RequestMapping注釋進(jìn)行注釋,該注釋告訴Spring將所有具有“ shopping ” URL的GET請(qǐng)求映射到該位置。 該方法包括三個(gè)步驟:首先讀取目錄,以獲得要顯示的項(xiàng)目列表;然后,執(zhí)行以下步驟: 然后,它創(chuàng)建一個(gè)UserSelections對(duì)象,該表單在提交用戶購買的商品時(shí)由表單使用。 最后,它將我們定向到shopping.jsp 。
對(duì)于這種形式的創(chuàng)建方法,這些設(shè)置步驟是很正常的:首先將顯示數(shù)據(jù)添加到模型中,然后將表單提交方式添加到模型中; 但是,這兩個(gè)步驟經(jīng)常結(jié)合在一起。
在控制器代碼中,您還將看到用于獲取項(xiàng)目的catalogue對(duì)象。 在實(shí)際的應(yīng)用程序中,這等效于創(chuàng)建一個(gè)服務(wù)層組件,該組件使用DAO和通常與此類應(yīng)用程序關(guān)聯(lián)的所有用具來讀取數(shù)據(jù)。 在這種情況下,它只是從硬編碼數(shù)組創(chuàng)建項(xiàng)目列表,并不重要。
該控制器代碼與下面的JSP代碼片段非常緊密地聯(lián)系在一起:
<form:form modelAttribute="userSelections" action="confirm" method="post"><c:forEach items="${items}" var="item"><div class="span-4 border"><p><c:out value="${item.name}" /></p></div><div class="span-8 border"><p><c:out value="${item.description}" /></p></div><div class="span-4 border"><p>£<c:out value="${item.price}" /></p></div><div class="span-4 append-4 last"><p><form:checkbox value="${item.id}" path="selection"/></p></div></c:forEach><div class="prepend-12 span-4 append-12"><p><input class="command"type="submit" name="action"value="Confirm Purchase"accesskey="A" /></p></div></form:form>這里有幾點(diǎn)要注意。 首先,我通過使用Spring表單標(biāo)簽(<form:form…>)使自己的生活變得輕松,其次,我正在使用Blueprint格式化頁面。 在設(shè)置表單標(biāo)簽時(shí),首先要考慮的是表單標(biāo)簽的屬性: modelAttribute , command和method 。 modelAttribute用于綁定的UserSelections由控制器到HTML表格提供的類。 command屬性是一個(gè)URL,它告訴瀏覽器在何處提交其數(shù)據(jù),而method屬性則告訴瀏覽器將提交的內(nèi)容POST到服務(wù)器。
在JSP的下一部分中,我使用了forEach循環(huán)來顯示先前從目錄中檢索到的項(xiàng)目。 重要的一行是form:checkbox標(biāo)記。 您可能會(huì)懷疑,這會(huì)使用項(xiàng)目的ID和selection “路徑”創(chuàng)建一個(gè)HTML復(fù)選框。 對(duì)我而言,“路徑”一詞聽起來令人困惑。 Spring的員工實(shí)際上的意思是“提交時(shí),取走存儲(chǔ)在復(fù)選框的value屬性(item.id)中的值,如果選中,則將其存儲(chǔ)在
使用setSelection(…)方法的UserSelections對(duì)象”。 這可能是在后臺(tái)完成的,方法是解析HttpServletRequest對(duì)象,然后使用Java反射進(jìn)行一些挑剔的撲克操作。 需要注意的是,JSP中的名稱如何與UserSelection類的屬性名稱聯(lián)系UserSelection 。
我發(fā)現(xiàn)Spring表單標(biāo)簽在大多數(shù)情況下非常有用; 但是,為了使事情簡(jiǎn)單,它在綁定到哪個(gè)HTML對(duì)象的數(shù)據(jù)上確實(shí)有一些限制。 當(dāng)您遇到這些限制之一時(shí),請(qǐng)結(jié)合使用更多詳細(xì)的Spring Bind標(biāo)簽和form標(biāo)簽。
好的,因此,當(dāng)您運(yùn)行此代碼時(shí),將顯示一個(gè)類似于以下內(nèi)容的屏幕:
問題是,我知道我在此博客中沒有談?wù)撨^AKAX和JSON,但我需要設(shè)置場(chǎng)景。 在該博客的第二部分中,我一定會(huì)介紹該場(chǎng)景的實(shí)質(zhì)部分:通過Ajax調(diào)用獲取和顯示JSON數(shù)據(jù)。 有關(guān)此博客的完整源代碼,請(qǐng)參見GitHub – https://github.com/roghughe/captaindebug/tree/master/ajax-json
翻譯自: https://www.javacodegeeks.com/2013/05/spring-mvc-ajax-and-json-part-1-setting-the-scene.html
總結(jié)
以上是生活随笔為你收集整理的Spring MVC,Ajax和JSON第1部分–设置场景的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 理财风险评估怎么修改?
- 下一篇: 按功能而不是按层打包课程