利用 Javascript 实现上传图片并向服务器获取图片路径后显示的 demo

       由于某些特殊原因，有时需要从服务端请求到图片路径，需要给该接口传递对应图片的base64 dataURL，并且有时需要将其上传图片的类型统一为 jpeg 格式时，可采用以下方式。

HTM L代码如下：

   

	   
	   

	   
	   
	   请选择上传图片：
   

JS 代码如下：

原始页面效果如下：

选择上传图片后并显示在页面的效果如下：

然后要提交表单之后显示图片的话就得传递该图片的完整路径过去，由于 file 类型的 input 出于安全考虑不让修改其 value 值，于是我就利用一个隐藏域指定其 value 值为该图片的路径以此来给表单接收该值，这样就解决了该问题了！

注意：虽然文件加载进来了，但是图片也需要加载进来再进行处理，也就是要加上 image.onload 函数对图片进一步处理，否则返回的图片路径访问不了，提示图片内容有错，应该就是图片数据不完整的缘故了，所以上面两个异步执行的 onload 函数都要加上。