Home > Developer > Web Develop
How do I get the Base64 string for a picture?
1: Use code to get:
Run the following code
Newfunction(e) { htmlimage = ' "; // here E.target.result is base64 code }reader.readasdataurl (file); 2: In the WebKit kernel browser has a very convenient technique, you hit the developer tool, select the picture, then the right side will appear corresponding to the image of the Base64, you copy the string, in front of the string with data:images/gif;base64, Then directly copied to the browser's address bar, Open will show this picture;
：
Demo of Base64 Pictures:
Run the following code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "><Htmlxmlns= "Http://www.w3.org/1999/xhtml"><Head><MetaHttp-equiv= "Content-type"Content= "text/html; Charset=utf-8 "/><Title> Untitled Document</Title></Head><Body><ImgSrc= "data:images/png;base64,ivborw0kggoaaaansuheugaaabaaaaaqcayaaafo9m/ 3aaaagxrfwhrtb2z0d2fyzqbbzg9izsbjbwfnzvjlywr5ccllpaaaaybpvfh0we1momnvbs5hzg9izs54bxaaaaaaadw/ ehbhy2tldcbizwdpbj0i77u/iibpzd0ivzvnme1wq2voauh6cmvtek5uy3pryzlkij8+ Idx4onhtcg1ldgegeg1sbnm6ed0iywrvymu6bnm6bwv0ys8iihg6eg1wdgs9ikfkb2jlifhnucbdb3jliduumc1jmdywidyxljezndc3nywgmjaxmc8wmi8xm I0xnzozmjowmcagicagicagij4gphjkzjpsreygeg1sbnm6cmrmpsjodhrwoi8vd3d3lnczlm9yzy8xotk5lzaylziylxjkzi1zew50yxgtbnmjij4gphjkzj Pezxnjcmlwdglvbibyzgy6ywjvdxq9iiigeg1sbnm6eg1wpsjodhrwoi8vbnmuywrvymuuy29tl3hhcc8xljaviib4bwxuczp4bxbntt0iahr0cdovl25zlmf Kb2jllmnvbs94yxavms4wl21tlyigeg1sbnm6c3rszwy9imh0dha6ly9ucy5hzg9izs5jb20vegfwlzeumc9zvhlwzs9szxnvdxjjzvjlzimiihhtcdpdcmvh Dg9yvg9vbd0iqwrvymugughvdg9zag9wientnsbxaw5kb3dziib4bxbnttpjbnn0yw5jzulepsj4bxauawlkojm4rjcymue5nefdnzexrta5rjmxodi4rju2o Tnemznciib4bxbnttpeb2n1bwvudelepsj4bxauzglkojm4rjcymufbnefdnzexrta5rjmxodi4rju2otnemzncij4gphhtce1nokrlcml2zwrgcm9tihn0um Vmomluc3rhbmnlsuq9inhtcc5pawq6mzhgnzixqtc0qum3mtffmdlgmze4mjhgnty5m0qzm0iiihn0umvmomrvy3vtzw50suq9inhtcc5kawq6mzhgnzixqtg0qum3mtffmdlgmze4mjhgnty5m0qzm0iilz4gpc9yzgy6 rgvzy3jpchrpb24+idwvcmrmoljerj4gpc94onhtcg1ldge+idw/ehbhy2tldcblbmq9iniipz5ftzgyaaadg0leqvr42mjgaailry3/ tmryegp3vx8xaaqqg76blqfilog9fv9/txmt/wabboa4uwx8bwf9q4v9dcc1n798+//r95//b9rn/wmeefiftpbxf1l5bqcwr0vrux+kxele9t +iz9htqp2/weuq4e2jzwy2l/kdgtz3wyanvpxk7x8pcvkfgaaca5oxvxowta75dwokqo2ycookidkwedff/p/ 7jw92mjacegfgupmjof4fo4o4ior9zwcmjaxqsob7kzlj/z81v/7/7dv3/79///7/7efv/5g2wv/lzvt2m4jm+h8n6p+1tr8y7muxmvd/ fc2gz17bchk/f4n15x1ggabigaebw8/16iq6/xuv1fbdxidogtdmzd3fhz245z8zm/n/ek0or/ifpoajxhj78reaaxjgrozumta47oax+p+rm/ 3//zus/392sp5fjcb2fzopqwpibezjy8f/256fzea1lgfgbhr6/4d3dneemjnesesyxl5ygheu+v9/pnv2/0mg0/8fp37+//fv3/8x7778l5vs /g9zg+ctr38zxfbuzgbjy2p4/o0xw4/p7xn+/v0lca7jgyb3dbq/mdecorzhwk4dxid7rjvbxpebybn9e1duhwaiuca5+ ziugfh8tlf1qfzvq1yvktvwo14vjbleiwyxscqwrmjobv2kef+ a2cwvirbhdiyigejewilfwcas8ahhrgl6tw7r3ropbrmn8s3f9j2c73foh8oo2pahctq5gwujymnpel94kjdtd0oluiaqovfh/ Pb5xyk9dmudp87rrvr0dwqcttpzt81n9k/anrpkqax0rpwwydoyj/xsdkmtr74bup0prlkvgbadiigex+movhhhxlahmfqklifq9xeizgw6zxb/ Tikpdadzxnryse7lwbimq9ymozzzyctuod4voaujsyyzdinx5udx2psrakzvceis5c8vnwbh1a1uzhiaxt7k6hjoktosnc34stih0nug7lvoa2ododwgondan j+dedujjksx93c0j+ql3snqrc8ikmueafmoyycvhwijauk+gehbfqxthr/ynx9ktjzznxqyw02zrcu2hbococ0lkntlqzjl8ekxc/ x8dwnzxqteygiu966ty/tc8a/edzfeu++qxakekbirv59eedu+4ziz2k7ztfoll4oksimo76ex9xbpksf8ppanfgkr/ Lchulcaaaaasuvork5cyiivkiagfhhhdjawfgiyzta0ztk5nji2mwi5owrkotrkzjnlzjg2ywmzm2ziicov "/></body></html>APNG
This thing is made by Mozilla, it is 24-bit, but also is a motion diagram, can accommodate 1680 color, but also to replace GIF, but .... Also on Firefox support, IE10 and Chrome,safari all not, if the GIF picture is a card machine, Apng is SLR, test browser support apng format;
Http://www.cnblogs.com/diligenceday/p/4472035.html
Gif/png/jpg and Webp/base64/apng picture pros and cons finishing (go)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
