12、FastDFS 实现 图片服务器

FastDFS实现图片服务器

图片服务器的简介

1、存储空间可扩展。
2、提供一个统一的访问方式。

使用FastDFS,分布式文件系统。存储空间可以横向扩展,可以实现服务器的高可用。支持每个节点有备份机。

什么是FastDFS

FastDFS是用c语言编写的一款开源的分布式文件系统。FastDFS为互联网量身定制,充分考虑了冗余备份、负载均衡、线性扩容等机制,并注重高可用、高性能等指标,使用FastDFS很容易搭建一套高性能的文件服务器集群提供文件上传、下载等服务。

FastDFS架构

FastDFS架构包括Tracker serverStorage server。客户端请求Tracker server进行文件上传、下载,通过Tracker server调度最终由Storage server完成文件上传和下载。
Tracker server作用是负载均衡和调度,通过Tracker server在文件上传时可以根据一些策略找到Storage server提供文件上传服务。可以将tracker称为追踪服务器或调度服务器。
Storage server作用是文件存储,客户端上传的文件最终存储在Storage服务器上,Storage server没有实现自己的文件系统而是利用操作系统 的文件系统来管理文件。可以将storage称为存储服务器。
在这里插入图片描述

服务端两个角色:
Tracker:管理集群,tracker也可以实现集群。每个tracker节点地位平等。
收集Storage集群的状态。
Storage:实际保存文件
Storage分为多个组,每个组之间保存的文件是不同的。每个组内部可以有多个成员,组成员内部保存的内容是一样的,组成员的地位是一致的,没有主从的概念。

文件上传的流程

在这里插入图片描述

客户端上传文件后存储服务器将文件ID返回给客户端,此文件ID用于以后访问该文件的索引信息。文件索引信息包括:组名,虚拟磁盘路径,数据两级目录,文件名。
在这里插入图片描述

  • 组名:文件上传后所在的storage组名称,在文件上传成功后有storage服务器返回,需要客户端自行保存。
  • 虚拟磁盘路径:storage配置的虚拟路径,与磁盘选项store_path*对应。如果配置了store_path0则是M00,如果配置了store_path1则是M01,以此类推。
  • 数据两级目录:storage服务器在每个虚拟磁盘路径下创建的两级目录,用于存储数据文件。
  • 文件名:与文件上传时不同。是由存储服务器根据特定信息生成,文件名包含:源存储服务器IP地址、文件创建时间戳、文件大小、随机数和文件拓展名等信息。

##3 文件下载
在这里插入图片描述

最简单的FastDFS架构

在这里插入图片描述

图片服务器安装方法

这里我们使用的是已经安装好的图片服务器的压缩包
在这里插入图片描述
步骤一:解压缩
在这里插入图片描述
步骤二:把图片服务器添加到 VMware 中
在这里插入图片描述步骤三:VMware的网络配置
在这里插入图片描述步骤四:启动虚拟机
在这里插入图片描述移动:网络配置不发生变化。要使用图片服务器,需要保证网络配置不变。
复制:重新生成一块网卡mac地址是新地址。

Ip地址:192.168.25.133
用户名rootitcast
密码:itcast

该虚拟机是带图形界面的,输入startx启动图形界面。

FastDFS相关资源:https://download.csdn.net/download/weixin_42112635/10837353

图片上传依赖配置添加

依赖添加

e3-common的pom.xml添加

        <!--fastdfs-->
        <dependency>
            <groupId>cn.bestwu</groupId>
            <artifactId>fastdfs-client-java</artifactId>
            <version>1.27</version>
        </dependency>

图片上传测试

e3-manager-web :中写测试类

package cn.ynx.e3mall.fastdfs;

import org.csource.fastdfs.*;
import org.junit.Test;

public class FastDFSTest {

    @Test
    public void testFileUpload() throws Exception {
        // 1、加载配置文件,配置文件中的内容就是tracker服务的地址。
        ClientGlobal.init("C:\\Users\\ys951\\Desktop\\e3mall\\e3-manager-web\\src\\main\\resources\\conf\\client.conf");
        // 2、创建一个TrackerClient对象。直接new一个。
        TrackerClient trackerClient = new TrackerClient();
        // 3、使用TrackerClient对象创建连接,获得一个TrackerServer对象。
        TrackerServer trackerServer = trackerClient.getConnection();
        // 4、创建一个StorageServer的引用,值为null
        StorageServer storageServer = null;
        // 5、创建一个StorageClient对象,需要两个参数TrackerServer对象、StorageServer的引用
        StorageClient storageClient = new StorageClient(trackerServer, storageServer);
        // 6、使用StorageClient对象上传图片。
        //扩展名不带“.”
        String[] strings = storageClient.upload_file("C:\\Users\\ys951\\Desktop\\02.教案-AB-3.0\\111.png", "png", null);
        // 7、返回数组。包含组名和图片的路径。
        for (String string : strings) {
            System.out.println(string);
        }
    }

}

添加配置文件:
conf/client.conf

tracker_server=192.168.25.133:22122

运行测试类,得到:

group1
M00/00/00/wKgZhVwLka6ARI-nAAdw8AHA8so639.png

浏览器输入:http://192.168.25.133/group1/M00/00/00/wKgZhVwLka6ARI-nAAdw8AHA8so639.png
显示上传的图片

添加上传工具类 FastDFSClient.java

放到 e3-commoncn.ynx.e3mall.common.utils包下面

package cn.ynx.e3mall.common.utils;

import org.csource.common.NameValuePair;
import org.csource.fastdfs.ClientGlobal;
import org.csource.fastdfs.StorageClient1;
import org.csource.fastdfs.StorageServer;
import org.csource.fastdfs.TrackerClient;
import org.csource.fastdfs.TrackerServer;

public class FastDFSClient {

	private TrackerClient trackerClient = null;
	private TrackerServer trackerServer = null;
	private StorageServer storageServer = null;
	private StorageClient1 storageClient = null;
	
	public FastDFSClient(String conf) throws Exception {
		if (conf.contains("classpath:")) {
			conf = conf.replace("classpath:", this.getClass().getResource("/").getPath());
		}
		ClientGlobal.init(conf);
		trackerClient = new TrackerClient();
		trackerServer = trackerClient.getConnection();
		storageServer = null;
		storageClient = new StorageClient1(trackerServer, storageServer);
	}
	
	/**
	 * 上传文件方法
	 * <p>Title: uploadFile</p>
	 * <p>Description: </p>
	 * @param fileName 文件全路径
	 * @param extName 文件扩展名,不包含(.)
	 * @param metas 文件扩展信息
	 * @return
	 * @throws Exception
	 */
	public String uploadFile(String fileName, String extName, NameValuePair[] metas) throws Exception {
		String result = storageClient.upload_file1(fileName, extName, metas);
		return result;
	}
	
	public String uploadFile(String fileName) throws Exception {
		return uploadFile(fileName, null, null);
	}
	
	public String uploadFile(String fileName, String extName) throws Exception {
		return uploadFile(fileName, extName, null);
	}
	
	/**
	 * 上传文件方法
	 * <p>Title: uploadFile</p>
	 * <p>Description: </p>
	 * @param fileContent 文件的内容,字节数组
	 * @param extName 文件扩展名
	 * @param metas 文件扩展信息
	 * @return
	 * @throws Exception
	 */
	public String uploadFile(byte[] fileContent, String extName, NameValuePair[] metas) throws Exception {
		
		String result = storageClient.upload_file1(fileContent, extName, metas);
		return result;
	}
	
	public String uploadFile(byte[] fileContent) throws Exception {
		return uploadFile(fileContent, null, null);
	}
	
	public String uploadFile(byte[] fileContent, String extName) throws Exception {
		return uploadFile(fileContent, extName, null);
	}

}

使用工具类上传测试

    @Test
    public void testFastDfsClient() throws Exception {
        FastDFSClient fastDFSClient = new FastDFSClient("C:\\Users\\ys951\\Desktop\\e3mall\\e3-manager-web\\src\\main\\resources\\conf\\client.conf");
        String file = fastDFSClient.uploadFile("C:\\Users\\ys951\\Desktop\\02.教案-AB-3.0\\111.png");
        System.out.println(file);
    }

图片上传功能

功能分析

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
使用的是 KindEditor 的多图片上传插件。
KindEditor 4.x 文档
http://kindeditor.net/doc.php

在这里插入图片描述

请求的 url :/pic/upload
参数:MultiPartFile uploadFile
返回值:
在这里插入图片描述

可以创建一个pojo对应返回值。可以使用 map

业务逻辑:
1、接收页面传递的图片信息uploadFile
2、把图片上传到图片服务器。使用封装的工具类实现。需要取文件的内容和扩展名。
3、图片服务器返回图片的url
4、将图片的url补充完整,返回一个完整的url。
5、把返回结果封装到一个Map对象中返回。

1、需要把 commons-io、fileupload 的 jar 包添加到 web 工程中。

Common-io 在 common 中存在了,只要添加 fileupload

            <!-- 文件上传组件 -->
			<dependency>
				<groupId>commons-fileupload</groupId>
				<artifactId>commons-fileupload</artifactId>
			</dependency>

2、配置多媒体解析器

在 springmc.xml 里面配置

    <!-- 配置多媒体解析器 -->
    <!-- 定义文件上传解析器 -->
    <bean id="multipartResolver"
          class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <!-- 设定默认编码 -->
        <property name="defaultEncoding" value="UTF-8"></property>
        <!-- 设定文件上传的最大值5MB,5*1024*1024 -->
        <property name="maxUploadSize" value="5242880"></property>
    </bean>

编写 Controller 接收图片

返回的 json 数据,可以写 pojo ,也可以写 map 。

package cn.ynx.e3mall.controller;

import cn.ynx.e3mall.common.utils.FastDFSClient;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;

import java.util.HashMap;
import java.util.Map;

@Controller
public class PictureController {

    @Value("${IMAGE_SERVER_URL}")
    private String IMAGE_SERVER_URL;

    @RequestMapping("/pic/upload")
    @ResponseBody
    public Map fileUpload(MultipartFile uploadFile) {
        try {
            //1、取文件的扩展名
            String originalFilename = uploadFile.getOriginalFilename();
            String extName = originalFilename.substring(originalFilename.lastIndexOf(".") + 1);
            //2、创建一个FastDFS的客户端
            FastDFSClient fastDFSClient = new FastDFSClient("classpath:conf/client.conf");
            //3、执行上传处理
            String path = fastDFSClient.uploadFile(uploadFile.getBytes(), extName);
            //4、拼接返回的url和ip地址,拼装成完整的url
            String url = IMAGE_SERVER_URL + path;
            //5、返回map
            Map result = new HashMap<>();
            result.put("error", 0);
            result.put("url", url);
            return result;
        } catch (Exception e) {
            e.printStackTrace();
            //5、返回map
            Map result = new HashMap<>();
            result.put("error", 1);
            result.put("message", "图片上传失败");
            return result;
        }
    }
}

添加配置文件,conf 下面建一resource.properties

# 图片服务器的地址
IMAGE_SERVER_URL=http://192.168.25.133/

springmvc.xml 加载配置文件

    <!-- 加载配置文件 -->
	<context:property-placeholder location="classpath:conf/resource.properties" />

Controller 里面用 @Value 读取配置文件的值

能回显,说明上传成功。回显,是再从服务器拿到图片。

解决浏览器兼容性的问题

KindEditor 的图片上传插件,对浏览器兼容性不好。
使用 @ResponseBody 注解返回 java 对象,
Content-Type:application/json;charset=UTF-8

返回字符串时:
Content-Type:text/plain;charset=UTF-8

Common 里面导入
在这里插入图片描述
指定响应结果的content-type:
在这里插入图片描述
KindEditor的多图片上传插件最后响应的content-type是text/plan格式的json字符串。兼容性是最好的。
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/weixin_42112635/article/details/84893149
今日推荐