File attachment is not opening-Not Allowed Error - javascript

This is my first attempt to prepare a dynamic pdf form in livecycle designer es4. In this form, there is an option to add and view attachment. As I have little experience in javascript coding, I went to the adobe forum and found a very good example here. I have done some changes in original code to run in my form. I can attach file successfully with this code. But my problem is that when I want to open file attachment in Acrobat Pro XI, it is showing below error instead of opening the file. This error is showing independent of file attachment type (e.g. .doc, .jpg, .txt and .pdf file).error image. Here is screenshot of security of Acrobat Pro XIscreenshot 1 screenshot 2 and file linkhere.
Below code is written in the form-
//Code for add button
// Get Import Name
var cName = AttachName.rawValue;
// Test for empty value
if(!/^\s*$/.test(cName))
{// Do Import
try{
var bRtn = event.target.importDataObject(cName);
if(bRtn)
{
var cDesc = AttachDesc.rawValue;
if(!/^\s*$/.test(cName))
{
var oAtt = event.target.getDataObject(cName);
oAtt.description = cDesc;
}
app.alert("File Attachment Successfully Imported",3);
}
else
app.alert("Unable to import File Attachment",0);
}catch(e){
app.alert("An Error Occured while Importing the File Attachment:\n\n" + e);
}
}
else
app.alert("Attachment name must be non-empty");
//code for populating dropdown list
this.rawValue = null;
this.clearItems();
var a = event.target.dataObjects;
if (a !== null) {
for (var i = 0; i < a.length; i++) {
this.addItem(a[i].name);
}
}
//code for open attachment button
var cName = AttachNameSel.rawValue;
//var nAction = ExportAction.rawValue;
try{
event.target.exportDataObject({cName:cName, nLaunch:2});
} catch(e) {
app.alert("An Error Occured while Exporting the File Attachment: " + cName + "\n\n" + e);
}
Any help from anyone in the community would be greatly appreciated.
Thanks
Tony

Related

Remove Google Form Submitted File

WORKING CODE HERE: https://jsfiddle.net/nateomardavis/e0317gb6/
ORIGINAL QUESTION BELOW
How do I remove a form-submitted file from Drive itself?
I'm having trouble sorting out why a google form is submitting files to both my drive (not in a folder) but also into an auto-generated submission folder.
I've been able to move the renamed file to a new folder and delete the copy in the auto-generated submission folder. I cannot figure out how to remove the copy that's just listed in "Drive", not in any folder.
THE PROCESS (EDIT)
Let me try to explain the process more. I have a form that collects files. Google automatically makes a folder and sub-folders. I have successfully renamed the submitted files, moved them to a new folder, and deleted them from the Google-generated folder. However, a copy of the original, unchanged file is going to Google Drive, the root folder. Steps 1-3 (below) work as expected. Step 4 is where I'm running into issues.
The original file being uploaded to a form. Note the file name.
The Google-generated folder. The file is submitted this folder.
The renamed file in a new folder. The original file is deleted from the folder above.
The original file is now showing up in Drive, not in a folder but there. The name of this file is the same as the originally uploaded one. The one which went to the "passes" folder and was then deleted from that folder.
SNIPPET
//RENAME PASSES
if (itemResponses[f].getItem().getTitle() == "PASSES") {
var files = itemResponses[f].getResponse();
//Logger.log(files.length);
if (files.length > 0) {
for (var n in files) {
var dFile = DriveApp.getFileById(files[n]);
dFile.setName("LSS - " + year + " - " + teamName + " - " + "PASSES - " + today );
teamFolder.addFile(dFile); //MOVE SUBMITTED DOCUMENTS TO THAT FOLDER
passesFolder.removeFile(dFile); //REMOVE FROM SUBMISSION FOLDER
DriveApp.getRootFolder().removeFile(dFile) // (DOES NOT WORK) REMOVE FROM DRIVE FOLDER
DriveApp.removeFile(dFile) // (DOES NOT WORK) REMOVE FROM DRIVE FOLDER
}
}
FULL CODE
function getLastResponse() {
var form = FormApp.openById('ID');
var today = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), "MM/dd/yyyy hh:mm a");
var year = Utilities.formatDate(new Date(), Session.getScriptTimeZone(), "YYYY");
Logger.log(today);
var formResponses = form.getResponses();
//Logger.log(formResponses.length);
var formResponse = formResponses[formResponses.length-1];
var respondentEmail = formResponse.getRespondentEmail()
var itemResponses = formResponse.getItemResponses();
Logger.log(itemResponses.length);
var teamName = itemResponses[2].getResponse();
//Logger.log("team name: " + teamName);
//CHECK FOLDERS
var dropbox = "Lititz Summer Showcase Team Check In (File responses)";
var folder, folders = DriveApp.getFoldersByName(dropbox);
var teamBox = teamName;
var teamFolder, teamFolders = DriveApp.getFoldersByName(teamBox);
var passesFolder = DriveApp.getFolderById('ID');
var rosterFolder = DriveApp.getFolderById('ID');
var teamInfoFolder = DriveApp.getFolderById('ID');
var permissionToTravelFolder = DriveApp.getFolderById('ID');
if (folders.hasNext()) { //CHECK IF DRIVE HAS FOLDER FOR FORM
folder = folders.next();
} else { //IF NOT CREATE FOLDER
folder = DriveApp.createFolder(dropbox);
}
if (teamFolders.hasNext()) { //CHECK IF FOLDER FOR TEAM EXISTS
teamFolder = teamFolders.next();
} else { //IF NOT CREATE FOLDER
teamFolder = folder.createFolder(teamBox);
teamFolder.setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.COMMENT);
}
for (var f = 0; f < itemResponses.length; f++) {
Logger.log(itemResponses[f].getItem().getType());
Logger.log(itemResponses[f].getItem().getTitle());
if (itemResponses[f].getItem().getType() == "FILE_UPLOAD") {
Logger.log("THERE IS A FILE UPLOAD");
//RENAME PASSES
if (itemResponses[f].getItem().getTitle() == "PASSES") {
var files = itemResponses[f].getResponse();
//Logger.log(files.length);
if (files.length > 0) {
for (var n in files) {
var dFile = DriveApp.getFileById(files[n]);
dFile.setName("LSS - " + year + " - " + teamName + " - " + "PASSES - " + today );
teamFolder.addFile(dFile); //MOVE SUBMITTED DOCUMENTS TO THAT FOLDER
passesFolder.removeFile(dFile); //REMOVE FROM SUBMISSION FOLDER
DriveApp.removeFile(dFile); // REMOVE FROM DRIVE FOLDER
}
}
//RENAME ROSTER
} else if (itemResponses[f].getItem().getTitle() == "ROSTER") {
var files = itemResponses[f].getResponse();
//Logger.log(files.length);
if (files.length > 0) {
for (var n in files) {
var dFile = DriveApp.getFileById(files[n]);
dFile.setName("LSS - " + year + " - " + teamName + " - " + "ROSTER - " + today );
teamFolder.addFile(dFile);
}
}
//RENAME TEAM INFO SHEET
} else if (itemResponses[f].getItem().getTitle() == "TEAM INFO SHEET") {
var files = itemResponses[f].getResponse();
//Logger.log(files.length);
if (files.length > 0) {
for (var n in files) {
var dFile = DriveApp.getFileById(files[n]);
dFile.setName("LSS - " + year + " - " + teamName + " - " + "TEAM INFO SHEET - " + today );
teamFolder.addFile(dFile);
}
}
//RENAME PERMISSION TO TRAVEL
} else if (itemResponses[f].getItem().getTitle() == "PERMISSION TO TRAVEL") {
var files = itemResponses[f].getResponse();
//Logger.log(files.length);
if (files.length > 0) {
for (var n in files) {
var dFile = DriveApp.getFileById(files[n]);
Logger.log(ownerEmail);
dFile.setName("LSS - " + year + " - " + teamName + " - " + "PERMISSION TO TRAVEL - " + today );
teamFolder.addFile(dFile);
}
}
}
}//END 'IF FILE UPLOAD'
}//END FOR LOOP
}//END FUNCTION
How about this answer?
Issue:
The flow of upload from Google Form is as follows.
When the file is uploaded in the Form, the file is created to root folder.
When the form is submitted, the file in the root folder is copied by renaming the filename to the folder created by the form.
In above case, the file in root folder is different from the file in the folder created by Google Form. By this, DriveApp.getRootFolder().removeFile(dFile) in your "SNIPPET" didn't work. This is the reason of your issue of script.
Workaround:
You want to delete the file remained in the root folder.
In order to delete the file created in the root folder, how about this workaround?
Unfortunately, the original filename cannot be retrieved from the form response. But the file which was copied to the folder created by the form has the filename of the format like {original filename} - ####.{extension}. In this workaround, the original filename is retrieved from this filename, and move the file to the trash using the retrieved original filename.
Sample script:
This sample script is run by the installable form submit trigger. So when the form was submitted, the script is run and the uploaded file is moved to the destination folder and the original file in the root folder is moved to the trash.
Before run the script:
In this sample script, it supposes that the script is the container-bound script of Google Form. Please be careful this.
After cope and paste the script to the script editor, please set the destination folder ID to the script.
please install the installable form submit trigger. If the trigger has already been installed, please remove it and install again.
Please upload and submit a file using Google Form. By this, the script is run.
Script:
function formsubmit(e) {
var destFolderId = "###"; // Destination folder ID
if (e) {
Utilities.sleep(3000); // This is required.
var destfolder = DriveApp.getFolderById(destFolderId);
var items = e.response.getItemResponses();
for (var i = 0; i < items.length; i++) {
if (items[i].getItem().getType() == "FILE_UPLOAD") {
var files = items[i].getResponse();
for (var j = 0; j < files.length; j++) {
var file = DriveApp.getFileById(files[j]);
var filename = file.getName();
// Move uploaded file to the destination folder.
var uploadedFile = DriveApp.getFileById(files[j]);
var sourcefolder = uploadedFile.getParents().next();
destfolder.addFile(file);
sourcefolder.removeFile(file);
// Retrieve original filename.
var p1 = filename.split(" - ");
var extension = p1[p1.length - 1];
p1.pop();
var name = p1.join(" - ");
var p2 = "";
if (extension.indexOf(".") > -1) {
p2 = "." + extension.split(".")[1];
}
var orgFilename = name + p2;
// Move uploaded file to the trash.
var orgFiles = DriveApp.getRootFolder().getFilesByName(orgFilename);
if (orgFiles.hasNext()) {
var orgFile = orgFiles.next();
orgFile.setTrashed(true);
}
}
}
}
} else {
throw new Error("This sample script is run by the installable form submit trigger.");
}
}
Note:
This is a simple sample script for explaining this workaround. So please modify this for your situation.
In my environment, it was found Utilities.sleep(3000) was required. When the file is uploaded and the file is copied, the installable form submit trigger is run. At this time, if Utilities.sleep(3000) is not used, the file is moved before copying file is completed. By this, an error occurs. So I used it.
But I'm not sure whether the wait time of 3 seconds is the best. So if in your environment, an error occurs, please modify this.
I think that when a large file is uploaded, this value might be required to be large. Or also I think that running the script by the time-driven trigger might be better.
In this sample script, I used the installable form submit trigger. And when the form is submitted, the original file in the root folder is moved to the trash.
But I think that you can also run the script by the time-driven trigger. In this case, you can retrieve the response items by opening the form. About this, please select for your situation.
References:
Installable Triggers
setTrashed(trashed)
sleep(milliseconds)

Saving a file in a UWP web context

I recently developed a universal application for Windows 10 with UWP web context (so JavaScript and HTML) and I would like to save a text file. It works well on a browser (Chrome, Firefox, Edge,...) but not in the application.
Can someone help me? :)
Thank you in advance!
Here is the code responsible for saving the text file.
function saveTextAsFile(fileName) {
var source = input.value.replace(/\n/g, "\r\n");
var fileUrl = window.URL.createObjectURL(new Blob([source], {type:"text/plain"}));
var downloadLink = createDownloadLink(fileUrl, fileName);
document.body.appendChild(downloadLink);
downloadLink.click();
document.body.removeChild(downloadLink);}
To download a file using a Progressive Web App as a Universal Windows Platform you can use the Windows global object with the FileSavePicker. Note that you can check to see if it exists using if (window['Windows'] != null) { ... }
// Create the picker object and set options
var savePicker = new Windows.Storage.Pickers.FileSavePicker();
savePicker.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.documentsLibrary;
// Dropdown of file types the user can save the file as
savePicker.fileTypeChoices.insert("Plain Text", [".txt"]);
// Default file name if the user does not type one in or select a file to replace
savePicker.suggestedFileName = "New Document";
savePicker.pickSaveFileAsync().then(function (file) {
if (file) {
// Prevent updates to the remote version of the file until we finish making changes and call CompleteUpdatesAsync.
Windows.Storage.CachedFileManager.deferUpdates(file);
// write to file
Windows.Storage.FileIO.writeTextAsync(file, fileContents).done(function () {
// Let Windows know that we're finished changing the file so the other app can update the remote version of the file.
// Completing updates may require Windows to ask for user input.
Windows.Storage.CachedFileManager.completeUpdatesAsync(file).done(function (updateStatus) {
if (updateStatus === Windows.Storage.Provider.FileUpdateStatus.complete) {
WinJS.log && WinJS.log("File " + file.name + " was saved.", "sample", "status");
} else {
WinJS.log && WinJS.log("File " + file.name + " couldn't be saved.", "sample", "status");
}
});
});
} else {
WinJS.log && WinJS.log("Operation cancelled.", "sample", "status");
}
});
This assumes you are downloading a text file. To download a Uint8Array use the WriteBytesAsync function on FileIO instead. Note that many of the functions on FileIO are available in JavaScript even though they are not documented for JavaScript.
Check out the FileSavePicker Class documentation for more information.

WebRTC issue with File transfer in production application

Hello I am developing a WebRTC based file transfer application.I have deployed the application online using Heroku. But there seems to be a problem with file transfer specifically at the the receiving end which I have been unable to figure out. The file is transferred and received successfully when done on localhost but there is a problem with file reception when done in production. The browser used is Google Chrome if that's any help.
Here is the File reception code:
function dataChannelStateChanged() {
if (dataChannel.readyState === 'open') {
console.log("Data Channel open");
dataChannel.onmessage = receiveDataChannelMessage;
}
}
function receiveDataChannel(event) {
console.log("Receiving a data channel");
dataChannel = event.channel;
dataChannel.onmessage = receiveDataChannelMessage;
}
function receiveDataChannelMessage(event) {
console.log("From DataChannel: " + event.data);
if (fileTransferring) {
//Now here is the file handling code:
fileBuffer.push(event.data);
fileSize += event.data.byteLength;
fileProgress.value = fileSize;
//Provide link to downloadable file when complete
if (fileSize === receivedFileSize) {
var received = new window.Blob(fileBuffer);
fileBuffer = [];
downloadLink.href = URL.createObjectURL(received);
downloadLink.download = receivedFileName;
downloadLink.appendChild(document.createTextNode(receivedFileName + "(" + fileSize + ") bytes"));
fileTransferring = false;
//Also put the file in the text chat area
var linkTag = document.createElement('a');
linkTag.href = URL.createObjectURL(received);
linkTag.download = receivedFileName;
linkTag.appendChild(document.createTextNode(receivedFileName));
var div = document.createElement('div');
div.className = 'message-out';
div.appendChild(linkTag);
messageHolder.appendChild(div);
}
}
else {
appendChatMessage(event.data, 'message-out');
}
}
The following image shows the problem i'm encountering when receiving the file:
Any guidance would be much appreciated.
WEBRTC is based on UDP, it means there is no guarantee that your sequence of data transfers "in order" or successfully
use "webSocket" or a simple "http request" instead.
=============
UPDATE: see the first comment

how do I remove an item that is set to upload?

I have created an uploader using javascript and php. The problem is that I only want to allow specific file types. I have it letting the user know the file is not valid but I am not sure how to remove the file from being uploaded. Can anyone tell me how to remove the upload?
multiUploader.prototype._preview = function(data) {
this.items = data;
if (this.items.length > 0) {
var html = "";
var uId = "";
for (var i = 0; i < this.items.length; i++) {
uId = this.items[i].name._unique();
if (typeof this.items[i] != undefined) {
if (self._validate(this.items[i].type) <= 0) {
var errorClass = '<h3 class="text-danger">Invalid file format' + this.items[i].name + '</h3>'
jQuery(".errorContent").append(errorClass);
jQuery.remove(this.items[i]);
}
html += '<div class="dfiles" rel="' + uId + '"><h5>' + this.items[i].name + '</h5><div id="' + uId + '" class="progress" style="display:none;"></div></div>';
}
}
jQuery("#dragAndDropFiles").append(html);
}
}
This is not all of the code, just the function that displays my error message and also shows the uploaded file on the page. I tried it with jQuery.remove but it does not work. Any ideas are appreciated
what is a "file type"? I could send you a .php file that ends in .jpg, would you accept that? (I hope not!). Let the user upload the files with a warning that files X, Y, Z are not going to be accepted based on extension mismatch. Then actually test their content to see if the files are truly what their extension claims, because -and this part is important- your javascript in no way guarantees that what you're going to get is what you wrote your scripts to allow. Changing your script in my browser is a matter of opening my devtools and rewriting your script, then hitting ctrl-s. Now my browser will be running my code, not your code, and happily upload my files anyway.
Always, always, server-verify the user data.

How to upload base64 image resource with dropzone?

I'm trying to upload generated client side documents (images for the moment) with Dropzone.js.
// .../init.js
var myDropzone = new Dropzone("form.dropzone", {
autoProcessQueue: true
});
Once the client have finished his job, he just have to click a save button which call the save function :
// .../save.js
function save(myDocument) {
var file = {
name: 'Test',
src: myDocument,
};
console.log(myDocument);
myDropzone.addFile(file);
}
The console.log() correctly return me the content of my document
data:image/png;base64,iVBORw0KGgoAAAANS...
At this point, we can see the progress bar uploading the document in the drop zone but the upload failed.
Here is my (standart dropzone) HTML form :
<form action="/upload" enctype="multipart/form-data" method="post" class="dropzone">
<div class="dz-default dz-message"><span>Drop files here to upload</span></div>
<div class="fallback">
<input name="file" type="file" />
</div>
</form>
I got a Symfony2 controller who receive the post request.
// Get request
$request = $this->get('request');
// Get files
$files = $request->files;
// Upload
$do = $service->upload($files);
Uploading from the dropzone (by drag and drop or click) is working and the uploads are successfull but using the myDropzone.addFile() function return me an empty object in my controller :
var_dump($files);
return
object(Symfony\Component\HttpFoundation\FileBag)#11 (1) {
["parameters":protected]=>
array(0) {
}
}
I think i don't setup correctly my var file in the save function.
I tryied to create JS image (var img = new Image() ...) but without any success.
Thanks for your help !
Finally i found a working solution without creating canvas :
function dataURItoBlob(dataURI) {
'use strict'
var byteString,
mimestring
if(dataURI.split(',')[0].indexOf('base64') !== -1 ) {
byteString = atob(dataURI.split(',')[1])
} else {
byteString = decodeURI(dataURI.split(',')[1])
}
mimestring = dataURI.split(',')[0].split(':')[1].split(';')[0]
var content = new Array();
for (var i = 0; i < byteString.length; i++) {
content[i] = byteString.charCodeAt(i)
}
return new Blob([new Uint8Array(content)], {type: mimestring});
}
And the save function :
function save(dataURI) {
var blob = dataURItoBlob(dataURI);
myDropzone.addFile(blob);
}
The file appears correctly in dropzone and is successfully uploaded.
I still have to work on the filename (my document is named "blob").
The dataURItoBlob function have been found here : Convert Data URI to File then append to FormData
[EDIT] : I finally wrote the function in dropzone to do this job. You can check it here : https://github.com/CasperArGh/dropzone
And you can use it like this :
var dataURI = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAmAAAAKwCAYAAA...';
myDropzone.addBlob(dataURI, 'test.png');
I can't comment currently and wanted to send this to you.
I know you found your answer, but I had some trouble using your Git code and reshaped it a little for my needs, but I am about 100% positive this will work for EVERY possible need to add a file or a blob or anything and be able to apply a name to it.
Dropzone.prototype.addFileName = function(file, name) {
file.name = name;
file.upload = {
progress: 0,
total: file.size,
bytesSent: 0
};
this.files.push(file);
file.status = Dropzone.ADDED;
this.emit("addedfile", file);
this._enqueueThumbnail(file);
return this.accept(file, (function(_this) {
return function(error) {
if (error) {
file.accepted = false;
_this._errorProcessing([file], error);
} else {
file.accepted = true;
if (_this.options.autoQueue) {
_this.enqueueFile(file);
}
}
return _this._updateMaxFilesReachedClass();
};
})(this));
};
If this is added to dropzone.js (I did just below the line with Dropzone.prototype.addFile = function(file) { potentially line 1110.
Works like a charm and used just the same as any other. myDropzone.addFileName(file,name)!
Hopefully someone finds this useful and doesn't need to recreate it!
1) You say that: "Once the client have finished his job, he just have to click a save button which call the save function:"
This implies that you set autoProcessQueue: false and intercept the button click, to execute the saveFile() function.
$("#submitButton").click(function(e) {
// let the event not bubble up
e.preventDefault();
e.stopPropagation();
// process the uploads
myDropzone.processQueue();
});
2) check form action
Check that your form action="/upload" is routed correctly to your SF controller & action.
3) Example Code
You may find a full example over at the official Wiki
4) Ok, thanks to your comments, i understood the question better:
"How can i save my base64 image resource with dropzone?"
You need to embedd the image content as value
// base64 data
var dataURL = canvas.toDataURL();
// insert the data into the form
document.getElementById('image').value = canvas.toDataURL('image/png');
//or jQ: $('#img').val(canvas.toDataURL("image/png"));
// trigger submit of the form
document.forms["form1"].submit();
You might run into trouble doing this and might need to set the "origin-clean" flag to "true". see http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#security-with-canvas-elements
how to save html5 canvas to server

Categories

Resources