关于品优购大型电商开发问题解答以及开发知识点之图片上传（FastDFS ）以及富文本编译器day5(7)

关于品优购大型电商开发问题解答以及开发知识点之图片上传（FastDFS ）以及富文本编译器（kindeditor）day5(7)

1.FastDFS

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

​ 配置与安装在这里不做解释，主要讲原理

`package cn.itcast.demo;

import java.io.FileNotFoundException;
import java.io.IOException;

import org.csource.fastdfs.ClientGlobal;
import org.csource.fastdfs.StorageClient;
import org.csource.fastdfs.StorageServer;
import org.csource.fastdfs.TrackerClient;
import org.csource.fastdfs.TrackerServer;

public class Test {

public static void main(String[] args) throws FileNotFoundException, IOException, Exception {
	//加载配置文件
	ClientGlobal.init("F:\\exlipse\\工作空间电商\\fastDFS-demo\\src\\main\\resources\\fdfs_client.conf");
	//构建一个管理者客户端
	TrackerClient client=new TrackerClient();
	//连接服务端
	TrackerServer trackerServer = client.getConnection();
	//声明储存服务器
	StorageServer storageServer=null;
	//获取存储服务器客户端对象
	StorageClient storageClient=new StorageClient(trackerServer, storageServer);
	//上传文件
	//第一个属性为文件路径
	//第二个属性为文件类型
	//第三个属性为文件扩展信息如高度宽度啥的，返回fileId
	String[] upload_appender_file = storageClient.upload_appender_file("F:\\heima\\sucai\\kb.jpg","jpg", null);
	for(String a:upload_appender_file){
		System.out.println(a);
	}
}

}`

输出结果

解释
group1：文件上传后stroage的组名
M00：虚拟磁盘路径
00/00：storage 服务器在每个虚拟磁盘路径下创建的两级目录
wKgZhWDefgeEQLgMAAAAAPNBWzc168.jpg：文件名

！！stroage：实际保存文件 Storage 分为多个组，每个组之间保存的文件是不同的。每个组内部可以有多个成员，组成员内部保存的内容是一样的，组成员的地位是一致的，没有主从的概念。
配置文件重要的一句

​ tracker_server=192.168.25.133:22122（tracker_server的ip地址）

​ ！！tracker_server作用是负载均衡和调度，通过 Tracker server 在文件上传时可以根据一些策略找到 Storage server 提供文件上传服务。可以将 tracker 称为追踪服务器或调度服务器。
注意
1.上传文件的id必须是file

2.文件上传前端Service层（Angularjs）代码帮助理解

app.service("uploadService",function($http){
	this.uploadFile=function(){
		var formdata=new FormData();
		//file文件上传的name为file
		formdata.append('file',file.files[0]);
		
		return $http({
			url:"../upload.do",
			method:"post",
			data:formdata,
			headers:{'Content-Type':undefined},
			transformRequest: angular.identity
		});
	}
})

2.富文本编译器

1.初始化富文本编译器

`<script type="text/javascript">

var editor;

KindEditor.ready(function(K) {

     editor = K.create('textarea[name="content"]', {

         allowFileManager: true

     });

});`

allowFileManager: true 表示允许浏览服务器已上传文件

textarea[name=“content”]’ 表示将富文本编译器与name为content的文本域绑定

2.提取富文本编译器中内容

``var a=editor.html()

3.记着提交完文本域清空富文本编译器

editor.html('');//清空富文本编辑器

以上是富文本编译器以及文件上传原理,点赞加关注，有项目问题以及不懂的地方与小编联系，或评论在下方小编会及时解答。
下期见