none
Uploading image file using REST and JavaScript overwrite true not working RRS feed

  • Question

  • hello,

    i am using REST and JavaScript to Upload files to document library. i set overwrite property true in REST URL, but overwrite is not working for image files only.

    Monday, November 17, 2014 7:38 AM

Answers

  • http://webcache.googleusercontent.com/search?q=cache:x69Ew46HaQMJ:anthony-verschraegen.blogspot.com/2013/12/sharepoint-2013-js-upload-file-to.html+&cd=2&hl=en&ct=clnk&gl=in

    and 

    http://stackoverflow.com/questions/24412432/sharepoint-online-rest-image-upload-via-javascript-ajax

    I tried the following articles and it work:

    How to: Upload a file by using the REST API and jQuery

    For simple, here is how I implemented:

    var fileInput = jQuery('#getFile');
    var file = fileInput[0].files[0];
    var serverRelativeUrlToFolder = '*****'; //if the library in subsite, You have to remove the forward slash "/" before the document library relative url. 
    proccessUploadUsingJQueryAjax(file, serverRelativeUrlToFolder);
    
    function getFileBuffer(file) {
         var deferred = jQuery.Deferred();
         var reader = new FileReader();
         reader.onloadend = function (e) {
              deferred.resolve(e.target.result);
         }
         reader.onerror = function (e) {
              deferred.reject(e.target.error);
         }
         reader.readAsArrayBuffer(file);
         return deferred.promise();
    }
    function addFileToFolderUsingJQueryAjax(fileName, arrayBuffer, serverRelativeUrlToFolder) {
           // Construct the endpoint.
            var fileCollectionEndpoint = String.format(
                    "{0}/_api/web/GetFolderByServerRelativeUrl('{1}')/files/add(overwrite=true, url='{2}')",
                    _spPageContextInfo.webAbsoluteUrl, serverRelativeUrlToFolder, fileName);
    
            // Send the request and return the response.
            // This call returns the SharePoint file.
            return jQuery.ajax({
                url: fileCollectionEndpoint,
                type: "POST",
                data: arrayBuffer,
                processData: false,
                contentType: "application/json;odata=verbose",
                headers: {
                    "accept": "application/json;odata=verbose",
                    "X-RequestDigest": jQuery("#__REQUESTDIGEST").val()
                }
            });
        }
    function proccessUploadUsingJQueryAjax(file, serverRelativeUrlToFolder){
         var getFile = getFileBuffer(file);
         getFile.done(function (arrayBuffer) {
         // Add the file to the SharePoint folder.
                var addFile = addFileToFolderUsingJQueryAjax("image.jpg", arrayBuffer, serverRelativeUrlToFolder);
                addFile.done(function (file, status, xhr) {
                    alert("File Uploaded");
                });
                addFile.fail(function (error) { alert("Error Add File: " + error.responseText); });
            });
         getFile.fail(function (error) { alert("Error Get File: " + error.responseText); });
    }

    If this helped you resolve your issue, please mark it Answered. You can reach me through http://itfreesupport.com/

    Monday, November 17, 2014 8:04 AM
    Moderator
  • Hi,

    The following materials would be helpful:

    Uploading Files Using the REST API and Client Side Techniques

    http://blogs.msdn.com/b/uksharepoint/archive/2013/04/20/uploading-files-using-the-rest-api-and-client-side-techniques.aspx

    Upload image or create image in Sharepoint 2013 document library using rest api (Javascript)

    http://www.faqoverflow.com/sharepoint/54218.html

    How to: Upload a file by using the REST API and jQuery

    http://msdn.microsoft.com/en-us/library/office/dn769086(v=office.15).aspx

    Best Regards


    Dennis Guo
    TechNet Community Support

    Wednesday, November 19, 2014 8:00 AM
    Moderator

All replies

  • http://webcache.googleusercontent.com/search?q=cache:x69Ew46HaQMJ:anthony-verschraegen.blogspot.com/2013/12/sharepoint-2013-js-upload-file-to.html+&cd=2&hl=en&ct=clnk&gl=in

    and 

    http://stackoverflow.com/questions/24412432/sharepoint-online-rest-image-upload-via-javascript-ajax

    I tried the following articles and it work:

    How to: Upload a file by using the REST API and jQuery

    For simple, here is how I implemented:

    var fileInput = jQuery('#getFile');
    var file = fileInput[0].files[0];
    var serverRelativeUrlToFolder = '*****'; //if the library in subsite, You have to remove the forward slash "/" before the document library relative url. 
    proccessUploadUsingJQueryAjax(file, serverRelativeUrlToFolder);
    
    function getFileBuffer(file) {
         var deferred = jQuery.Deferred();
         var reader = new FileReader();
         reader.onloadend = function (e) {
              deferred.resolve(e.target.result);
         }
         reader.onerror = function (e) {
              deferred.reject(e.target.error);
         }
         reader.readAsArrayBuffer(file);
         return deferred.promise();
    }
    function addFileToFolderUsingJQueryAjax(fileName, arrayBuffer, serverRelativeUrlToFolder) {
           // Construct the endpoint.
            var fileCollectionEndpoint = String.format(
                    "{0}/_api/web/GetFolderByServerRelativeUrl('{1}')/files/add(overwrite=true, url='{2}')",
                    _spPageContextInfo.webAbsoluteUrl, serverRelativeUrlToFolder, fileName);
    
            // Send the request and return the response.
            // This call returns the SharePoint file.
            return jQuery.ajax({
                url: fileCollectionEndpoint,
                type: "POST",
                data: arrayBuffer,
                processData: false,
                contentType: "application/json;odata=verbose",
                headers: {
                    "accept": "application/json;odata=verbose",
                    "X-RequestDigest": jQuery("#__REQUESTDIGEST").val()
                }
            });
        }
    function proccessUploadUsingJQueryAjax(file, serverRelativeUrlToFolder){
         var getFile = getFileBuffer(file);
         getFile.done(function (arrayBuffer) {
         // Add the file to the SharePoint folder.
                var addFile = addFileToFolderUsingJQueryAjax("image.jpg", arrayBuffer, serverRelativeUrlToFolder);
                addFile.done(function (file, status, xhr) {
                    alert("File Uploaded");
                });
                addFile.fail(function (error) { alert("Error Add File: " + error.responseText); });
            });
         getFile.fail(function (error) { alert("Error Get File: " + error.responseText); });
    }

    If this helped you resolve your issue, please mark it Answered. You can reach me through http://itfreesupport.com/

    Monday, November 17, 2014 8:04 AM
    Moderator
  • Hi,

    The following materials would be helpful:

    Uploading Files Using the REST API and Client Side Techniques

    http://blogs.msdn.com/b/uksharepoint/archive/2013/04/20/uploading-files-using-the-rest-api-and-client-side-techniques.aspx

    Upload image or create image in Sharepoint 2013 document library using rest api (Javascript)

    http://www.faqoverflow.com/sharepoint/54218.html

    How to: Upload a file by using the REST API and jQuery

    http://msdn.microsoft.com/en-us/library/office/dn769086(v=office.15).aspx

    Best Regards


    Dennis Guo
    TechNet Community Support

    Wednesday, November 19, 2014 8:00 AM
    Moderator