[英]File upload using base64 encoded text instead of multipart/form-data - good idea?
I currently have a django formset with dynamic number of forms. 我目前有一个动态数量的表格的django formset。 Each form has a file field.
每个表单都有一个文件字段。
While this works, I need a way to allow multiple files to be selected at once. 虽然这有效,但我需要一种方法来允许一次选择多个文件。 I can do that with
input type='file' multiple='multiple'
and I can read file data using FileReader
. 我可以使用
input type='file' multiple='multiple'
来做到这一点,我可以使用FileReader
读取文件数据。 But how can I pass these files to django formset instead of form-0-file
, form-1-file
etc? 但是如何将这些文件传递给django formset而不是
form-0-file
, form-1-file
等?
I can think of one way - replace FileField
with TextField
, and pass around the base64
encoded file as text, but I'm not sure if it's a good solution. 我可以想到一种方法 - 用
TextField
替换FileField
,并将base64
编码的文件作为文本传递,但我不确定它是否是一个很好的解决方案。
Just use multiple attribute and use FILES to get all of uploaded files. 只需使用多个属性并使用FILES获取所有上传的文件。
base64 encoding maybe not help base64编码可能无济于事
Using multiple='multiple'
is not related to formset or single form. 使用
multiple='multiple'
与formset或single form无关。 It will work natively with django. 它将与django本地工作。 So that if you plan to have single form instead of formset, just put
multiple
attribute and then access request.FILES to get all of uploaded files. 因此,如果您计划使用单个表单而不是formset,只需输入
multiple
属性,然后访问request.FILES即可获取所有上传的文件。
You should store the Images as Files, (Here are some good answers to do that) , 你应该将图像存储为文件, (这里有一些很好的答案) ,
I already tried to store images of that way but it have a lot of problems: 我已经尝试存储这种方式的图像,但它有很多问题:
Every time you go to that page, it will start loading the image again, and the people don't want to load the same image every time. 每次进入该页面时,它都会再次开始加载图像,并且人们不希望每次都加载相同的图像。
It will use a lot of bandwidth. 它会占用大量带宽。
If you are using a free web hosting service, will spend all you your bandwidth in a couple of hours, or when you store 50 images, so that mean that your site will be out the whole month, even the services that provide unlimited hosting and bandwidth, inforce a monthly bandwidth. 如果您使用免费的网络托管服务,将在几个小时内或在您存储50张图片时花费所有带宽,这意味着您的网站将在整个月内出现,即使是提供无限托管服务的服务带宽,强制每月带宽。
I recently had a problem where I had to implement a solution where a user can upload a document, stream that to the server, and without storing in on the server, post the stream to a SOAP server. 我最近遇到了一个问题,我必须实现一个解决方案,用户可以上传文档,将文件流传输到服务器,而不存储在服务器上,将流发布到SOAP服务器。
The way I implemented it, is as follows: 我实现它的方式如下:
I wanted to upload the file via AJAX in order for me to show the progress of the upload. 我想通过AJAX上传文件,以便我显示上传的进度。
This is my solution (Please note this only catered for one file at a time - but it might be a starting point.) 这是我的解决方案(请注意,这一次只能满足一个文件 - 但它可能是一个起点。)
JavaScript: JavaScript的:
First declare an object for the FormData - This will be used to send any additional info along with the files: 首先声明FormData的对象 - 这将用于发送任何其他信息以及文件:
var formData = new FormData();
Secondly append all the data you would like to send to the server: 然后将您要发送到服务器的所有数据附加到:
formData.append("documentDescription", $("#documentDescription textarea").val());
formData.append("afile", file.files[0]);
Now create a new instance of XMLHttpRequest: 现在创建一个XMLHttpRequest的新实例:
var xhr = new XMLHttpRequest();
This is the rest of the code that got everything working: 这是使一切正常工作的其余代码:
xhr.open("POST", "UploadDocumentURL", true);
xhr.upload.onprogress = function(e) {
if (e.lengthComputable) {
var percentComplete = (e.loaded / e.total) * 100;
$('.progress .bar').css('width', percentComplete + '%').attr('aria-valuenow', percentComplete);
}
}
xhr.onload = function() {
if (this.status == 200) {
var resp = JSON.parse(this.response);
if (resp.type === "error") {
notify.add(resp.type, "Error", resp.message, 3000, true);
} else {
notify.add(resp.type, "Success", resp.message, 3000);
}
}
;
};
xhr.send(formData);
PHP PHP
$documentName = $_POST["documentDescription"];
$fileName = $_FILES['afile']['name'];
$fileType = $_FILES['afile']['type'];
$ext = pathinfo($fileName, PATHINFO_EXTENSION);
$fileName = pathinfo($fileName, PATHINFO_FILENAME);
$fileContent = file_get_contents($_FILES['afile']['tmp_name']);
You will now have the Binary data on the server. 您现在将在服务器上拥有二进制数据。
You should be able to make this work for multiple files by looping through the file.files[0]
in JavaScript. 您应该能够通过循环遍历JavaScript中的
file.files[0]
来使这个工作适用于多个文件。
Hope you can apply this to your problem. 希望你能将这个应用到你的问题中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.