第七章：文件上傳-4. 使用圖片服務器

在微架構的系統之中，若是要保存上傳圖片內容，確定要保存在圖片服務器之中，由於若是你直接保存在web項目裏面，那麼該圖片只有一個web容器能夠看見，而且在集羣之中容器之間的數據也無法進行共享，那麼久須要有一個圖片服務器，本次使用fastdfs的圖片服務器完成總體的圖片保存。

1.若是要想使用圖片服務器，則首先必定要進行一些依賴包的配置，修改pom.xml配置文件，追加fastdfs依賴支持包:

<dependency>
			<groupId>com.github.kischang</groupId>
			<artifactId>fastdfs-client</artifactId>
			<version>0.1</version>
		</dependency>

完整pom

<?xml version="1.0"?>
<project
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"
	xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>cn.mldn</groupId>
		<artifactId>microboot</artifactId>
		<version>0.0.1-SNAPSHOT</version>
	</parent>
	<artifactId>microboot-upload</artifactId>
	<name>microboot-upload</name>
	<url>http://maven.apache.org</url>
	<properties>
		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
	</properties>
	<dependencies>
		<dependency>
			<groupId>com.github.kischang</groupId>
			<artifactId>fastdfs-client</artifactId>
			<version>0.1</version>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-thymeleaf</artifactId>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-jetty</artifactId>
		</dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-web</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
			<scope>test</scope>
		</dependency>
		<dependency>
			<groupId>org.springframework</groupId>
			<artifactId>springloaded</artifactId>
		</dependency>
		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-devtools</artifactId>
		</dependency>

	</dependencies>
</project>

2.隨後因爲該圖片服務器有token認證處理過程，因此必定要保證有認證的配置文件，在"src/main/resources"目錄之中建立"fastdfs_client.conf"文件

# 配置上你tracker的鏈接地址
tracker_server=fastdfs-tracker:22122
# 表示如今要進行token檢測
http.anti_steal_token=true
# 進行認證的密碼處理
http.secret_key=mldnhelloworldhahheihanhheiehinajueduicaibudao

3.修改控制器中的上傳處理操做

microboot/pom.xml

<includes>
					<include>**/*.properties</include>
					<include>**/*.yml</include>
					<include>**/*.xml</include>
					<include>**/*.tld</include>
					<include>**/*.p12</include>
					<include>**/*.conf</include>
				</includes>

完整pom

<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>cn.mldn</groupId>
	<artifactId>microboot</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<packaging>pom</packaging>
	<name>microboot</name>
	<url>http://maven.apache.org</url>
	<properties>
		<jdk.version>1.8</jdk.version>
		<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
	</properties>
	<dependencyManagement>
		<dependencies>
			<dependency>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-dependencies</artifactId>
				<version>1.5.4.RELEASE</version>
				<type>pom</type>
				<scope>import</scope>
			</dependency>
		</dependencies>
	</dependencyManagement>
	<build>
		<finalName>microboot</finalName>
		<resources>
			<resource>
				<directory>src/main/resources</directory>
				<includes>
					<include>**/*.properties</include>
					<include>**/*.yml</include>
					<include>**/*.xml</include>
					<include>**/*.tld</include>
					<include>**/*.p12</include>
					<include>**/*.conf</include>
				</includes>
				<filtering>false</filtering>
			</resource>
			<resource>
				<directory>src/main/java</directory>
				<includes>
					<include>**/*.properties</include>
					<include>**/*.xml</include>
					<include>**/*.tld</include>
				</includes>
				<filtering>false</filtering>
			</resource>
			<resource>
				<directory>src/main/view</directory>
				<includes>
					<include>**/*.*</include>
				</includes>
				<filtering>false</filtering>
			</resource>
		</resources>
		<plugins>
			<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-compiler-plugin</artifactId>
				<configuration>
					<source>${jdk.version}</source><!-- 源代碼使用的開發版本 -->
					<target>${jdk.version}</target><!-- 須要生成的目標class文件的編譯版本 -->
					<encode>${project.build.sourceEncoding}</encode>
				</configuration>
			</plugin>
			<plugin>	<!-- 該插件的主要功能是進行項目的打包發佈處理 -->
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
				<configuration>	<!-- 設置程序執行的主類 -->
					<mainClass>cn.mldn.microboot.StartSpringBootMain</mainClass>
				</configuration>
				<executions>
					<execution>
						<goals>
							<goal>repackage</goal>
						</goals>
					</execution>
				</executions>
			</plugin>
		</plugins>
	</build>
	<modules>
		<module>microboot-base</module>
		<module>microboot-advance</module>
		<module>microboot-error</module>
		<module>microboot-tomcat</module>
		<module>microboot-thymeleaf</module>
		<module>microboot-upload</module>
	</modules>
</project>

package cn.mldn.microboot.controller;

import java.util.Iterator;
import java.util.List;

import javax.servlet.http.HttpServletRequest;

import org.csource.common.NameValuePair;
import org.csource.fastdfs.ClientGlobal;
import org.csource.fastdfs.ProtoCommon;
import org.csource.fastdfs.StorageClient1;
import org.csource.fastdfs.StorageServer;
import org.csource.fastdfs.TrackerClient;
import org.csource.fastdfs.TrackerServer;
import org.springframework.core.io.ClassPathResource;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;

import cn.mldn.microboot.util.controller.AbstractBaseController;

@Controller
public class UploadController extends AbstractBaseController {
	@RequestMapping(value = "/uploadPre", method = RequestMethod.GET)
	public String uploadPre() { // 經過model能夠實現內容的傳遞
		return "upload_page";
	}
	@RequestMapping(value = "/show", method = RequestMethod.GET)
	public String show(String groupId, String fileId,Model model) throws Exception {
		// 經過ClassPath路徑獲取要使用的配置文件
		ClassPathResource classPathResource = new ClassPathResource(
				"fastdfs_client.conf");
		// 進行客戶端訪問的總體配置，須要知道配置文件的完整路徑
		ClientGlobal.init(classPathResource.getClassLoader()
				.getResource("fastdfs_client.conf").getPath());
		// FastDFS的核心操做在於tracker處理上，因此此時須要定義Tracker客戶端
		TrackerClient trackerClient = new TrackerClient();
		// 定義TrackerServer的配置信息
		TrackerServer trackerServer = trackerClient.getConnection();
		int ts = (int) (System.currentTimeMillis() / 1000);// 時間參考
		StringBuffer fileUrl = new StringBuffer();
		fileUrl.append("http://");
		fileUrl.append("fastdfs-tracker");
		fileUrl.append("/" + groupId + "/").append(fileId);
		fileUrl.append("?token=").append(
				ProtoCommon.getToken(fileId, ts, ClientGlobal.g_secret_key));
		fileUrl.append("&ts=").append(ts);
		System.out.println(fileUrl);
		trackerServer.close();
		model.addAttribute("image", fileUrl) ;
		return "upload_show" ;
	}

	@RequestMapping(value = "/upload", method = RequestMethod.POST)
	@ResponseBody
	public String upload(String name, HttpServletRequest request)
			throws Exception {
		if (request instanceof MultipartHttpServletRequest) { // 若是你如今是MultipartHttpServletRequest對象
			MultipartHttpServletRequest mrequest = (MultipartHttpServletRequest) request;
			List<MultipartFile> files = mrequest.getFiles("photo");
			Iterator<MultipartFile> iter = files.iterator();
			while (iter.hasNext()) {
				MultipartFile photo = iter.next();
				if (photo != null) { // 如今有文件上傳
					// 若是要想進行上傳則必定須要獲取到文件的擴展名稱
					String fileExtName = photo.getContentType().substring(
							photo.getContentType().lastIndexOf("/") + 1);
					// 經過ClassPath路徑獲取要使用的配置文件
					ClassPathResource classPathResource = new ClassPathResource(
							"fastdfs_client.conf");
					// 進行客戶端訪問的總體配置，須要知道配置文件的完整路徑
					ClientGlobal.init(classPathResource.getClassLoader()
							.getResource("fastdfs_client.conf").getPath());
					// FastDFS的核心操做在於tracker處理上，因此此時須要定義Tracker客戶端
					TrackerClient trackerClient = new TrackerClient();
					// 定義TrackerServer的配置信息
					TrackerServer trackerServer = trackerClient.getConnection();
					// 在整個FastDFS之中真正負責幹活的就是Storage
					StorageServer storageServer = null;
					StorageClient1 storageClient = new StorageClient1(
							trackerServer, storageServer);
					// 定義上傳文件的元數據
					NameValuePair[] metaList = new NameValuePair[3];
					metaList[0] = new NameValuePair("fileName",
							photo.getOriginalFilename());
					metaList[1] = new NameValuePair("fileExtName", fileExtName);
					metaList[2] = new NameValuePair("fileLength",
							String.valueOf(photo.getSize()));
					// 若是要上傳則使用trackerClient對象完成
					String upload_file = storageClient.upload_file1(
							photo.getBytes(), fileExtName, metaList);
					System.out.println(upload_file);
					trackerServer.close();
				}
			}
		}
		return "upload-file";
	}
}

4.設置圖片顯示頁面:

upload_show.html

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>SpringBoot模版渲染</title>
	<script type="text/javascript" th:src="@{/js/main.js}"></script> 
	<link rel="icon" type="image/x-icon" href="/images/mldn.ico"/>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
	<img th:src="${image}"/>
</body>
</html>

5.每次顯示圖片的時候設置好groupId和fileId就能夠實現圖片的查看處理:

upload_page.html

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>SpringBoot模版渲染</title>
	<script type="text/javascript" th:src="@{/js/main.js}"></script> 
	<link rel="icon" type="image/x-icon" href="/images/mldn.ico"/>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
</head>
<body>
	<form th:action="@{/upload}" method="post" enctype="multipart/form-data">
		姓名：<input type="text" name="name"/><br/>
		照片：<input type="file" name="photo"/><br/>
		照片：<input type="file" name="photo"/><br/>
		照片：<input type="file" name="photo"/><br/>
		<input type="submit" value="上傳"/>
	</form>
	<a th:href="@{/show(groupId='group1',fileId='M00/00/00/wKhEtVlTFc2ANT4kAALWT3AMif079.jpeg')}">查看照片</a>
	<a th:href="@{/show(groupId='group1',fileId='M00/00/00/wKhEtVlTFc2AUVINAAA9nfksZs0713.png')}">查看照片</a>
	<a th:href="@{/show(groupId='group1',fileId='M00/00/00/wKhEtVlTFc2AOgxGAC-AAARLh5I67.jpeg')}">查看照片</a>
</body> 
</html>

若是傳遞的內容是字符串必定要使用"'"聲明，若是是數字則能夠直接編寫。