文件上传与PDF报表入门

理解DataURL的基本使用，实现DataURL的文件上传完成基于七牛云的文件上传

理解 JasperReport生命周期

独立完成 JasperReport的入门案例

图片上传

需求分析

如图所示，实现员工照片上传功能

Data URL

DataURL概述

所谓DataURL是指"data"类型的Url格式，是在RFC2397中提出的，目的是对于一些“小”的数据，可以在网页中直接嵌入，而不是从外部文件载入。

Data URL入门

完整的DataURL语法：DataURL= data:mediatype;base64,。

mediatype：表述传递的数据的MIME类型（text/html，image/png，image/jpg）

骚戴理解：mediatype;和base64是可选的！

简单的说，data类型的Url大致有下面几种形式。

data:,<文本数据>
data:text/plain,<文本数据>
data:text/html,<html代码>
data:text/html;base64,<base64编码的html代码>
data:text/css,<css代码>
data:text/css;base64,<base64编码的css代码>
data:text/javascript,<javascript代码>
data:text/javascript;base64,<base64编码的javascript代码>
data:image/gif;base64,base64编码的gif图片数据
data:image/png;base64,base64编码的png图片数据
data:image/jpeg;base64,base64编码的jpeg图片数据
data:image/x-icon;base64,base64编码的icon图片数据

对于再程序开发中，使用最多的是基于DataURL的图片形式，接下来以图片形式的DataURL分析其原理和利弊

Data URL基本原理

Data URL给了我们一种很巧妙的将图片“嵌入”到HTML中的方法。跟传统的用 img 标记将服务器上的图片引用到页面中的方式不一样，在Data URL协议中，图片被转换成base64编码的字符串形式，并存储在URL中，冠以mime- type。

图片在网页中的使用方法通常是下面这种利用img标记的形式：

这种方式中，img标记的属性指定了一个远程服务器上的资源。当网页加载到浏览器中时，浏览器会针对每个外部资源都向服务器发送一次拉取资源请求，占用网络资源。大多数的浏览器都有一个并发请求数不能超过4个的限制。这意味着，如果一个网页里嵌入了过多的外部资源，这些请求会导致整个页面的加载延迟。而使用Data URL技术，图片数据以base64字符串格式嵌入到了页面中，与HTML成为一体，它的形式如下：

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALwAAAA5CAYAAACMNEHAAAAAGXRFWHRTb2Z0d2FyZ
QBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdp
bj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU
6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy
0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyL
zIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0
dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3h
hcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC
8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo5ZDAxYjE4NC04MTFlLTE4NDEtYTUwYi0wMzljN
jZmNDA1YWUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUYyRjEwQUFGMEY3MTFFN0IzQUU5ODg2NUEzREJF
MDMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUYyRjEwQTlGMEY3MTFFN0IzQUU5ODg2NUEzREJFMDMiIHh
tcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZW
RGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ZDA1ZmRhNzAtMzY1Yi1iNTQwLWE3OTYtOGVjNzJkYTQwZ
mMyIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6MDM4NzM5MTYtZTQ4ZS0xMWU3LWFl
NTUtODVlYjU5NWU3MzVlIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3h
wYWNrZXQgZW5kPSJyIj8+d+H9YQAAE4NJREFUeNrsXQmYFMUVroWVWxAC4kEETxAhSlQMShBQAooH4hlPxCh4i6
JGkxiNJkbFoKJGjSiKBypyeB/IYcAzEg8uDxQEDERBdpXLZSH1f/tX5lFb3V3d07OLS7/ve9/M9NRUV1f99ep/r
44pqjPoYbUZSUOtHbTurXVPra20/lTrT7Q2oxop17pC6zdaP9E6V+sMrf/UWpK0AF0++rvKpOZKcTXfv77Wblp7
aO2udT+ttT1/i3QtqOgcR/P6eq2vaX1Q69P8nEkm1Qb4+gTnCVp7a21QgGfqTf1c69Van8iaOhNIrSq8175a79P
6X62Paz2mAGC3ZRetY7SO09oka+5MiqugQ/XVeoXWrtX4nOhcu2vtqfXrrNkzC18IAW15T+sz1Qx2I3CGX9FaL2
v2zMKnKT/XOkLrgZvh8+6j9Vqtv03wWzjGl2mdRKfYNVKcrHUP8flOVRFFiiP9qJCVWodo3Vig+tiJ7QVBZGtKN
bZNa61dtG6vdTu+Dta62vP3j6qKKJ+R27ReovVCrYu0NkUgI03Ab6P1Jq1nay3ajDv5pVpHa52dAIhnUSF7aZ1j
pfmrqgijQlZpvSHmPeBn3KO1JT9fV0CwK1K8B/n+AxoE428BII1oFPG6FQFVh75XPZbXaGO+LtB6VIKyNKZvJ+V
Fx7UgOYXlH0CgA4/daISAy/74nBbg+9Ih3SHlBinVOkvrp3R2V/C6qWzE6w9iI/gKGm6Y1sMSPKORzx1gby3ADp
mu4odEbxVghwxiA7rkJFURyu3jke9Yjja+8geVC/PGlTaOawdr7eTxW7TxtuLzEKs+XLKYz+eSGayjmwj+GfkCv
g4b6YKUAL6KvRq0YTKBHiVN2YuvsSorTACSjlo/8kzfnMOtkccdjdjB+k1tWpogeVbrfPH5TDF6GNku5Pfo9O1Y
jih5P2Y7zIoJ+DKOBLDu36qKicLlVtDg4gR42J8aJtNCAI/JyYVsO1DLJvkAHj35SY8CRckGrS9oHcXXNTF/jwq
+S1WEH5/2BADkHPI7HznBcvAfpfUNa8RDqUGyQAAeeV8tvpvDzr6/GDWXan1bpPlGFU7GiQ5bRov/pdb2gqZ9py
oiX6Wshxu1vkVKu2ozorCYgxmpdSB8t6SA705wNcujIKgwzOPfzV6Yrywn7XjLYW1dckwMwJ9hUZW5KTcKOv3pz
Hs+o1royC8LwL/IRguS260RZUKIlQYI2lrt15Yjwb+0/kbrUI4i9fi5L8sky7yMQDdBgOO1Pqb1uYjnvS7P+hoc
QHVAed/h+x/IEmaw7oCLyUkAj0p8ilw4iSAaMJwNtLKS2bv3kvBhZdBtUZQI9GqqRzl21Lqb1s8i0oE2dBafR/J
1PK204e+y4O+y4cPkI4syDWLkZyHrR1mjZ2eOgmlIW/o/NkXaW7QJjMGuvC8MSC+LgkHqq1zIGSPzcRylo+Ravr
Zgp+4kOtERBGhUAMEF+C9FvSO6cwffX8bXO+IC/qg8wL6ejtOf7eE4CuSutCHAn0ancheP7Dp6AP5CR/7m1by3H
wCd4t4YddNIjCJBTtpeVCkPFYACNBcda4mgX7+kBTfSgCP0VwTqJ6R+JxBs53nU/Xh2KiWo3QuqgBIH8L3oHCQB
+2Ra3rlJQJ4A+G96Ar6V/OBYKdncQSMQJuyhNl2qcKKVpq7KxdLDZDo7/wZVeYVnQ0f7rFLpLIa7hnSmq3CUF/F
6PQLZ9tfaOKJdkurtLUaNEgvwGM0mClDDiNyskk8CSn9mViEAv09CsJfQoXmYQAkCOirqEK2/UBWTIS3YsHiwNz
iqzIxxX1+HrqmHdXc1ynAHJbD5tI/0IP3CULyNuL4rOWdzh6M7gDxbWRTn4hAn2u5Mz4j3Zwn+O4pGwJ6Y216Fh
36/onNrpNQx4o2k7zdcUA0ZeHg9IO8dHIERRMkuLZSFb8kQWuMEVn0ALYfLqteh9RykchMetmDWshsbYCStxg8e
9/ZdMlEa8dxDqiGqcBipSnPBaz9WFTO9e7EjIK78J8/8ylW81aKLhTVvSAp6seDp9cVIVyQAj7YOmszbhc/UNcT
wfEcQmxnsIo4g9hCOibLLC0VptmLosVVMrn6VqojPb3SAHQ9yKivypzHyPYuW4HKb2jhoza6eeX4f8h0AtXXAd8
+oXGy7j8W7x8YIyy0V7zGBdqXWI600uHYPo2K/YrgQIUxM0swTfoRLVjMKNsejLLUJyHLShZPZRjuJ0QXhydHCW
PyNERfsY/iAI/lwVXl+Y6EVoPiWGIHFP4nXTmXk7G7SlCsZBjWyjm0/Ih9rUhSx4+k2FW/CYCkdm+kBVn1nrQ/w
QZPIWkZXVkREbpYov1lf+CWTHPx9azaKazPKziI6U58WqaHgwa1V/OUA6KD/tjrYGlKqkWJEvF/raapizuFkld+
yA5T5CvJ2KaAW26lN1wS9z7Akrk0RNAk07Hqtv7fyAPjP5DPJOoVv9aqqiOUvp/HDqH2LGDlcgnuer1IIB4cB/k
iL60UJHvJwDm8usKOB7lObLvBJIv2EA+QC+89YFh/ZVgyhNuiX07HbYFEkCfj+tLxGxhEAYVJGy1xuXQegnrNGn
+V2e9Hi2pw5jJ50dQD9bVIkF/WznxdhvnM4arUT/F5GYk7iKGQc+bd53/UOqrk1772vys2ktougoRhNsPL2Q0aD
vuAI9x++ejvyxSH89YEYIHyFlr3UAfQiDo1XpcRxd4r4vr9nPp+q8LXxGJYP5hB7gWdZ+nveH43XmeAy8ryqmHw
ayBGwETXIkUsqqxzhTZsjdyGdWM+0MwLSvm910CYcmc4QIOxGfr87R4io5R+lHMFlVKgxHfweAb+5U3lOIroAX0
RvvblnBcIqHRvgTBYRMINTdOrCnNZmyn/29PmIkOSHzO92ld5aISP7kjZ8ZV0fzWiVdDgXx8y7WYjvITl0U0ek5
TTS0f0I8uKIaJRLPqGTbeRr0pswAcd/gSP3FLZxO456fRm9C6M8visqnYAfqPxW4ClWzokShJZ1H5Ey2JXFC225
Wfkvd3gq4vsPGd1YH0EZpnk6g7YVWxczYuIrPn7XEtKOVTRWBpiTBV2RYia40El7i5FirBjpgqzvXDKAX1nXl9F
feF106vqkxUbmM4QJo9mRo2JntnE56xYj8RtJAY8HGub52/nk06sDwD6UjkaaAuvxbgB/N+vVfWSuRyWNJijDAI
cGf4l1sMHxfR1VeTa0lI2/3KOcGMrjztB18kyznlTjWI/0A/jaXQD+G3G9XwjgFaNKT9KIvMYRqCVp8PEJsXBASGDBG/C3q00nQMJoxYmy0SywYxr6JpW+XGkiExbYW4tohq8VjJJ1nnmNoaM8ivz3CwH2sVaYcQ0B87Zn3k1Vbl1N
mhJ3ttY46XISrpW4HrUZ/z2qCjAMSQQW/vO4Pyq2ogQneP7uOvEANtjx8I+o9PfLIpw0wQH2hrzeLEbjjbIvvtn
x3CSHMPVTuY0hf6BOIfCPd4AdC6PeUj8+aR1A1Vrnme98JULYEYKFfgfl+yDFwrm8xfM3H0ekvcIjkhJX0LnODa
AMWIC0T4y8rlJ+s7U+4qJQrmiCAfvkmPkvUfE3wF/j4STGFbOct43KrZ8pESNlO1V5PZGvDzjAM+2ANAGP6ew9P
X+DSYayAOsOznlZypU9n1Z0tWXdDWXoFbOCndPsCY/YgwU/kJ0RFr1uSBSiCa1ieYz868TszJAWMdL6znSbSu8q
AF8qrvdNCPjOnvQS0j4NMBWHWCqXYCntuJDvMT3cKEWwz2bEaJkF9rqMshwZI6/VjEClvSn6DeoQggHgt5c2tGO
9LeL3z8cA7/gCUJQPOQo38eT13wZ0lm/zLMeeMQxtKlKLHPgIz/QjI5yOw1Ms2wekBostsMOpfjUm2CGIz39awL
pE1ALrh3ZnFOYlRxrs9ZxVhe27MuD6F6rySWxp7eL6roqebUVSC99L+e/6n7CJ91d5qW/nlB4G98EkyPeWg4qZu
om0mHEE0/+BM8cpnxi8kR0S2oGW/1TW8fUq3nZGRMGGxrz/yYLm/S3EmMijNLAG6saQPKNWjXZUuX0DcaJKmNy6
3zOtXLsPDHyZFPDdPNOCVsyLSJPv+Y1r6COg0jZaYMfo8ajyC5tKmaPC94L6WJIhCS3LLDbS70h3hnt29gXCQo+
KWd6lBNIb7HQuwRwDQnprea+ZliO/VG267zSKZ7cjAKeq6Ik4rM1pIHwq3+f7jMEVYPDupI2JxWOTVfikgZGXlH
WWi8PCo4H3SliWMQTG5w7n9C8JnWET5VgQlig7E37LkWLlt8NfeQ7FiD8Pi3F/WPTHOfTOtoCuWDbE3zsleDZw6
kOjwJ7Jlgd43zCWzwzZbQwfDYzIZyqjLGOMY2UBHVGYq6lJTlZYQrDPy5o4ExvwvtKNUZ3/A9+AVFCbcnJW8LJf
k96AknxNC44zQ6bI6IFjPfth5LptEz4TJsb6ZJY9kyAOv1YFT5jYAmQ7NyjHPYXAAXSMDLcq/5WaLoHDhG1iseL
DGYffsgA/L4Y1xeQETml9MinoHUDfjZGZ01V+pw4DtVgWW5aBPZMwwD9EsMWRW8mvf/AFvgPooDvYlIsYde08ng
EzqOerBKdy1SCwt1G5VZpNBWUEPcRG/GeqoUxYFYpNRI9uThVVS0VvhJCCSZXl7CDg4v1dVlmCG+8tsMOZxO4Wh
DDPyBPsiLF33sLBHiTDWM+7VMO9sbgQYezdN0en9QUCp70H2L+kY/oeqQgWTmHGDuu7MaFQEmLRIWZZQBqCGbqL
VPzThmsi2Bc4DM9uIekbsCNgAdgSVXlBGwINWGuD9e/Y+ueabDP/n/s108g1SnGAXsSy4J4LVfA/fhTxmRA0mZ+
PhUcGZ0dwXzi22CGOTRHYUrUPezFm2LALCZNXWDG3axU0LmZ8j2aZ11QRoGazQc3x1135GWrO7BnEz9jO9jrfmx
WEe4r0ZvXjsfwM4zGO783e2W1FenPP7sLouCiNSQ+jIk8OHq5yESu0N5Y3fMN2XMjv5D7agRzFP2UapB2vcps/A
M6ZLAe2Wy5mHuYvjkaJe/9RhUfLMOH5GXUOgw23iM47is80jG3wCdO+paJPjQsEPATT0IMtXmxkAx92ECsAywdw
3MZfWJDx7O2P5dPzPAXLgTvmw0kTWnezQvRwQcuMGLD0FWnHWdckoHry9QiR3qyI7ONI393Ky4eCYsQ1hzzNYie
EXMIAQTmd/BfZYcfRWuP9vRwBRhB8wEI/ldsKiA7Uidz8LJYHo8HDxNNMce+Pxb1twW+eZQdCOe5iuYaqyvM4mG
WfR98RhvkA4jEx4CEP8AHK2KvM+YVr+B2m/bGmBEcidKP16kUO/XqBgY4KxFHMx6vq+dvJCcIJtAHZgwbhENbbe
AvAtawO0pMWzOSFhW3PMQLWU+QV1KEmeJT3RpXbRogVrufw/UUC+OcxT1hRnCnTmBa2NwGOtNeq3A6tVtZrXY76
5xAP+9I43iHuPUbc2xaAGit1p9OQXMDgw32q8tmgU+kvDlW547Db5At4A/pDVe5ckPvI849jVOYQ9toT+eDY0va
QSm8Hkctv+AcpwdPVyJFBOxaRwnWghZnJoR8W+GBaxRmkXAv5PWax92eaLzgc/5JGoiWt1jwCDY1an3kdymvv8v
cdWAdmYVgSAUDNlrwPRP1id9SVLN8qlr8nDV6J6HD1Bc1QKncW/DLiIO4aKrPiVZ5t8yAt90QrrUxjDF69NACva
K1RwY+Qi11Gj3s8K/xjcvpxKr0NuUEg60ILsTKNDPN0Vg1N+StDfa/QdwGILrTSSEt8DWnga/xNY5U7mm6sI/8L
mOdU1ntt3lMRCBvyMB5G5CnQzQQO9iYvv4id9myVW9dvfj+CPsxIpqnDkX6qire1c6OjLA2Ue0O4PP04r7/TCdp
oXUr6AuuyHR+6LdPXUYX9K0UjvZT/7v6qkPEWtXhN8NO+gp7Y6Q3vn0SV/F3Sk4ms1yNE/pMC8m9B53c3j3Kb5d
Q/qNzaot4iGgNL/j2N23EE4ERy9lEqdzTiepVb44SOcANZQHsCciuVW4jo6pQ7ssw78vNHghKa/Ri/Z1kKFruPO
llgkaAt33EIq6o/rEq1U6UQipwuhtN1/DxJfD/TiqCYv9s0z4LRYIoAwwIlTn5gaO8d8Rl5vynq29AeyCm0xGGb
J1aI6NFk4XCaUWcK89iZbTtV5U5C60P+/hQpmKJTu46+xxnEwrVkAE1YzpnWvQer3OGrl/N+lwv6jGfagxGYV0i
tilQBJ8p8j9LYoPz/EbmmSjkpSAkbx2yeeJ/XXMe9PcHv3mRnWUlgldChC0o/j9SxjBGMEoKvTHS4EpU77tv8g0
iJMBSjeT+M0PvRisInu1T4Hu3pJxzG3z5IalWPIUV0hj/xO7NEG87jkwxB/5GBjtnMw0RnHuG9W/LedRn8KBGh5
KX0Vd7lSNWLHeVSldtov5q/WWuFyEuS4jHquOy0ZRvlv7CraVrcPSUL/2OUrVTuP1PLLEO3La2yaw8qAN9Ihf+T
ShEBHZRH0L1d0pjcfVmh6XKxyqQmS5na9E8X5Ii9NOR3ay2rGkQ5lya4d5DPWFoVFVJrM26sjRleM9kSAI//7ey
iKv8RVyaZ1ChK87LadGYvk0xqJOCn0dufljVHJjWZ0gDgmHTonoE9k5ps4TFhg8msqVn1Z1LV8j8BBgDJTf+jYX
O34QAAAABJRU5ErkJggg==

上面的base64字符串中你看不出任何跟图片相关的东西，但下面，我们将传统的 img 写法和现在的Data URL用法左右对比显示，你就能看出它们是完全一样的效果。但实际上它们是不一样的，它们一个是引用了外部资源，一个是使用了Data URL。

<body>
    <p>
    <h4>普通URL</h4>
    <image src="http://www.itcast.cn/2018czgw/images/logo.png">
    </p>
    <br/>
    <p>
    <h4>Data URL</h4>
    <image src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAALwAAAA5CAYAAACMNEHAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo5ZDAxYjE4NC04MTFlLTE4NDEtYTUwYi0wMzljNjZmNDA1YWUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MUYyRjEwQUFGMEY3MTFFN0IzQUU5ODg2NUEzREJFMDMiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MUYyRjEwQTlGMEY3MTFFN0IzQUU5ODg2NUEzREJFMDMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ZDA1ZmRhNzAtMzY1Yi1iNTQwLWE3OTYtOGVjNzJkYTQwZmMyIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6MDM4NzM5MTYtZTQ4ZS0xMWU3LWFlNTUt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">
    </p>
</body>

骚戴理解：可以通过代码看到普通的url是把图片资源放到了服务器上面，然后通过发请求的方式去获取图片资源再显示的页面上面，图片资源通常是转化为二进制或者字节流来进行展示在页面的，Data url是把图片资源通过base64编码的方式变成一长串的字符串，也就是Data url的这一长串字符串其实就是图片资源，不过通过base64加密后变成了字符串，原本是二进制或字节流，这就导致Data url占用的数据容量比普通url更大一些，所以Data url也被叫做带有数据的url！

优缺点分析

浏览器支持

几乎所有的现代浏览器都支持Data URL格式，包括火狐浏览器，谷歌浏览器，Safari浏览器，opera浏览器。IE8也支持，但有部分限制，IE9完全支持。

数据容量

Base64编码的数据体积是原数据的体积4/3，也就是DataURL形式的图片会比二进制格式的图片体积大1/3。

使用场景

DataURL形式的数据不会占用HTTP会话，所以再访问外部资源或当图片是在服务器端用程序动态生成时借用DataURL是一个不错的选择

骚戴理解：普通url是要发http请求的，这就会占用网络资源，如果图片很多的话那就会导致图片加载速度太慢，所以在图片资源所占的数据容量不大的情况下，可以用data url，因为data url本身就包含图片资源，但是如果图片资源所占的数据容量大的情况下，还是普通的url更好

Data URL实现用户头像上传

修改用户实体类，用户数据库表添加用户头像字段

使用基于Data URL的方式实现用户上传，实质是将前端上传的文件以Base64进行编码并且保存到数据库中。用户controller中添加用户上传方法

用户service中添加上传文件处理的方法

在service中需要对文件进行base64编码，并且保存到数据库中

导入imgUpload.vue到src\module-employees\components\component里面

在User实体类中添加private String staffPhoto; //用户头像

在系统微服务的UserController中添加上传处理的方法

    @RequestMapping(value="/user/upload/{id}")
    public Result upload(@PathVariable String id,@RequestParam(name = "file") MultipartFile file) throws Exception {
        String image = userService.uploadImage(id, file);
        return new Result(ResultCode.SUCCESS,image);
   }

骚戴理解：这里我经常犯错误，我一直觉得处理器的参数和请求路径一一对应，其实是错误的，应该是和前端传过来的数据一一对应，例如这里前端传了id和图片的二进制流，那么就处理器就对应着有这两个参数，同时注意图片资源在后端用到的注解是@RequestParam，不是@RequestBody！！！

在系统微服务的UserService中添加上传处理的方法

    public String uploadImage(String id, MultipartFile file) throws Exception {
        //根据id查询用户
        User user = userDao.findById(id).get();
        //对上传文件进行Base64编码
        String s = Base64.encode(file.getBytes());
        //拼接DataURL数据头
        String dataUrl = new String("data:image/jpg;base64,"+s);
        user.setStaffPhoto(dataUrl);
        //保存图片信息
        userDao.save(user);
        return dataUrl;
   }

骚戴理解： Base64在导包的时候不要导错包了！应该导下面这个路径的包

不过可以看到这个路径已经被淘汰了！但是用也可以用咯！

在UserResult里添加private String staffPhoto; 属性，这是用于回显图片的

骚戴理解：这里用的data url的方法来实现图片，并且可以把生成的data url放在数据库里，这个staff_photo就是存储data url的字段，可以看到数据类型是mediumtext，可以看到这样的话数据库内存就更大了，这也是data url最大的缺点！所以data url只适合小型图片，也就是存储容量比较小的图片！像那种几十M的图片就不能用data url！这样的大型图片可以用像七牛云这样的第三方云存储来存储图片！

解释一下mediumtext：在MySQL中，mediumtext是一种数据类型，用于存储medium长度的文本字符数据，最大长度为16,777,215个字符（约16MB）。与其他文本类型text和longtext相比，mediumtext的长度介于它们之间。适用于需要存储较长的文本数据但又不至于过于庞大的情况。例如存储网页内容或较长的文章文本等。

需要注意的是，由于mediumtext类型允许存储非常大的文本值，因此对于包含大量文本记录的表，查询和写入速度可能会变慢，并且也会占据大量的存储空间。选择合适的文本类型并合理使用数据库索引可以提高查询效率，减小数据存储空间的使用。

七牛云存储

概述

七牛云对象存储服务提供高可靠、强安全、低成本、可扩展的非结构化数据的存储服务。它提供简单的 Web 服务接口，可以通过七牛开发者平台或客户端存储和检索任意数量的数据，支持 “按使用付费” 模式，可以通过调用REST API 接口和 SDK开发工具包访问，下载协议采用HTTP 和 HTTPS 协议。方便程序员聚焦业务应用，而无需关注底层存储实现技术。

使用七牛云实现图片存储也比较简单只需要按照如下的步骤操作即可：

申请七牛云账号

创建空间 Bucket

上传文件

请求获取图片

账户申请

进入七牛云官方网站注册开发者账户

七牛云是通过邮箱注册的，注册激活后就进行认证，认证后即可开通对象存储业务了

创建存储空间 Bucket

点击左侧左侧菜单对象存储，一开始我们需要新建一个存储空间来存放我们的图片资源。点击新建存储空间，设置一些需要的内容，然后在左侧的存储空间列表我们就可以看到新加的空间了。

账号注册有些需要注意的点如下：

注册账号之后需要实名认证（个人/企业）实名认证之后才可以创建存储空间

存储空间创建成功之后，找到个人中心获取accessKey，secretKey和存储空间名称就可以进行上传操作了

入门案例

七牛对象存储将数据文件以资源的形式上传到空间中。可以创建一个或者多个空间，然后向每个空间中上传一个或多个文件。通过获取已上传文件的地址进行文件的分享和下载

搭建环境

<dependency>
  <groupId>com.qiniu</groupId>
  <artifactId>qiniu-java-sdk</artifactId>
  <version>[7.2.0, 7.2.99]</version>
</dependency>

文件上传

    @Test
    public void testUploadImage() {
        Configuration cfg = new Configuration(Zone.zone0());
        UploadManager uploadManager = new UploadManager(cfg);
        String accessKey = "COuoDRVa7JLsuurzIvQSI_pEDceHDw3yGfJEmvwv";
        String secretKey = "3RWpTjB5Jxg3QosUFr4mxbHXJ5JR2m6AHQqYsSlr";
        String bucket = "test-bucket";
        String localFilePath = "C:\\Users\\ThinkPad\\Desktop\\ihrm\\day9\\资源\\照片\\001.png";
        //默认不指定key的情况下，以文件内容的hash值作为文件名
        String key = "test";
        Auth auth = Auth.create(accessKey, secretKey);
        String upToken = auth.uploadToken(bucket);
        try {
            Response response = uploadManager.put(localFilePath, key, upToken);
            //解析上传成功的结果
            DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);
            System.out.println(response.bodyString());
       } catch (QiniuException ex) {
            Response r = ex.response;
            System.err.println(r.toString());
            try {
                System.err.println(r.bodyString());
           } catch (QiniuException ex2) {
                //ignore
           }
       }
   }

骚戴理解：覆盖上传只需要把代码改成下面 String upToken = auth.uploadToken(bucket，key);即可，七牛云有保护机制，

断点续传

    @Test
    public void testUploadImage1() {
        Configuration cfg = new Configuration(Zone.zone0());
        String accessKey = "COuoDRVa7JLsuurzIvQSI_pEDceHDw3yGfJEmvwv";
        String secretKey = "3RWpTjB5Jxg3QosUFr4mxbHXJ5JR2m6AHQqYsSlr";
        String bucket = "test-bucket";
        String key = "test";
        Auth auth = Auth.create(accessKey, secretKey);
        String upToken = auth.uploadToken(bucket);
        String localFilePath = "C:\\Users\\ThinkPad\\Desktop\\ihrm\\day9\\资源\\test.xlsx";
        //断点续传
        String localTempDir = Paths.get(System.getProperty("java.io.tmpdir"), bucket).toString();
        System.out.println(localTempDir);
        try {
            //设置断点续传文件进度保存目录
            FileRecorder fileRecorder = new FileRecorder(localTempDir);
            UploadManager uploadManager = new UploadManager(cfg, fileRecorder);
            try {
                Response response = uploadManager.put(localFilePath, key, upToken);
                //解析上传成功的结果
                DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);
                System.out.println(putRet.key);
                System.out.println(putRet.hash);
           } catch (QiniuException ex) {
                Response r = ex.response;
                System.err.println(r.toString());
                try {
                    System.err.println(r.bodyString());
               } catch (QiniuException ex2) {
                    //ignore
               }
           }
       } catch (IOException ex) {
            ex.printStackTrace();
       }
   }

骚戴理解：七牛云的断点续传是一种传输文件的技术，可以自动从上传失败或中断处重新开始上传，并继续上次未完成的传输操作。这个功能可以很好地解决大文件上传时网络不稳定、上传速度慢等问题而导致的上传失败等情况，提高了文件上传的成功率和效率。实现原理其实就是通过临时文件的形式，把已经上传的内容记录下来，包括位置，下次再从这个位置继续上传！适合传输大文件！

文件下载

对于公开空间，其访问的链接主要是将空间绑定的域名（可以是七牛空间的默认域名或者是绑定的自定义域名）拼接上空间里面的文件名即可访问，标准情况下需要在拼接链接之前，将文件名进行urlencode符。

七牛云实现用户头像上传

在ihrm_common微服务里导入依赖，也可以在父pom里导入这两个依赖

 <dependency>
        <groupId>com.qiniu</groupId>
        <artifactId>qiniu-java-sdk</artifactId>
        <version>[7.2.0, 7.2.99]</version>
    </dependency>
    <dependency>
        <groupId>com.google.code.gson</groupId>
        <artifactId>gson</artifactId>
        <version>2.8.9</version>
    </dependency>

创建文件上传的工具类

package com.ihrm.system.utils;
import com.google.gson.Gson;
import com.qiniu.common.Zone;
import com.qiniu.http.Response;
import com.qiniu.storage.Configuration;
import com.qiniu.storage.UploadManager;
import com.qiniu.storage.model.DefaultPutRet;
import com.qiniu.util.Auth;
import java.util.Date;
public class QiniuUploadUtil {
    private static final String accessKey = "COuoDRVa7JLsuurzIvQSI_pEDceHDw3yGfJEmvwv";
    private static final String secretKey = "3RWpTjB5Jxg3QosUFr4mxbHXJ5JR2m6AHQqYsSlr";
    //bucket是指的七牛云存储空间的名称
    private static final String bucket = "ihrm-bucket";
    //七牛云存储空间生成的域名地址
    private static final String prix = "http://pkbivgfrm.bkt.clouddn.com/";
    private UploadManager manager;
    public QiniuUploadUtil() {
        //初始化基本配置
        Configuration cfg = new Configuration(Zone.zone0());
        //创建上传管理器
        manager = new UploadManager(cfg);
    }
    //文件名 = key
    //文件的byte数组
    public String upload(String imgName , byte [] bytes) {
        Auth auth = Auth.create(accessKey, secretKey);
        //构造覆盖上传token
        String upToken = auth.uploadToken(bucket,imgName);
        try {
            Response response = manager.put(bytes, imgName, upToken);
            DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class);
            //返回请求地址
            return prix+putRet.key+"?t="+new Date().getTime();
        } catch (Exception ex) {
            ex.printStackTrace();
        }
        return null;
    }
}

骚戴理解：这个工具类只需要修改accessKey、secretKey、bucket、prix这四个参数即可，然后这里用的是覆盖上传，调用上传方法会返回一个能访问的url地址，也就是下面这行代码

//例如http://ruya1a2n3.hd-bkt.clouddn.com/1659438854295257088?t=1684575706082
return prix+putRet.key+"?t="+new Date().getTime();

这个地址是由七牛云存储空间生成的域名地址（30天后会过期）+文件名称+时间戳组成的，这个时间戳是因为七牛云有缓存机制，你修改图片后可以还是用的缓存里的图片，加个时间戳就可以解决这个问题！还要注意一个点，就是存储空间的地区变了那么下面的这个Zone.zone0()代码也要变，Zone.zone0()指的是华东地区的，七牛云Java SDK还支持其他几个基础API服务地区和区域配置，如下所示：

Zone.zone0()：华东

Zone.zone1()：华北

Zone.zone2()：华南

Zone.zoneNa0()：北美

Zone.zoneAs0()：新加坡

使用七牛云实现用户头像上传

修改UserService方法

public String uploadImage(String id, MultipartFile file) throws Exception {
    User user = userDao.findById(id).get();
    String key = new QiniuUploadUtil().upload(user.getId(), file.getBytes());
    if(key != null) {
        user.setStaffPhoto(key);
        userDao.save(user);
   }
    return key;
}

骚戴理解：这里会用QiniuUploadUtil工具类就可，知道upload方法两个参数是什么意思即可，第一个参数是文件名称，这里用的用户id作为文件名，第二个就是图片的二进制流

PDF报表打印概述

概述

在企业级应用开发中，报表生成、报表打印下载是其重要的一个环节。在之前的课程中我们已经学习了报表中比较重要的一种：Excel报表。其实除了Excel报表之外，PDF报表也有广泛的应用场景，必须用户详细资料，用户简历等。接下来的课程，我们就来共同学习PDF报表

常见PDF报表的制作方式

目前世面上比较流行的制作PDF报表的工具如下：

iText PDF：iText是著名的开放项目，是用于生成PDF文档的一个java类库。通过iText不仅可以生成PDF或rtf

的文档，而且可以将XML、Html文件转化为PDF文件。

Openoﬃce：openoﬃce是开源软件且能在windows和linux平台下运行，可以灵活的将word或者Excel转化为PDF文档。

Jasper Report：是一个强大、灵活的报表生成工具，能够展示丰富的页面内容，并将之转换成PDF

JasperReport框架的介绍

JasperReport是一个强大、灵活的报表生成工具，能够展示丰富的页面内容，并将之转换成PDF，HTML，或者 XML格式。该库完全由Java写成，可以用于在各种Java应用程序，包括J2EE，Web应用程序中生成动态内容。只需要将JasperReport引入工程中即可完成PDF报表的编译、显示、输出等工作。

在开源的JAVA报表工具中，JASPER Report发展是比较好的，比一些商业的报表引擎做得还好，如支持了十字交叉报表、统计报表、图形报表，支持多种报表格式的输出，如PDF、RTF、XML、CSV、XHTML、TEXT、DOCX以及OpenOﬃce。

数据源支持更多，常用 JDBC SQL查询、XML文件、CSV文件、HQL（Hibernate查询），HBase，JAVA集合等。还允许你义自己的数据源，通过JASPER文件及数据源，JASPER就能生成最终用户想要的文档格式。

JasperReport的开发步骤

JasperReport生命周期

通常我们提到PDF报表的时候,浮现在脑海中的是最终的PDF文档文件。在JasperReports中，这只是报表生命周期的最后阶段。通过JasperReports生成PDF报表一共要经过三个阶段，我们称之为 JasperReport的生命周期，这三个阶段为：设计（Design）阶段、执行（Execution）阶段以及输出（Export）阶段，如下图所示：

设计阶段（Design）：所谓的报表设计就是创建一些模板，模板包含了报表的布局与设计，包括执行计算的复杂公式、可选的从数据源获取数据的查询语句、以及其它的一些信息。模板设计完成之后，我们将模板保存为JRXML文件（JR代表JasperReports）,其实就是一个XML文件。

执行阶段（Execution）：使用以JRXML文件编译为可执行的二进制文件（即.Jasper文件）结合数据进行执行，填充报表数据

输出阶段（Export）：数据填充结束，可以指定输出为多种形式的报表

骚戴理解：这里结合下面的原理进行分析，设计阶段其实就是设计pdf的样式，根据jrxml文件生成jasper文件，执行阶段就是根据jasper文件生成jrprint文件，输出阶段就是根据jrprint生成指定的报表，比如说pdf报表

文件上传与PDF报表入门1