javascript
基于Spring提供支持不同设备的页面
基于Spring來檢測訪問Web頁面的設備是很簡單的，在這個經驗中我們講到過。通常不同的設備訪問我們是通過響應式設計來統一處理各種設備的尺寸的。但是如果希望針對不同的設備，顯示不同的內容呢？ Spring對于這一點同樣提供了很好的支持，來看看如何實現。
準備工作
我們通過一個簡單的例子來演示，基于Spring MVC來實現一個簡單的HTTP GET請求，訪問的地址是：
http://localhost:8080/greeting
- 如果從桌面瀏覽器訪問這個地址，則返回的頁面中顯示:Say hello from desktop
- 如果從手機瀏覽器訪問這個地址：則返回的頁面中顯示Say hello from mobile
- 如果從平板電腦訪問這個地址：則返回的頁面中顯示Say hello from tablets
先該準備好開發環境：
- IDE+Java環境（JDK 1.7或以上版本）
- Maven 3.0+（Eclipse和Idea IntelliJ內置，如果使用IDE并且不使用命令行工具可以不安裝）
Maven POM文件的設置
pom.xml
<?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>com.tianmaying.mobilecontent</groupId> <artifactId>content-for-multiple-device</artifactId> <version>0.0.1-SNAPSHOT</version> <packaging>jar</packaging> <name>content-for-multiple-device</name> <description>Demo of serving different content for desktop, mobile and tablet device</description> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.2.5.RELEASE</version> <relativePath/> </parent> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <java.version>1.8</java.version> </properties> <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-mobile</artifactId> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> </project>創建Properties文件
Spring Boot能夠針對不同設備渲染不同的視圖（View），只需要在應用的Properties文件中中稍加配置即可。在src/main/resources/application.properties文件（沒有這個文件，則自己創建這個文件）中增加一行：
spring.mobile.devicedelegatingviewresolver.enabled: true
針對一個請求，LiteDeviceDelegatingViewResolver通過DeviceResolverHandlerInterceptor識別出的Device類型來判斷返回哪種視圖進行響應（桌面、手機還是平板），這一部分大家參考Spring如何識別設備的經驗。
在這個例子中，?LiteDeviceDelegatingViewResolver會將請求代理給ThymeleafViewResolver，作為Spring自身提供的正牌ViewResolver，相比傳統的視圖技術如JSP，Velocity等，有不少過人之處，大家可以回顧一下Thymeleaf的介紹以及如何在Spring MVC中使用Thymeleaf。默認情況下，Spring Boot去到**mobile/和tablet/**文件下去尋找移動端和平板端對應的視圖進行渲染。當然你也可以在屬性文件中進行設置，約定大于配置，沒有特別需求用約定就好了。
創建Controller
Spring Boot的請求都是通過Controller的處理的。Controller的實現非常簡單：
- 通過@Controller標注一個普通的類
- 通過@RequestMapping標注一個方法，設置該方法響應的URL地址和方法（ 如@RequestMapping(method=GET?）
- 在方法中填入Model，返回視圖的名稱
SayHelloController
package com.tianmaying.mobilecontent; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class SayHelloController { @RequestMapping("/sayHello") public String greeting() { return "sayHello"; } }創建視圖
最后讓我們來創建Thymeleaf的視圖模板，這里沒什么模型的數據需要填充，只需要顯示一句話即可：
sayHello.html
<!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>Getting Started: Serving Web Content</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <p th:text="'Say hello from desktop'" /> </body> </html>接下來我們創建存放移動端模板和平板端模板的目錄：
└── src └── main └── resources └── templates └── greeting.html └── mobile └── greeting.html └── tablet └── greeting.html在mobile和tablet目錄下的HTML文件，內容大多是一樣的，唯一不同的就是<p>標簽，分別為：
<p th:text="'Say hello from mobile'" />
<p th:text="'Say hello from tablet'" />
測試
最后我們通過main()函數將這個SpringBootApplication?Run起來：
App.java
package com.tianmaying.mobilecontent; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; @SpringBootApplication public class App { public static void main(String[] args) { SpringApplication.run(App.class, args); } }大家從不同的設備上訪問http://localhost:8080/sayHello就能看到效果了。
轉載于:https://www.cnblogs.com/duyinqiang/p/5696571.html
總結
以上是生活随笔為你收集整理的基于Spring提供支持不同设备的页面的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： hdu2149 巴什博奕
- 下一篇： [原创]Java中字符串、数组、集合及J