如何用JavaScript实现头像上传及预览功能并支持提交？

本文共计1082个文字，预计阅读时间需要5分钟。

在用户注册账号或修改资料时，需在本地选择一张照片作为头像，并实时预览。常见思路有两种：一是将照片上传至服务器临时文件夹，并返回该照片的URL，然后进行展示。

在用户注册账号或者修改资料的时候会需要用户在本地选择一张图片作为头像，并同时预览，

常见的思路有两种：一是将图片上传至服务器的临时文件夹中，并返回该图片的url，然后渲染在html页面；另一种思路是，直接在本地内存中预览图片，用户确认提交后再上传至服务器保存。

这两种方法各有利弊，方法一很明显，浪费流量和服务器资源；方法二则加重了浏览器的负担，并且对浏览器的兼容性要求更高。