{"id":576,"date":"2013-06-25T11:00:12","date_gmt":"2013-06-25T10:00:12","guid":{"rendered":"http:\/\/blogs.encamina.com\/desarrollandosobresharepoint\/?p=576"},"modified":"2013-07-16T10:05:44","modified_gmt":"2013-07-16T09:05:44","slug":"sharepoint-2013-subiendo-ficheros-usando-la-api-rest","status":"publish","type":"post","link":"https:\/\/blogs.encamina.com\/desarrollandosobresharepoint\/sharepoint-2013-subiendo-ficheros-usando-la-api-rest\/","title":{"rendered":"[SharePoint 2013] Subiendo ficheros usando la API REST mediante HTML5 y JavaScript"},"content":{"rendered":"

\"html5\"<\/a>Una de las grandes novedades que trae SharePoint 2013 es que esta basado en los est\u00e1ndares web: Oauth, Odata, HTML5, JavaScript, API REST,<\/strong> etc.. Lo cual va a tener dos consecuencias: mayor n\u00famero de desarrolladores sobre SharePoint y reciclaje de los desarrolladores \u00abtradicionales\u00bb para adaptarse a estos est\u00e1ndares.
\nEn este post vamos a ver c\u00f3mo podemos subir un fichero a una biblioteca de SharePoint utilizando HTML5 y JavaScript.
\n<\/p>\n

Acceso al Fichero<\/h3>\n

Hace unos d\u00edas tuve la necesidad de implementar la subida de un fichero a una biblioteca alojada en una App de SharePoint. Mi primer pensamiento est\u00e1 claro: c\u00f3mo podemos hacer uso de los ficheros que tenemos en nuestro PC utilizando JavaScript. Pero aqu\u00ed es donde me quedo con la boca abierta, y es que, haciendo uso de HTML5 se puede manejar de una forma muy f\u00e1cil los ficheros. Para ello hacemos uso de la API File incluida en HTML5 y si a\u00f1adimos estas lineas tenemos acceso al fichero:<\/p>\n

\r\nvar fileInput = $('#fileSelectorInput')[0];\r\nvar reader = new FileReader();\r\nreader.onload = function (result) {\r\n    var fileData = '';\r\n    var byteArray = new Uint8Array(result.target.result)\r\n    for (var i = 0; i < byteArray.byteLength; i++) {\r\n        fileData += String.fromCharCode(byteArray[i])\r\n    }\r\n};\r\nreader.readAsArrayBuffer(fileInput.files[0]);\r\n<\/pre>\n
Este c\u00f3digo obtiene la ruta que se ha introducido dentro de \u00abdiv\u00bb del HTML5 y lo transforma en un Array de Bytes. Esto solamente es una peque\u00f1a parte de lo que se puede hacer con los ficheros haciendo uso de la API File incluida en el est\u00e1ndar HTML5. Desde el t\u00edpico selector de ficheros, pasando por el Drag and drop (solar y arrastar) y terminando por una previsualizaci\u00f3n del fichero, son opciones que se pueden desarrollar de una manera muy simple. Si quer\u00e9is m\u00e1s informaci\u00f3n<\/a> pod\u00e9is echarle un ojo a este link<\/a>.<\/p>\n
Llamada API REST<\/h3>\n
Una vez ya sabemos c\u00f3mo obtener el fichero, el siguiente paso que tenemos que hacer es hacer la llamada API REST a SharePoint para almacenar este fichero. Para ello, en primer lugar tenemos que construir la URL que tiene una estructura como la siguiente:<\/p>\n
\r\n var url = appWebUrl + "\/_api\/SP.AppContextSite(@TargetSite)\/web\/lists\/getByTitle(@TargetLibrary)\/RootFolder\/folders(@TargetFolderName)\/files\/add(url=@TargetFileName,overwrite='true')?" +\r\n           "@TargetSite='" + targetSiteUrl + "'" +\r\n           "&@TargetLibrary='" + libraryName + "'" +\r\n           "&@TargetFolderName='" + folderName + "'" +\r\n           "&@TargetFileName='" + fileName + "'";\r\n<\/pre>\n
Donde los parametos que se le pasan son :<\/p>\n