图片服务器

最新推荐文章于 2022-01-26 14:19:50 发布
最新推荐文章于 2022-01-26 14:19:50 发布
阅读量1.2k 收藏
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40803085/article/details/105095303
版权

图片服务器

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

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

FastDFS是一种轻量级的、常用的分布式文件系统，通常用作图片服务器。 可以解决图片存储空间扩容问题, 如果存储空间满了,可以加服务器,fastDFS会自动管理,如果服务器挂了,(备份机可以自动同步)另一台服务器可以继续提供服务(高可用)
分布式文件系统: 分布式环境, 可以把文件保存到多台服务器上


文件上传的流程

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

文件下载的流程

在这里插入图片描述


图片服务器使用


图片服务器有一个java客户端, 想要使用需要把它加到工程中去
在这里插入图片描述
但是我们使用maven工程, 这个jar包在中央仓库中没有

就可以使用一个fastdfs_client的pom工程
fastdfs_client下载页面
把这个工程导入到
在这里插入图片描述

fastdfs_client的.pom文件里有这个jar包的坐标, 我们安装一下–Run As–>Maven install 本地仓库中就有这个jar包了, 需要使用的时候只需要把这个坐标加到依赖中就行了
在这里插入图片描述

上传图片测试

在表现层添加依赖

		<dependency>
			<groupId>fastdfs_client</groupId>
			<artifactId>fastdfs_client</artifactId>
			<version>1.25</version>
		</dependency>

上传步骤
1、加载配置文件，配置文件中的内容就是tracker服务的地址。
配置文件内容：tracker_server=192.168.25.133:22122
2、创建一个TrackerClient对象。直接new一个。
3、使用TrackerClient对象创建连接，获得一个TrackerServer对象。
4、创建一个StorageServer的引用，值为null
5、创建一个StorageClient对象，需要两个参数TrackerServer对象、StorageServer的引用
6、使用StorageClient对象上传图片。
7、返回数组。包含组名和图片的路径

创建测试方法FastDfsTest

package cn.e3mall.fast;

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;
import org.junit.Test;

import cn.e3mall.common.util.FastDFSClient;
public class FastDfsTest {
	
	@Test
	public void testUpload() throws Exception{
		//创建一个配置文件(client.conf),文件名任意,内容就是tracker服务器的地址(tracker_server=192.168.25.133:22122)
		//使用全局对象加载配置文件
		ClientGlobal.init("D:/Eclipse/Workspaces/e3-manager-web/src/main/resources/conf/client.conf");
		//创建一个trackerClient对象
		TrackerClient trackerClient = new TrackerClient();
		//通过trackerClient获得一个TrackerServer对象
		TrackerServer trackerServer = trackerClient.getConnection();
		//创建一个StroageServer的引用,可以是null
		StorageServer storageServer = null;
		//创建一个StorageClient, 参数需要TrackerServer和StorageServer
		StorageClient storageClient = new StorageClient(trackerServer, storageServer);
		//使用StorageClient上传文件  三个参数 local_filename:本地文件的绝对路径 file_ext_name:扩展名 meta_list:源数据
		String[] strings = storageClient.upload_file("C:/Users/11501/Pictures/Saved Pictures/a.jpg", "jpg", null);
		for (String string : strings) {
			System.out.println(string);
		}
	}

运行结果
在这里插入图片描述
通过返回的内容就可以访问图片了
能通过http方式访问到图片, 是因为安装了nginx.
nginx和fastDFS插件配合, 去访问的时候, 这个插件询问tracker到哪去下载图片, 实现下载流程, 访问到图片响应回来, 就可以通过http方式访问图片, fastDFS只是解决了图片保存问题, 通过HTTP方式访问必须安装nginx
在这里插入图片描述

使用工具类上传图片

FastDFSClient工具类下载页面
通过上面的测试方法, 会发现很麻烦, 这时候我们就需要使用工具类来完成流程了

把工具类上传至common
在这里插入图片描述

报错是因为没有依赖
在这里插入图片描述

在common里面加上依赖

		<dependency>
			<groupId>fastdfs_client</groupId>
			<artifactId>fastdfs_client</artifactId>
			<version>1.25</version>
		</dependency>

FastDFSClient导入了, 这个工具类怎么用呢
还在刚刚的测试方法FastDfsTest 那再写一个测试方法

package cn.e3mall.fast;

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;
import org.junit.Test;

import cn.e3mall.common.util.FastDFSClient;

public class FastDfsTest {
	
	@Test
	//使用工具类的测试方法
	public void testFastDfsClient() throws Exception{
		FastDFSClient fastDFSClient = new FastDFSClient("D:/Eclipse/Workspaces/e3-manager-web/src/main/resources/conf/client.conf");
		String string = fastDFSClient.uploadFile("C:/Users/11501/Pictures/Saved Pictures/b.jpg");
		System.out.println(string);
	}
}

运行结果
在这里插入图片描述

图片上传功能实现

有了工具类, 上传图片功能以及比较简单了, 接下来进行功能的实现

功能分析

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

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

图片上传

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


把文件上传组件的依赖添加到*-manager-web

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

在springMVC.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

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

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 cn.e3mall.common.util.FastDFSClient;
import cn.e3mall.common.util.JsonUtils;

/**
 * 图片上传的controller
 * @author 11501
 */
@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();
			//找到最后一个"." , +1不包含"."开始截取, 就能拿到扩展名了
			String extName = originalFilename.substring(originalFilename.lastIndexOf(".") + 1);
			//2、创建一个FastDFS的客户端
			FastDFSClient fastDFSClient = new FastDFSClient("classpath:resource/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;
		}
	}
}

IMAGE_SERVER_URL内容
在这里插入图片描述
加载配置文件
在这里插入图片描述

解决浏览器兼容性的问题

KindEditor的图片上传插件，对浏览器兼容性不好
浏览器Content-Type是applocation/json
在这里插入图片描述

解决方法:

使用JsonUtils工具类实现java对象和jason之间的相互转换
JsonUtils工具类下载页面
把工具类导入到common中
在这里插入图片描述

使用@ResponseBody注解
不走逻辑视图, 直接响应浏览器, 相当于使用respond对象调用white方法, 往浏览器写入内容
如果返回值是对象, 会默认把对象变成json再进行响应
如果返回对象是字符串, 直接响应浏览器

在这里插入图片描述

上面我们手动转换成json字符串
返回值是字符串, 直接响应浏览器, 就不需要转换, content-type 就默认是 text/plan
KindEditor的多图片上传插件最后响应的Content-Type是text/plan格式的 json 字符串, 兼容性是最好的, 那么就解决了兼容性问题
在这里插入图片描述

　IqOahz
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
图片服务器搭建
Pig勇
01-09 1万+
图片服务器搭建 原先我们通过servlet上传一个用户的头像，需要把头像显示到网站上。就需要搭建一个图片服务器来显 示图片了。 图片服务器其实和tomcat/nginx容器的作用是一样的。目的都是要把文件从本地的磁盘上发布出去。一般常用 的图片服务器是apache服务器 ，但是我们实际上也可以使用tomcat/nginx作为测试的图片服务器。 使用tomca/nginxt把本地磁盘的一个图片路径D:/upload发布出去，好让用户能通过浏览器访问这个目录下的 图片。 一、使用tomcat服务器 在本地不通过
Nginx配置图片服务器
热门推荐
热爱技术，享受生活
07-04 3万+
Nginx配置图片服务器
图片服务器Zimg
风清云淡
03-04 4700
若一个项目中图片的资源较多，都会有专门的图片服务器来存储图片，可以去观察一些大的网站上图片的链接都是有专门的服务器，这样可以很好地提高性能。图片服务器解决方案很多，通过花钱的云厂商提供的存储服务、vsftp、FastDFS等，这里介绍一个开源项目——zimg。 zimg是图像存储和处理服务器。您可以使用URL参数从zimg获得压缩和缩放的图像。 zimg的并发I / O，分布式存储和及时处理能...
图片服务器搭建方案
Mr-Bean的博客
11-22 4768
FTP 优点：  可以使用任意服务器或云服务作为FTP服务端。  FTP服务端没有操作系统限制。  代码完成后形成模块，任意程序都可使用。  读取图片时不占用应用服务器资源。 缺点： 需要编写的代码较多。  前端显示图片会暴露FTP服务器的地址。  FTP服务器需要做端口映射。  传输速度一般。  同步上传思路需要修改的方法较多。 使用技术： FTP服务端，JDK1.6中rt.jar包自带的F...
nginx代理图片服务器
weixin_43186009的博客
01-26 4806
nginx config文件中配置图片的代理路径 #nginx代理图片服务器 root 配置物理路径 hosts设置127.0.0.1 image.leyou.com server { listen 80; server_name image.leyou.com; proxy_set_header X-Forwarded-Host $host; proxy_set_header X-Forwarded-Server $host; proxy_set_header X-
nginx作为图片服务器
fengxiaolu311的博客
12-15 2713
nginx作为图片服务器 nginx作为静态资源服务器的性能很强大，此处作为图片服务器使用。 可以利用location的规则，把单独的一个应用作为静态资源访问： server { listen 80; server_name localhost; location /images/ { root /home/ftp/; } } 以地址 /images 开头的url作为资源访问路径。并通过root，做访问路径的映射： 在 /hom
Nginx做图片服务器
CODEING一场空的博客
12-12 4130
前言： Nginx是一个高性能的HTTP和反向代理web服务器,以及负载均衡器。根据nginx是高性能的http服务器，因此可以用作图片服务器使用。 本案例是在docker安装nginx来操作的。 Nginx安装 1、首先是docker的安装 详情参考：docker安装 2、拉取nginx镜像 #不指定版本号则下载最新的nginx docker pull nginx 3、启动docker容器 #启动该容器是为了获取nginx配置文件 sudo docker run -id --name nginx-t
FastDFS搭建图片服务器
icanflying的博客
12-23 5405
服务器规划 服务器名称 IP地址和端口 备注 fastdfs-tracker *:22122 跟踪服务器/调度服务器 fastdfs-storage *:23000 存储服务器 一、安装系统组件 yum install gcc -y 二、安装fastdfs 1、创建图片服务器存储目录 mkdir -p /data/image 2、下载FastDFS依赖包libfastcommon并安装 wget https://codeload.gi.
使用Nginx搭建图片服务器
哈
12-30 6639
第一步：下载Nginx并解压 第二步：创建用来存放图片的文件夹 第三步：修改conf/nginx.conf 具体代码： location ~ .*\.(gif|jpg|jpeg|png)$ { expires 24h; root D:/WebServer/imgs/;#指定图片存放路径 access_log D:/WebServer/imgs/log;#图片路径 proxy_store on; proxy_store_access user:
nginx搭建图片服务器
温暖的博客
07-14 6159
1 介绍 现在很多的网站上都会用到大量的图片，而图片是网页传输中占主要的数据量,也是影响网站性能的主要因素。因此很多网站都会将图片存储从网站中分离出来，另外架构一个或多个服务器来存储图片，将图片放到一个虚拟目录中，而网页上的图片都用一个URL地址来指向这些服务器上的图片的地址，这样的话网站的性能就明显提高了，图片服务器(ImageServer)的概念也就产生了。 1.1 图片服务器
简易图片服务器
07-23
【简易图片服务器】是一款基于Python开发的轻量级图片服务应用，它旨在提供一个便捷的平台，用于管理和处理图片资源。这款服务器具有以下关键特点： 1. **分布式集群支持**：通过与Nginx的配合，简易图片服务器可以...
Linux搭建图片服务器
01-09
目录 1 安装目的 2 下载地址 3 FastDFS安装环境 3.1 安装libevent 3.2 安装libfastcommon 3.3 tracker编译安装 4 配置 5 启动 5.1 设置开机自动启动。...为了商城可以动态的上传图片，目的是为了解决高并发，不用集群t
详解Nginx搭建图片服务器过程
09-30
在本文中，我们将深入探讨如何使用Nginx搭建图片服务器，并解决在此过程中可能遇到的问题。首先，我们需要了解Nginx的基本概念。Nginx是一款高性能的HTTP和反向代理服务器，以其高性能、低内存占用和丰富的模块化...
本地图片服务器
01-15
本地图片服务器搭建, 可实现本地图片存储读取等........
方案-基于云架构的校园信息化建设方案.pdf
最新发布
07-29
方案-基于云架构的校园信息化建设方案.pdf
【创新未发表】Matlab实现蛇群优化算法SO-Kmean-Transformer-LSTM负荷预测算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【创新未发表】Matlab实现北方苍鹰优化算法NGO-Kmean-Transformer-LSTM组合状态识别算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
【创新未发表】Matlab实现蝗虫优化算法GOA-Kmean-Transformer-BiLSTM组合状态识别算法研究.rar
07-29
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
nginx图片服务器
09-20
Nginx 图片服务器是指使用 Nginx 来搭建并提供图片服务的服务器。通过配置 Nginx，可以将图片的请求映射到指定的路径，并且可以实现图片的缓存、负载均衡等功能。 首先，您需要确保已经正确安装了 Nginx，并且配置...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值