JavaScript进阶九 JS实现本地文件上传至阿里云服务器

最新推荐文章于 2024-07-31 13:53:13 发布

qq_43667184

最新推荐文章于 2024-07-31 13:53:13 发布

阅读量1k

点赞数 1

本文链接：https://blog.csdn.net/qq_43667184/article/details/87441804

版权

这篇博客介绍了如何使用JavaScript将本地文件转换为Base64格式并上传到阿里云服务器。通过FileReader API读取文件，然后在服务端将Base64内容还原为原始文件。文章讨论了实现过程中的问题和解决方案，并提到了对大文件上传的优化需求，如添加进度条功能。

摘要由CSDN通过智能技术生成

JS实现本地文件上传至阿里云服务器

前言

在前面的博客《 JavaScript进阶(八)JS实现图片预览并导入服务器功能》(点击查看详情)中，实现了JS将本地图片文件预览并上传至阿里云服务器的操作。这次需要实现将本地打包好的文件上传至阿里云服务器。使用前面的图片文件上传方法无法完成此操作。操作界面如下:

思路

本地与服务端传输文件的格式应该是熟悉的Base64格式。首先需要将本地文件转换为Base64格式，传输至服务端后，在服务端再将Base64格式的文件转换为原始文件。

源码解析

控制器

/*--------------移动APP版本管理G030 G031-------------------------*/medModule.controller('VersionController',function($scope, $http){$scope.queryFun = function() {
   try{appCallServer($http,"G030",{
   "mangid":localStorage.mangid},//success functionfunction(data){$scope.currentVersion = data.version;},//fail functionfunction(data){
   //alert("未找到记录:"+data.errtext);});}catch(error){alert("G030:"+error.message);}};$scope.queryFun();// 上传文件$scope.doTx = function() {
   var appBase64 = document.getElementById("appBase64").innerHTML; // 获取文件Base64编码内容var sunny = document.getElementById("appName"