I just got into touch with the concept of an inline image. Even if I encode the image file into base64, the following code is an inline problem.
Http requests can be reduced, but cross-origin cache is not allowed!
How to convert an image to base64 online
If javascript alone is a permission issue, javascript does not allow operations on local file files or folders for security reasons.
Now html5 is coming to Baidu, there are a lot of materials in Chinese, and now we use the readAsDataURL function in the html5 file api. This is a base64 encoded file.
? <! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <meta http-equiv =" Content-Type "content =" text/html; charset = UTF-8 "/> <title> simple html5 File test for pic2base64 </title> <style> </style> <script> window. onload = function () {var input = document. getElementById ("demo_input"); var result = document. getElementById ("result"); var img_area = document. getElementById ("img_area"); if (typeof (FileReader) === 'undefined') {result. innerHTML = "sorry, your browser FileReader is not supported. Use a modern browser! "; Input. setAttribute ('Disabled ', 'Disabled');} else {input. addEventListener ('change', readFile, false) ;}} function readFile () {var file = this. files [0]; // here we can determine if the type is not an image, and then return and remove it to upload any file if (! /Image \/\ w + /. test (file. type) {alert ("Please make sure the file is of the image type"); return false;} var reader = new FileReader (); reader. readAsDataURL (file); reader. onload = function (e) {result. innerHTML = ''; img_area.innerHTML = '<div class =" sitetip "> image img Tag display: </div> ';}} </script>
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
