How to add an attachment functionality in a service portal page?

[joanmarisse]

I have this page to record data and I want to add an attachment functionality where users can add attachment in service portal.

Do you have an idea how to do it?

Please advise.

Thanks!

[Rolf Nyhus]

I don't have a problem with the fact I need to pass authentication with the rest call, this is just how SN works. Rather the issue is after submitting the call with an attachment, I return the user to the portal home page and this is where it retains the rest user info. I can instead redirect to the logout page or use the lockout function of glidesession, but then the user submitting the call gets thrown to the logout page instead of the portal home page, and has to manually navigate back to the portal home page. Not very user friendly.

I was hoping there was a way to drop the authentication "session" after having submitted the call without having to force a full logout. I tried setting a timestamp on the "Invalidated" column of the sys_user_session table for the rest user after submission of the call, but it did not terminate it's session.

[Hyma Oruganti]

Hi Rolf!

I am also having the same issue that you had with the sessions. Did you find a solutions for this one?

Thanks 

-Hyma

[Rolf Nyhus]

Hi Hyma,

I didn't find a way to fix it, so we had to try yet another route and ended up with using FileReader

I've tried to copy out the relevant code, so be advised that I might not have captured all that is required.

HTML:

<input type="file" accept=".xls,.xlsx,.doc,.docx,.pdf,.png,.jpg,.jpeg,.gif,.tif,.ppt,.pptx,.bmp,.svg,.txt" ng-show="false" id="fileToUpload" multiple onchange="angular.element(this).scope().setFiles(this)"/>

Client Script:

c.uploadFile = function($event) {
$event.stopPropagation();
var $el = $element.find('input[type=file]');
$el.click();
};

// CODE FOR fileupload
$scope.files = [];
if (!c.data.nsf_files) {
c.data.nsf_files = [];
}

$scope.setFiles = function(element) {
// Turn the FileList object into an Array
for (var i = 0; i < element.files.length; i++) {
$scope.files.push(element.files[i]);
var filereader = new FileReader();
filereader.readAsDataURL(element.files[i]);
filereader.file = element.files[i];
filereader.onloadend = function(e) {
var file = this.file;
var filename = this.file.name;
var base64 = filereader.result;
var base64Arr = base64.split(',');
var fileObj = {
filename: filename,
filetype: base64Arr[0].split(':')[1].split(';')[0],
file: base64Arr[1]
};
c.data.nsf_files.push(fileObj);
};
}
$scope.$apply();
};

$scope.removeFiles = function(fname) {
var index = $scope.files.indexOf(fname);
if(index>-1)
$scope.files.splice(index,1);
};

Server script:

if(!input){
data.nsf_files = [];
return;
}

if(input){

//Attach files to ticket
input.nsf_files.forEach(function(file){
var StringUtil = new GlideStringUtil();
var attachment = new Attachment();
var wr = attachment.write(ticketType, ticket.sys_id, file.filename, '', StringUtil.base64DecodeAsBytes(file.file));
});

}

NOTE! A word of caution. It seems that using this method, you have some limitations concerning file size. In our testing, we found that anything under 5MB will work OK, but if you go above this limit, it will take forever.

Rolf

[Hyma Oruganti]

Thanks Rolf!

We also came up with the same solution. It was hard to find from the documentation that there is an Attachment class that can be initialized like this 

var attachment = new Attachment();

[rita_m]

I'm unable to get this to work from a non-logged in user!  Everything works great when logged in, but when not logged in the attachment isn't added.

Who is your public widget's server side script running as?  

Ours is running as the guest user, so I suspect it's a permission issue.

Did you have this issue? Any advice?

EDIT: Never mind!  The issue was the permissions required for the incident table.  I created a staging table that was publicly writable just for attachments, added a field for the incident number, and a workflow to copy all attachments added there to the related incident, and it worked great!