Tag: jquery file upload

函数在执行Jquery Image加载之前返回值

if (DataService.Validation(file)) { //angularjs call to api controller }; //DataService Validation: function (file) { var Url = URL.createObjectURL(file); var img = new Image(); $(img).load(function () { var imgwidth = this.width; var imgheight = this.height; if (imgheight > 400) { viewModel.ErrorMessage = ‘The Image height cannot be more then 400 px.’; return false; } }); img.src […]

如何使用javascript或jquery在浏览器上获取文件创建日期

我需要在上传xls文件时找出文件创建日期和文件上次修改日期,我必须在这两个日期做一些计算。 通过使用下面的代码我可以很容易地获得文件最后修改日期 $(‘#userfile’).bind(‘change’, function() { //this.files[0].size gets the size of your file. alert((this.files[0].lastModifiedDate)); alert((this.files[0].DateCreated)); $file_full_path =this.files[0].mozFullPath; alert(alert); }); 我无法找到文件创建日期。 任何人都可以帮助我。 我也通过PHP尝试过,但是不可能通过php,因为php不会将此信息发送到服务器。 请告诉我有没有办法获取这些信息。 谢谢。

Amazon S3和jqueryfileupload插件的图像上传性能问题

我有另一个亚马逊的问题,它与文件uploads有关。我正在使用jqueryFileUpload和amazon API将文件上传到亚马逊S3。我已成功上传它,但它涉及一个技巧。 我必须将图像存储在我的服务器上,然后使用S3的putObjectFile方法将其从那里移到S3。现在该插件具有很好的function来裁剪/调整图像,我一直在使用它们。现在我整合了插件使用AWS,我面临上传的性能问题 。上传时间比平时长,这引发了我们使用AWS S3而不是传统方式的问题。 我不得不对我的UploadHandler.php文件进行更改以使其工作。这些是所做的更改。我将一部分AWS上传代码添加到735到750行的文件中 $bucket = “elasticbeanstalk-2-66938761981”; $s3 = new S3(awsAccessKey, awsSecretKey); $response = $s3->putObjectFile($file_path,$bucket,$file->name,S3::ACL_PUBLIC_READ); $thumbResponse = $s3->putObjectFile(‘files/thumbnail/’.$file->name,$bucket,’images/’.$file->name,S3::ACL_PUBLIC_READ); //echo $response; //echo $thumbResponse; if ($response==1) { //echo ‘HERER enter!!’; } else { $file->error = “Something went wrong while uploading your file… sorry.”; } return $file; 这是git上s3类的链接。 正常上传到我当前的服务器(不是亚马逊),相同的图像上传15秒 ,但在亚马逊S3上需要大约23秒 ,我无法找到更好的解决方案。我必须将图像存储在我的服务器上上传到S3,因为我不确定我是否可以动态处理它们并直接上传到S3。 任何人都可以建议正确的方法来解决这个问题吗?是否有可能将图像大小调整到内存中的不同大小并直接上传到S3,避免了将其保存到我们服务器的开销?如果有,任何人都可以指导我朝着正确的方向前进吗? 谢谢你的关注。

jQuery / AJAX – 将附加数据与文件上载一起发送

我使用jQuery将文件上传到服务器: $.ajax({ url : ‘http://www.example.com’, dataType : ‘json’, cache : false, contentType : false, processData : false, data : formData, // formData is $(‘#file’).prop(‘files’)[0]; type : ‘post’, success : function(response) {something} }); 我想与文件一起发送其他参数。 可能吗? 如果是 – 如何? 谢谢!

为什么Blueimp的jQuery-File-Upload插件没有激活回调?

我正在尝试使用Blueimp的jQuery-File-Upload插件,该插件根据演示看起来很有前途。 这很容易实现: var $uploadButton = $(“#fileop-upload”);// $uploadButton.fileupload({ url : “//domain/path/to/receive-uploaded-files” }); 所选文件上传正常,无需按预期刷新页面,但当然使用这样的最小配置,用户将不会收到任何通知。 这是插件的回调会派上用场的地方。 根据文档,有两种方法可以定义回调。 例如, add事件(只要选择上传文件就会触发)可以在原始配置对象中添加,如下所示: $uploadButton.fileupload({ add : addFileListener, url : “//domain/path/to/receive-uploaded-files” }); 或者: $uploadButton.bind(“fileuploadadd”, addFileListener); 但是我发现只有第一种方法有效,第二种方法没有做任何事情。 更令人好奇的是,没有其他回调 – 特别是progress和start – 似乎无论我如何绑定它们都会解雇: $uploadButton.fileupload({ add : addFileListener, progress : progressListener, start : startListener, url : “//domain/path/to/receive-uploaded-files” }); 要么 $uploadButton.fileupload({ add : addFileListener, url : “//domain/path/to/receive-uploaded-files” […]

使用Rails和jQuery文件上载将Content-Type直接设置为S3上载

我在这个主题上看到过很多问题,但是我遇到过的任何问题都没有对我有用,所以我在这里张贴另一个…… 我正在使用Ruby on Rails尝试使用jQuery File Upload插件直接配置文件上传到Amazon S3。 我跟着非常有用的Heroku教程来完成初始设置。 文件上传很好,但在S3中它们都被标记为Content-Type: binary/octet-stream ,所以当它们在应用程序中提供时,所有文件都会下载而不是直接打开。 这是一个问题,因为我试图允许图像,PDF,音频或video文件,所以我需要能够从文件中获取正确的Content-Type并将其传递给S3。 在查看亚马逊上的AWS-SDK gem文档时,我看到了本节有关将.where(:content_type).starts_with(“”)到预先签名的post对象末尾以修改策略的内容。 但是,当我这样做时,它引发了一个错误: AccessDenied Invalid according to Policy: Policy Condition failed: [“starts-with”, “$Content-Type”, “”] 所以我将content_type: “”添加到预先签名的post对象的opts哈希中,现在它再次工作,但是所有文件默认为binary/octet-stream它们都默认为image/jpeg 。 这是我现在的代码: 调节器 def new @s3_direct_post = S3_BUCKET.presigned_post( key: “uploads/#{SecureRandom.uuid}/${filename}”, success_action_status: 201, acl: :public_read, content_type: “”).where(:content_type).starts_with(“”) end _form.html.haml :javascript $(function() { $(‘.directUpload’).find(“input:file”).each(function(i, elem) { var fileInput = […]

Jquery文件上传插件:如何在添加时validation文件?

$(‘#fileupload’) .fileupload({ acceptFileTypes: /(\.|\/)(jpg)$/i }) .on(‘fileuploadadd’, function (e, data) { console.log(data.files.valid); //undefined setTimeout(function () { console.log(data.files.valid); //true or false }, 500); }) ; 的jsfiddle 如何在没有超时的情况下获取属性data.files.valid布尔值?

jQuery fileupload – 获取上传文件的列表

我正在使用非常好的jquery插件blueimp / jQuery-File-Upload $(‘#fileupload’).fileupload({ autoUpload: true , filesContainer: ‘#attachments_presentation tbody’ , stop: function (e) { console.log(data); } }); 而且我无法做一些非常简单的事情:获取上传文件的列表 (在服务器上用他们的名字) 首先,我天真地虽然它将存储在文件输入,所以我可以得到列表 $(‘#fileupload’).val(); 但事实并非如此,所以我对此感到满意 $(‘#fileupload’).fileupload(‘getfiles’); 我无法从文档中找到方法 有人能告诉我如何在服务器中获取上传文件名列表吗? 更新 我想在服务器上获取上传的文件名,以便以后能够管理它们。 例如: 我上传了一个名为trutruc.pdf的文件 我上传test.png 我重新上传了一个名为trutruc.pdf的文件 我删除了第一个文件 然后,服务器中的当前文件列表应为test.png , trutruc (2).pdf 更新2 我正在使用fileUpload 附带的默认php脚本

显示多文件上载Jquery / Ajax的进度

我有上传表单,允许用户上传多个文件。 我决定如果文件非常大,进度条会很好。 以下是我的源代码。 我是新手jquery通常我只是php但我发现ajax更加用户友好。 Upload an image or video function OnProgress(event, position, total, percentComplete){ //Progress bar console.log(total); $(‘#pb’).width(percentComplete + ‘%’) //update progressbar percent complete $(‘#pt’).html(percentComplete + ‘%’); //update status text } function beforeSubmit(){ console.log(‘ajax start’); } function afterSuccess(data){ console.log(data); } $(document).ready(function(e) { $(‘#upload_file’).submit(function(event){ event.preventDefault(); var filedata = document.getElementById(“file”); formdata = new FormData(); var i = […]

限制文件类型,大小,单个上载在jquery文件上传时不起作用

我正在尝试使用带有Spring MVC的blueimp jquery文件上传插件来上传excel文件。文件正在上传。 我想将文件类型限制为excel(xls,xlxs),也只允许单个文件上传。 我正在使用插件推荐的参数,也尝试添加add: callback来执行validation,它都不起作用。 请帮忙。 我正在使用的js文件(按相同顺序) jquery.min.js jquery.ui.widget.js jquery.iframe-transport.js jquery.fileupload.js bootstrap.min.js 我的HTML代码是 Select files… File Name File Size File Type Download javascript代码是: $(function() { ‘use strict’; // the location of your server-side upload handler: var url = ”; $(‘#fileupload’) .fileupload( { //this doesnt work add : function(e, data) { var uploadErrors = []; […]