京淘项目图片上传及Nginx代理域名访问

最新推荐文章于 2024-05-21 09:15:44 发布

爱情不过赛尼奥尔

最新推荐文章于 2024-05-21 09:15:44 发布

阅读量472

点赞数

分类专栏：学习问题记录

本文链接：https://blog.csdn.net/Anguswin/article/details/103699822

版权

学习问题记录专栏收录该内容

9 篇文章 0 订阅

订阅专栏

1.文件上传入门

1.1在`webapp/file.jsp`查看基本属性

在这里插入图片描述

1.2 创建并编辑`FileController`

package com.jt.controller;
import java.io.File;
import java.io.IOException;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;

@Controller
public class FileController {
	/**
	 * 	当用户上传完成时重定向到上传页面
	 * 思路:
	 * 	1.获取用户文件信息 包含文件名称
	 *  2.指定文件上传路径，如果没有则创建文件夹
	 *  3.实现文件上传
	 *  4.重定向到原页面
	 * @return
	 * @throws IOException 
	 * @throws IllegalStateException 
	 */
	@RequestMapping("/file")
	public String fileController(MultipartFile fileImage) throws IllegalStateException, IOException {
		//获取input标签中的值
		String inputName = fileImage.getName();
		//获取文件名
		String fileName = fileImage.getOriginalFilename().toLowerCase();
		//定义上传文件路径
		File fileDir = new File("G:/CGBv3.0/JT/image/i");
		if(!fileDir.exists()) {
			fileDir.mkdirs();
		}
		//上传文件
		fileImage.transferTo(new File(fileDir+"/"+fileName));
		//重定向到原页面
		return "redirect:/file.jsp";
	}
}

需要注意的是：

开启多媒体标签enctype="multipart/form-data"
使用工具API进行接收MultipartFile 参数名称必须与input标签中的name属性一致.
实现文件上传（转义的双斜杠最好换成“/“）
file.jsp中的action地址必须与FileController中要访问的路径一致

1.3 启动测试

访问http://localhost:8090/file.jsp
选择需要上传的文件，点击提交，上传成功！

2. 上传京淘项目中图片

2.1查询上传图片的url

在这里插入图片描述
Dir=image 表示上传为图片
2.查询页面js

2.2 定义vo对象

数据回显要求
{"error":0,"url":"图片的保存路径","width":图片的宽度,"height":图片的高度}error 表示文件上传是否正确

package com.jt.vo;
import lombok.Data;
import lombok.experimental.Accessors;
@Data
@Accessors(chain = true)
public class ImageVO {
	private Integer error;
	private String url;
	private Integer width;
	private Integer height;
}

2.3编辑`FileController`

@Autowired
private FileService fileService;
//localhost:8090/pic/upload?dir=image
@RequestMapping("/pic/upload")
@ResponseBody
public ImageVO fileImage(MultipartFile uploadFile) {
	return fileService.uploadFile(uploadFile);
}

2.4创建并编辑`FileServiceImpl`

package com.jt.service;
import java.awt.image.BufferedImage;
import java.io.File;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.UUID;
import javax.imageio.ImageIO;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import com.jt.vo.ImageVO;

@Service
public class FileServiceImpl implements FileService {

	@Override
	public ImageVO uploadFile(MultipartFile uploadFile) {
		ImageVO imageVO = new ImageVO();
		//获取文件名
		String fileName = uploadFile.getOriginalFilename().toLowerCase();
		//校验是否为图片，使用正则
		if(!fileName.matches("^.+\\.(jpg|png|gif)$")) {
			imageVO.setError(1);
			return imageVO;
		}
		//3.判断是否为恶意程序
		try {
			BufferedImage bufferedImage = ImageIO.read(uploadFile.getInputStream());
			int width = bufferedImage.getWidth();
			int height = bufferedImage.getHeight();
			if(width==0||height==0) {
				imageVO.setError(1);
				return imageVO;
			}
			//4.时间转化为字符串 2019/12/25
			String dateDir = new SimpleDateFormat("yy/MM/dd").format(new Date());
			//定义文件上传路径
			String localDir = "G:/CGBv3.0/JT/image/";
			File fileDir = new File(localDir+dateDir);
			//判断文件夹是否存在
			if(!fileDir.exists()) {
				fileDir.mkdirs();
			}
			//6.使用UUID定义文件名称 uuid.jpg
			String uuid = UUID.randomUUID().toString().replace("-", "");
			//动态获取图片类型—— ".jpg"
			String fileType = fileName.substring(fileName.lastIndexOf("."));
			//拼接新的路径
			String realUploadDir = localDir + dateDir +"/"+uuid+fileType;
			uploadFile.transferTo(new File(realUploadDir));
			//将文件文件信息回传给页面
			imageVO.setError(0).setWidth(width).setHeight(height);
		} catch (Exception e) {
			e.printStackTrace();
			imageVO.setError(1);
			return imageVO;
		}
		return imageVO;
	}
}

2.5启动测试

到这里图片文件只能上传成功，但还不能回显

2.6 图片回显

文件上传后,将数据保存到本地磁盘中.但是该图片只允许本机自己访问.如果需要通过浏览器访问.则必须设定虚拟访问地址.
根据URL地址拼接虚拟路径.之后测试文件上传是否成功

// 定义虚拟路径
private String urlPath = "http://image.jt.com/";
//拼接url路径
String realUrlPath = urlPath+dateDir+"/"+uuid+fileType;
//将文件文件信息回传给页面
imageVO.setError(0).setWidth(width).setHeight(height)
		.setUrl(realUrlPath);

在这里插入图片描述

用户通过虚拟路径访问.之后利用转化的机制,将虚拟路径转化为本地磁盘路径.这时用户可以访问真实的图片信息.

3.反向代理—Nginx

当用户发起请求根据规则拦截请求后，代替用户访问真实资源的过程，称为反向代理。

nginx特点
1.并发能力强 5万/秒---3万/秒        tomcat:220/秒—150/秒
		并发能力受限于 网络/硬件条件.
2.轻量级 占用磁盘空间 不到2M

3.1Nginx下载安装

官网：nginx.org
在这里插入图片描述
下载解压的指定目录，不要带空格。

3.2启动运行

使用管理员权限，打开cmd窗口，cd到nignx安装目录，使用命令行启动

start nginx 	//启动
nginx -s reload //重新加载
nginx -s stop  //停止服务

在任务管理器中能看到进程启动情况
在这里插入图片描述
nginx默认访问80端口，启动浏览器访问localhost，如下显示，即启动成功

3.3 Nginx 配置文件

目录：Nginx/conf/nginx.conf

#server代表一个服务项
  server {
      listen       80;	#监听端口
#server_name 表示拦截域名
      server_name  localhost;	
#拦截请求之后处理方式
      location / {
      	#root 是关键字 代表反向代理的文件夹名称
          root   html;
          #index 默认跳转页面
          index  index.html index.htm;
      }

业务中反向代理需要把image.jt.com路径替换为本地路径G:/CGBv3.0/JT/image
即：http://image.jt.com/2019/12/26/7e2c008a24c04939905fb782faf0fa55.jpg

3.4配置图片服务器

在nginx.conf最后添加如下配置，编辑完成后重启nginx

#配置图片服务器
server {
	listen 80;        #监听80端口
	server_name image.jt.com; #监听的域名
	location / {            #转发或处理
		root G:/CGBv3.0/JT/image; 
	}
}

3.5编辑host文件

host文件位置：C:\Windows\System32\drivers\etc，在最后添加如下配置

127.0.0.1	localhost
127.0.0.1	image.jt.com
127.0.0.1	www.jt.com
127.0.0.1	manage.jt.com
127.0.0.1	sso.jt.com
127.0.0.1	cart.jt.com
127.0.0.1	order.jt.com

调用过程:

用户发起http请求image.jt.com;
通过hosts文件，将用户请求地址映射到本机中.
Nginx接收到用户请求之后进行反向代理最终实现数据访问.

3.6 启动测试

访问此地址：http://image.jt.com/2019/12/26/7e2c008a24c04939905fb782faf0fa55.jpg，成功！
备注：启动nginx代理时，需要把其它代理关掉
在这里插入图片描述

4.项目优化

有时文件上传地址/url地址可能会根据环境不同发生变化.如果路径发生修改则必然修改java代码!
将重要文件提取到配置中

新建并编辑image.properties

#配置本地磁盘路径
image.localPath=G:/CGBv3.0/JT/image/
#配置虚拟路径
image.urlPath=http://image.jt.com/

编辑FileServiceImpl

@Service
@PropertySource("classpath:/properties/image.properties")
public class FileServiceImpl implements FileService {
// 定义虚拟路径
@Value("${image.urlPath}")
private String urlPath;
//	private String urlPath = "http://image.jt.com/";
//定义本地文件路径
@Value("${image.localPath}")
private String localDir;

5.通过域名访问服务器

配置Nginx

#后台管理服务器 用户访问manage.jt.com时访问localhost:8091
server {
	listen 80;
	server_name manage.jt.com;
	
	location / {
		#代理路径
		proxy_pass 	http://localhost:8091;
	}
}

修改后，重启Nginx

启动访问测试，页面效果：

附录：正则表达式

 * 正则常用字符:
* 	1.^   标识..开始
 *  2.$   标识以...结束
 *  3.点.    任意单个字符
 *  4.*	    表示任意个 0~~~~无穷
 *  5.+	  表示 1~~~~无穷
 *  6.\.  标识特殊字符.	
 *  7.(xxx|xx|xxx)  代表分组  满足其中一个条件即可

爱情不过赛尼奥尔

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
京淘项目图片上传及Nginx代理域名访问

1.文件上传入门1.1在webapp/file.jsp查看基本属性1.2 创建并编辑FileControllerpackage com.jt.controller;import java.io.File;import java.io.IOException;import org.springframework.stereotype.Controller;import org.spr...
复制链接

扫一扫