将图片转成二进制并生成Base64编码，可以在网页中通过url查看图片

比眉伴天荒 2022-08-02 18:27 120阅读 0赞

data格式的Url最直接的好处是，这些Url原本会引起一个新的网络访问，因为那里是一个网页的地址，现在不会有新的网络访问了，因为现在这里是网页的内容。这样做，会减少服务器的负载，当然同时也增加了当前网页的大小。所以对“小”数据特别有好处。

另外听说这种方式可以将一些敏感的图片放进网页中...挺好玩的.....

一、 在网页中查看图片的方法为：

**\[html\]** [view plain][] [copy][view plain]

1.  **<****body****>**
2.  **<****span****>****<****img**width=100height=100src="data:image/gif;base64,（此处填图片转成base64编码后的编码）"**/>****</****span****>**
3.  **</****body****>**

由于base64编码太占用篇幅因此仅仅用括号说明了一下。

二、用Java将图片编码的代码，与将base64的编码转成图片的Java代码：

**\[java\]** [view plain][] [copy][view plain]

1.  **package** base64; 
2.  **import** java.awt.image.BufferedImage; 
3.  **import** java.io.ByteArrayInputStream; 
4.  **import** java.io.ByteArrayOutputStream; 
5.  **import** java.io.File; 
6.  **import** java.io.IOException; 
7.  **import** javax.imageio.ImageIO; 
8.  **import** sun.misc.BASE64Decoder; 
9.  **import** sun.misc.BASE64Encoder; 
10. 
11. **public****class** TestImageBinary \{ 
12. **static** BASE64Encoder encoder = **new** sun.misc.BASE64Encoder(); 
13. **static** BASE64Decoder decoder = **new** sun.misc.BASE64Decoder(); 
14. 
15. **public****static****void** main(String\[\] args) \{ 
16.  System.out.println(getImageBinary()); //将图片转成base64编码 
17.  base64StringToImage(getImageBinary()); //将base64的编码转成图片 
18.  \} 
19. 
20. **static** String getImageBinary()\{ 
21.  File f = **new** File("d://1.jpg"); 
22.  BufferedImage bi; 
23. **try** \{ 
24.  bi = ImageIO.read(f); 
25.  ByteArrayOutputStream baos = **new** ByteArrayOutputStream(); 
26.  ImageIO.write(bi, "jpg", baos); 
27. **byte**\[\] bytes = baos.toByteArray(); 
28. 
29. **return** encoder.encodeBuffer(bytes).trim(); 
30.  \} **catch** (IOException e) \{ 
31.  e.printStackTrace(); 
32.  \} 
33. **return****null**; 
34.  \} 
35. 
36. **static****void** base64StringToImage(String base64String)\{ 
37. **try** \{ 
38. **byte**\[\] bytes1 = decoder.decodeBuffer(base64String); 
39.  ByteArrayInputStream bais = **new** ByteArrayInputStream(bytes1); 
40.  BufferedImage bi1 =ImageIO.read(bais); 
41.  File w2 = **new** File("d://2.png");//可以是jpg,png,gif格式 
42.  ImageIO.write(bi1, "jpg", w2);//不管输出什么格式图片，此处不需改动 
43.  \} **catch** (IOException e) \{ 
44.  e.printStackTrace(); 
45.  \} 
46.  \} 
47. 
48. \}

此Java代码sun.misc.BASE64Decoder这个包导入不进去的话，请将eclipse的Java运行环境修改成不是eclipse自带的jdk，我本来导入不进去，换成本地1.7的jdk就OK了。

一下提供一个编码后图片的url:

**\[html\]** [view plain][] [copy][view plain]

1.  **<****span****>****<****img**width=10height=10src="data:image/gif;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0a 
2.  HBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIy 
3.  MjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCABgAGQDASIA 
4.  AhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQA 
5.  AAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3 
6.  ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWm 
7.  p6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4 Tl5ufo6erx8vP09fb3 Pn6/8QAHwEA 
8.  AwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSEx 
9.  BhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElK 
10. U1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3 
11. uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3 Pn6/9oADAMBAAIRAxEAPwD3 iii 
12. gAoorL1XWbTR4vMuTKzHG2OGMu7EkKAAPUkAZ7mgCXUdTtNLtvOupAoJ2ogG55GPRVUcsT6CsxJ/ 
13. EeqBmijt9HtzzGZ08 cj/aQEKn5tWNcQw6lczPdrbieE7r2/lAdbP 7BC3Z eSPx5IAb9mv4Qbm1 
14. 13VW2jMS3NnKUc8EA 3GOR3 hoA6FdM1vB3 ICT222cY/PrUJbxPYxiV307UEBy6KjwOFz1BywJx 
15. 2wOaPD vfboEhvmMd6ZHRUaJkLAcjqAN23BIFdFigDM0jWrPWrd5bZiGjfZLE A8bejCtOud1uB9 
16. LlTXrRGY2yBLqFAAHt8ksQAMllyWAz6jvW5BNFcwRzwyLJFIodHU5DA8gigCaiiigAooooAKKK5n 
17. xFqGrwXUFppUYeSSCSXaoBdtpUYGSAOGJBJwSAOM0AdISFBJIAHUmvOWubrV7iTxBJK1vp9zKtna 
18. rGpad1DMo8rkAMxJO45wM4xjJsXelSXGi6VaPqd/NfahcpGZ5ZXjk8kHfICgO0HapU8Yy30rql0O 
19. 1S9spgCI7GMpbQDhEJGC2O7YyAewJ9aAMnZDpdg2oarGmm6NpkZlhtdwbbt/5aORkM3ooJ5OeSRj 
20. G8L/APCUeMLZ9cv9Xu9I0y5ctp9haxRiQRdFeR2ViSRzj8av63b6RptpNqXi6C2vIpiRLJKnmRxD 
21. IEcUcZyWJ9hknJOOBUFrqF3qKxnTfBeqLbOMh9SvBbIF6cJuZhx0G0fhQB0troFtbXy30kk91eJH 
22. 5az3DAsB3xgAZPritiuTHh29uL6yuZWt7VLchisMskjDBzgM2MZ6E9xXRXV9BZCEzuEE0qwp7u3Q 
23. UATOgkjZTnDDBwcH8xXD GNPuLzTLmE6jqaR2V1NbRolyqrKqsdvIXcvBA6g8ZrRXVL7Urqd9GvY 
24. JrIyMrXDxERwbRtIDfxnOT6DA57Vj FdKvX1C/u7W/BjWQfvJ43kDylfnZRvUY oJJOcjoACtPfe 
25. KvC mL56TXQZuACJPIU9S8jZLEYLbVHsDXfaZeRahpdtdwzpOk0auJUGFbjqAen0rD8US6ZYTWuo 
26. 6hqV1bPGVWOOAk7/AJuflHUEHB9vpV3wzbPDpxcQPb20pVre3c5ZE2gAt6McZI7Z9c0AbtFFFABW 
27. B4hS6tUTWLCSNZbRWEqSDKyQkguOowwxke4x3rfrK1f/AElrfTFPNw4aUDqIl5Y/icL/AMCoAr6c 
28. jajqr6tJGywJH5NlvBBKthnkweRuIUDPOF963a5/WNcTTtb0nTnu44WvnYKvlGR5CMfKMfdGNxLH 
29. OMVy rav4i8U39xoulmLQdOI bU7lw0tzEeCYE6YP94njI6E0AUNJ1O3 I/xAvbkzNHpmgExacEk 
30. AMtwT804B4O0DAyCAGz3r0AWmqw2hji1OOWXDYluLfLZJJH3SBx0xis/S/BOjaT4ah0K2hdbeJSB 
31. Nn99knLNvHIYnuMdsdKnOiX8UzJZ61dwW2wlQ5E7bz7yAnaB2zk568UATyWGq3dpHDcX0ETqyszw 
32. RNlsdRy3ANQQ F7U2ltb6lcT6lHbbfKW4I2AqMA7VABPuc9TSNpPiELGyeJTuX74ayj2v0/Ed 9Q 
33. HwvdXnGq6vcXMbNueJMoregxnAHtj8aAHanfz3FrLp3h 0EzIhjeYbRDCOm1c8M OijgdyOhv2E0 
34. Gm6TZpdCOxB2xJHJJklieBk9WP55zUiNYaDp 2a8jhtogzKZpABGg7AnsK5iC tviDPOLCbztCiZ 
35. FNztXDyKdx8sHkHlQWI7HHWgB0it4g8TXGny61JcWUMm82tvEgEbIeVkYjcMNjBHXB9DXcVQ07S4 
36. dNSXy3kklmk8yWWQgs7YAycADoAOAKv0AFFFFAEUsscETyyuqRopZmY4CgckmsvREkuDNq1wCr3m 
37. 3yUZcGKAD5FPuclj7tjtUGr7tU1W20VAfs4UXV6exjB SP8A4Ew5/wBlGHet1mCKWYgADJJ7CgDm 
38. 9W0 C41yIELJeXcfkqwXDQWynMuG6jcSFz7j0p/jLw6PEfhG80uFUS4Me61YjhJF5X6DjH0NO8Oh 
39. r S816UEG9YJbg/wW6ZCfTcSzH/eHpXRUAfMWk/GPxZ4dvbCw8Rxu1tBGiuPLCztHkc5JwxwuMn1 
40. PevYNJ MXgjVrbzRrUdmw6xXimNh/Q/gTWH8UPhxputfZdXMhtkhmxclYwVRHPMhHBIDEFhnoWPB 
41. rntY/Z0guCk2j6v9mLkF4Z0LonHO1hyRnpnt3oA69fjf4JEsgl1FlULuRlhd93HI4HBz BqaLxT4 
42. 116J7jQvDUUWm3RRbS61CcRuqN1mMQ5ZcEEDIP1rgfB/ws0S08UeIdF8QWl1cC3EAsLto3TeWHzO 
43. mPlIDFeuQO/evWJfC0lrpVvbaZc/ZWjILpFJJFE/IzhVbCA88DjntQB4p8SPCmuzalpenPr0 qae 
44. LmO1y8aoEuZCzPsVeuF Ykk4zgmvc/BGijw/4QsNOUKFRCw2rt 8S3I9eeax7Hwpbz6xb2k0rz2W 
45. kLJhWGA002CV78LHgdcneck857scCgAooooAKKKKAGhQCWAGT1NYPieaWS3h0m3JE2oP5RI/hj/i 
46. P5f1roO1c3ow/tbXLvWm/wBTGPstqCP4Qcs34mgDfghS3gjhiGI41CKPQAYFS01mVVLMQFHUk9Kh 
47. muobe3knllVY487mz0/ v7UAPlhSeJ4pUV43UqysMgg9Qa4yDxTZ6Jr0nhDVdRW3uPKD6fdSEfPG 
48. 2QqMTx5i4xz94YPXNQ6j4w1q2v4hDpsZtpmdY48M8p2EKxIU5zubGFBxg5pt54NHiuO9HiizCnU4 
49. Y8RQtuNk8W7aQ/diJCT24xyKANmeLV4Zlsol1GeAupa/ 0wKwHf5dvQfSma/4nt/Ddtb2PnPe6tc 
50. EJBCcFzlgvmSbQNqAkZbA9BzXjOtal8Tfhe50OC7k1DTZjssLx4PNIz0Ck5KsP7pyPTiu40Xwjda 
51. b4ahgvJZZvFetOtzd3Ez7mHlESeWW7LkKvHdqAPSNMsRp9ksJkMkhYySykYMkjHLN7ZJ6dhgVoVx 
52. KeMbyPV4INRtIbWNziWHLGWAdnYkBSue4yK7CKeKdN8To6ZI3KQRkHBoAmoqna6jZX0MM1rcxSpN 
53. kxlW /jg4 lXKACiiigCpqF2LOwluCAxRflX 8x4UfiSB NYNvcH7fF4ftb6KGS3hE12ykNKxYnI 
54. UHpk7iTg4yMdci/rtnJqRsrJZbiKJ5TJLLAdrAKOBu/hySORz6U618N6PZTwT2thDDNACI5EGGwR 
55. g5P8WffNAFXXdDtJ9DvYy0jzNA4iNxdOV34 XOWx1xXKaPYWEVvFPHbo/nLb3cKuOFdSjHaT6kuM 
56. kZ Su6kis9ds45A7PEH3I65UqwJB6/iMEVx1jbTXGjRp5c26IPtOz5vlZlbt13IxH/XQUAEV/eWG 
57. uWPBuJpbmWHYSI9 4Zz06lVQ hINdpBqiSSeVNBcWsnQCZPlP0YZU/nXCX6TtcRXckU261uo7ktG 
58. nzAI ZFBx02uWHqIyO9ehTwW2o2UkEypNbzKUdTyGB4IoAo69pratp32IBdkkqeYxbBVAckj1OBg 
59. fX2rkZvFIX4nx2P2v7LpGn2zwzb8qjSkAjLEY4GABnrmumitb7T9JNk9zLdgssEEo SZEY4yzcgl 
60. R/FjnHIzV7TtHstMiCwQ7n6tNKd8jnuWc8k0AY r31pqCW81lHLPPDOgRvKdY2DMoKlyACDkHGeo 
61. Fcs1pb2cctjYM0Frc3O2aJXPlniZ5FAzwCI1PGMbj24rt9enSP7Ijq5RJPtL7Rn5Y8ED6lig/GsR 
62. dPMeg2moy2gkaKeS4kjfPzrKrIx6ZGA3/fIoAg0rwyYtbubvSZEsY7ItDbQzRCTliWcsM5CnI2kE 
63. HBPrz0lpqlzHdJZarbrbXEgPlSRvvilIGSFJAIbqdpHTpnBrlPDMk8 qSYgvIJLyNSb1VZgTGowp 
64. JG3GD7ZOfUgdVeaVcalb TdXKAAbk2R8pKDlJA3YjigDaoqjplzNd6dDNMnlTEFZEYdHBIbHtkHH 
65. tRQB/9k="**/>****</****span****>**

转自： [http://blog.csdn.net/caoyuan10036/article/details/7045190][http_blog.csdn.net_caoyuan10036_article_details_7045190]

[view plain]: http://blog.csdn.net/caoyuan10036/article/details/7045190#
[http_blog.csdn.net_caoyuan10036_article_details_7045190]: http://blog.csdn.net/caoyuan10036/article/details/7045190