mardi 3 mars 2015

SharePoint 2013 upload(and resize) image with REST api problem

I am trying to create an SP2013 APP, the user should be able to upload an image to a SharePoint list. The image needs to be resized before it is being uploaded. I got the upload function to upload the original image but when i am trying to upload the resized image the image is corrupt(broken).

I have been using AngularJS directive for this task:

Here is an image of my object: enter image description here

The first red marked "dataURL" is the original image dataURL and when i send it with REST to my list it works just fine, but as the original size. The second red marked "dataURL" is the resized object, it works fine to put the dataURL into a tag and it shows the correct resized image but when i try to send that dataURL with REST to my list the image is broken(corrupt). I know it has to do with the dataURL not being binary code, i have tried to convert it but no luck. How can i send the resized image to my sharepoint list?

Here is my Perform Upload function:

function PerformUpload(imageResult) {
console.log(imageResult); //The console.log result is seen in the uploaded picture above.
var url;
var libraryName = "ProfilePics";
var fileName =;
var folderName = "";
var fileData = imageResult.resized.dataURL;

// if there is no folder name then just upload to the root folder
if (folderName == "") {
url = appweburl + "/_api/SP.AppContextSite(@TargetSite)/web/lists/getByTitle(@TargetLibrary)/RootFolder/Files/add(url=@TargetFileName,overwrite='true')?" +
"@TargetSite='" + hostweburl + "'" +
"&@TargetLibrary='" + libraryName + "'" +
"&@TargetFileName='" + fileName + "'";
else {
// if there is a folder name then upload into this folder
url = appweburl + "/_api/SP.AppContextSite(@TargetSite)/web/lists/getByTitle(@TargetLibrary)/RootFolder/folders(@TargetFolderName)/files/add(url=@TargetFileName,overwrite='true')?" +
"@TargetSite='" + hostweburl + "'" +
"&@TargetLibrary='" + libraryName + "'" +
"&@TargetFolderName='" + folderName + "'" +
"&@TargetFileName='" + fileName + "'";

// use the request executor to perform the upload
var reqExecutor = new SP.RequestExecutor(appweburl);
url: url,
method: "POST",
headers: {
"Accept": "application/json; odata=verbose",
"X-RequestDigest": digest
contentType: "application/json;odata=verbose",
binaryStringRequestBody: true,
body: fileData,
success: function (x, y, z) {
error: function (x, y, z) {

0 commentaires:

Enregistrer un commentaire