当我通过Web Worker上传时,如何在
PHP中检索$_FILES?当我尝试使用FormData时,出现以下错误:
Error: FormData is not defined
这是我的代码:
function uploadFile(blobFile,fileName,filePart,totalChunks) { //if I try to put this //var formData = new FormData(); //it does not work var xhr = new XMLHttpRequest(); xhr.open("POST","upload.PHP"+"?"+"file="+fileName + filePart,true); xhr.onload = function(e) {}; xhr.send(blobFile); }
所以在upload.PHP中,我应该如何从$_FILES获取tmp路径?为了以防万一,我还将显示引用Web worker的页面:
<form id="fileuploader" enctype="multipart/form-data" method="post" action="upload.PHP"> <label for="fileToUpload">Select Files to Upload</label><br /> <input type="file" name="fileToUpload[]" multiple="" id="fileToUpload" onchange="fileList();"/><br /> <input type="button" onclick="sendRequest();" value="Upload" /> <!-- a place for File Listing --> <div id="fileList"></div> </form> <script type="text/javascript"> function sendRequest() { var worker = new Worker("fileupload.js"); worker.onmessage = function(e) { alert(e.data); } var file = document.getElementById('fileToUpload'); for(var i = 0; i < file.files.length; i++) { worker.postMessage(file.files[i]); } }
我编写了以下polyfill来模拟Web Workers中的FormData方法.由于Web worker不支持DOM,因此新的FormData(< HTMLFormElement>);也不支持构造函数调用.
但是,polyfill支持文件和Blob对象,类型化数组和字符串.
原文链接:https://www.f2er.com/php/137560.html但是,polyfill支持文件和Blob对象,类型化数组和字符串.
它最初是作为Upload a File in a Google Chrome Extension的答案的一部分发布的.要查看如何使用它的示例,请查看其他答案.
/* * FormData for XMLHttpRequest 2 - Polyfill for Web Worker (c) 2012 Rob W * License: Creative Commons BY - http://creativecommons.org/licenses/by/3.0/ * - append(name,value[,filename]) * - toString: Returns an ArrayBuffer object * * Specification: http://www.w3.org/TR/XMLHttpRequest/#formdata * http://www.w3.org/TR/XMLHttpRequest/#the-send-method * The .append() implementation also accepts Uint8Array and ArrayBuffer objects * Web Workers do not natively support FormData: * http://dev.w3.org/html5/workers/#apis-available-to-workers **/ (function() { // Export variable to the global scope (this == undefined ? self : this)['FormData'] = FormData; var ___send$rw = XMLHttpRequest.prototype.send; XMLHttpRequest.prototype['send'] = function(data) { if (data instanceof FormData) { if (!data.__endedMultipart) data.__append('--' + data.boundary + '--\r\n'); data.__endedMultipart = true; this.setRequestHeader('Content-Type','multipart/form-data; boundary=' + data.boundary); data = new Uint8Array(data.data).buffer; } // Invoke original XHR.send return ___send$rw.call(this,data); }; function FormData() { // Force a Constructor if (!(this instanceof FormData)) return new FormData(); // Generate a random boundary - This must be unique with respect to the form's contents. this.boundary = '------RWWorkerFormDataBoundary' + Math.random().toString(36); var internal_data = this.data = []; /** * Internal method. * @param inp String | ArrayBuffer | Uint8Array Input */ this.__append = function(inp) { var i=0,len; if (typeof inp === 'string') { for (len=inp.length; i<len; i++) internal_data.push(inp.charCodeAt(i) & 0xff); } else if (inp && inp.byteLength) {/*If ArrayBuffer or typed array */ if (!('byteOffset' in inp)) /* If ArrayBuffer,wrap in view */ inp = new Uint8Array(inp); for (len=inp.byteLength; i<len; i++) internal_data.push(inp[i] & 0xff); } }; } /** * @param name String Key name * @param value String|Blob|File|Uint8Array|ArrayBuffer Value * @param filename String Optional File name (when value is not a string). **/ FormData.prototype['append'] = function(name,value,filename) { if (this.__endedMultipart) { // Truncate the closing boundary this.data.length -= this.boundary.length + 6; this.__endedMultipart = false; } var valueType = Object.prototype.toString.call(value),part = '--' + this.boundary + '\r\n' + 'Content-Disposition: form-data; name="' + name + '"'; if (/^\[object (?:Blob|File)(?:Constructor)?\]$/.test(valueType)) { return this.append(name,new Uint8Array(new FileReaderSync().readAsArrayBuffer(value)),filename || value.name); } else if (/^\[object (?:Uint8Array|ArrayBuffer)(?:Constructor)?\]$/.test(valueType)) { part += '; filename="'+ (filename || 'blob').replace(/"/g,'%22') +'"\r\n'; part += 'Content-Type: application/octet-stream\r\n\r\n'; this.__append(part); this.__append(value); part = '\r\n'; } else { part += '\r\n\r\n' + value + '\r\n'; } this.__append(part); }; })();