I am importing a CSV file in my angular application using sheetjs, Data is imported successfully. but it is converting string with a date to only date ignoring the string.
Code in ts file
readExcel() {
let readFile = new FileReader();
readFile.onload = (e) => {
this.storeData = readFile.result;
var data = new Uint8Array(this.storeData);
var arr = new Array();
for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
var workbook = XLSX.read(bstr, { type: "binary" });
var first_sheet_name = workbook.SheetNames[0];
this.worksheet = workbook.Sheets[first_sheet_name];
let processJsonData: Array<any> = XLSX.utils.sheet_to_json(this.worksheet, { raw: false });
console.log(processJsonData)
}
}
How to get both string and date in the json response. Please suggest
Related
I'm having problems downloading a .docx file from server. I can correctly upload and download pdf files or txt files, but not docx files.
When uploading I do this in my onNativeInputFileSelect method:
if(event.target.value){
const file: File = event.target.files[0];
let fileToUpload = new MyFile();
let filenames = file.name.split('.');
fileToUpload.name= filenames[0];
fileToUpload.type = filenames[1];
this.changeFile(file).then((base64: string):any => {
fileToUpload.content= base64;
this.networkService.uploadFileDocumento(fileToUpload).subscribe(() => {
...
where changeFile is this method:
changeFile(file){
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
When I upload a pdf file, the base64string starts with
data:application/pdf;base64,JVBERi0xLjUKJb/3ov...
and when I upload the docx file the base64string starts with
data:application/octet-stream;base64,UEsDBB...
Then I try to download the files. I can correctly download the pdf file, but when I try to download the docx file I don't get the correct file type (the type of file is "File") and I can't open it as a document. When I get the file from the server I do this:
let splitted = file.content.split(',');
let type = splitted[0].substring(splitted[0].lastIndexOf(':') +1, splitted[0].lastIndexOf(';'));
let blob = this.b64toBlob(splitted[1], type);
let blobUrl = URL.createObjectURL(blob);
let doc = document.createElement("a");
doc.href = blobUrl;
doc.download = file.name;
doc.click();
Where b64toBlob is the following method:
b64toBlob(b64Data, contentType = '', sliceSize = 512) {
const byteCharacters = atob(b64Data);
const byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
const slice = byteCharacters.slice(offset, offset + sliceSize);
const byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
const blob = new Blob(byteArrays, { type: contentType });
return blob;
}
Why do I get application/octet-stream when uploading the file? And then I can't download id with the correct type? Where am I going wrong?
I am thinking if i can read the contents of an excel sheet using XLSX and display its contents on front-end.
I tried reading a file using
tmpArray= [];
reader.onload = function(e : any) {
var data = new Uint8Array(e.target.result);
var workbook = XLSX.read(data, {type: 'array'});
let worksheet = workbook.Sheets[workbook.SheetNames[0]];
// sample values //
let desired_cell = worksheet['B5'];
let cellB16 = worksheet['B16'];
// sample values //
let desired_value12 = (cellB16 ? cellB16.v : undefined);
tmpArray.push[desired_value12];
};
but outside this onload function, array of tmpArray don't exist anymore.
So what i wanted is to access the tmpArray and it's contents after the onload function. Is there any work around to do this?
Try this example on stackblitz
In your typescript file
import * as XLSX from 'xlsx';
onFileChange(evt: any) {
/* wire up file reader */
const target: DataTransfer = <DataTransfer>(evt.target);
if (target.files.length !== 1) throw new Error('Cannot use multiple files');
const reader: FileReader = new FileReader();
reader.onload = (e: any) => {
/* read workbook */
const bstr: string = e.target.result;
const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
/* grab first sheet */
const wsname: string = wb.SheetNames[0];
const ws: XLSX.WorkSheet = wb.Sheets[wsname];
/* save data */
this.data = <AOA>(XLSX.utils.sheet_to_json(ws, { header: 1 }));
console.log(this.data);
};
reader.readAsBinaryString(target.files[0]);
}
export(): void {
/* generate worksheet */
const ws: XLSX.WorkSheet = XLSX.utils.aoa_to_sheet(this.data);
/* generate workbook and add the worksheet */
const wb: XLSX.WorkBook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
/* save to file */
XLSX.writeFile(wb, this.fileName);
}
try this - excel file Read
import * as XLSX from 'xlsx';
this.ExcelData = [];
this.ngxLoader.start();
this.file = event.target.files[0];
let fileReader = new FileReader();
fileReader.onload = (e) => {
this.arrayBuffer = fileReader.result;
var data = new Uint8Array(this.arrayBuffer);
var arr = new Array();
for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
var workbook = XLSX.read(bstr, { type: "binary" });
var first_sheet_name = workbook.SheetNames[0];
var worksheet = workbook.Sheets[first_sheet_name];
let jsondata = XLSX.utils.sheet_to_json(worksheet, { raw: true });
this.ExcelData = jsondata;
}
fileReader.readAsArrayBuffer(this.file);
this.file = null;
Please make the following change and you will be able to access the value of tmpArray from anywhere.
tmpArray; // changed here and moved it to outside the function
let self = this; // please note this change
reader.onload = function(e : any) {
var data = new Uint8Array(e.target.result);
var workbook = XLSX.read(data, {type: 'array'});
let worksheet = workbook.Sheets[workbook.SheetNames[0]];
// sample values //
let desired_cell = worksheet['B5'];
let cellB16 = worksheet['B16'];
// sample values //
let desired_value12 = (cellB16 ? cellB16.v : undefined);
self.tmpArray = desired_value12; // changed here
};
I want to get the first row(name,email,mobile) as array from an uploaded excel file.
I am using XLSX.
I am getting whole data into array. But, I want only to read top line. because,
my excel file is quite large.
onFileChange(event) { //when user uploads xls file
const fileList: FileList = event.target.files;
if (fileList.length > 0) {
const file: File = fileList[0];
const reader = new FileReader();
reader.onload = function (e) {
const arrayBuffer = this.result,
data = new Uint8Array(arrayBuffer),
arr = new Array();
for (let i = 0; i !== data.length; ++i) {
arr[i] = String.fromCharCode(data[i]);
}
const bstr = arr.join('');
const workbook: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
const firstSheetName: string = workbook.SheetNames[0];
const worksheet: XLSX.WorkSheet = workbook.Sheets[firstSheetName];
// getting all rows
console.log(XLSX.utils.sheet_to_json(worksheet, { header: 1 }));
// I want to get top row only.
console.log(XLSX.utils.decode_row('A1'));
};
reader.readAsArrayBuffer(file);
}
}
function get_header_row(sheet)
{
var headers = [];
var range = XLSX.utils.decode_range(sheet['!ref']);
var C, R = range.s.r;
* start in the first row */
/* walk every column in the range */
for(C = range.s.c; C <= range.e.c; ++C)
{
var cell = sheet[XLSX.utils.encode_cell({c:C, r:R})]
/* find the cell in the first row */
var hdr = "UNKNOWN " + C; // <-- replace with your desired default
if(cell && cell.t)
hdr = XLSX.utils.format_cell(cell);
headers.push(hdr);
}
return headers;
}
I've tried the file upload and below is my steps and result with both data and header,
This will also support multiple sheet within the excel sheet,
1.npm install --save xlsx
2.import * as XLSX from 'xlsx';
3.HTML Code:
<input type="file" (change)="onFileChange($event)">
4.Angular Typescript:
exceltoJson = {};
onFileChange(event: any) {
this.exceltoJson = {};
let headerJson = {};
/* wire up file reader */
const target: DataTransfer = <DataTransfer>(event.target);
// if (target.files.length !== 1) {
// throw new Error('Cannot use multiple files');
// }
const reader: FileReader = new FileReader();
reader.readAsBinaryString(target.files[0]);
console.log("filename", target.files[0].name);
this.exceltoJson['filename'] = target.files[0].name;
reader.onload = (e: any) => {
/* create workbook */
const binarystr: string = e.target.result;
const wb: XLSX.WorkBook = XLSX.read(binarystr, { type: 'binary' });
for (var i = 0; i < wb.SheetNames.length; ++i) {
const wsname: string = wb.SheetNames[i];
const ws: XLSX.WorkSheet = wb.Sheets[wsname];
const data = XLSX.utils.sheet_to_json(ws); // to get 2d array pass 2nd parameter as object {header: 1}
this.exceltoJson[`sheet${i + 1}`] = data;
const headers = this.get_header_row(ws);
headerJson[`header${i + 1}`] = headers;
// console.log("json",headers)
}
this.exceltoJson['headers'] = headerJson;
console.log(this.exceltoJson);
};
}
get_header_row(sheet) {
var headers = [];
var range = XLSX.utils.decode_range(sheet['!ref']);
var C, R = range.s.r; /* start in the first row */
/* walk every column in the range */
for (C = range.s.c; C <= range.e.c; ++C) {
var cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })] /* find the cell in the first row */
// console.log("cell",cell)
var hdr = "UNKNOWN " + C; // <-- replace with your desired default
if (cell && cell.t) {
hdr = XLSX.utils.format_cell(cell);
headers.push(hdr);
}
}
return headers;
}
5.Result
{filename: "uploadedexcel.xlsx", sheet1: Array(212), sheet2: Array(8), headers: {…}}
Results holds the uploaded excel name, data in the sheet1 and sheet2 and also header in the sheet1 and sheet2.
The uploaded excel sheets has sheet1 and sheet2.
I am using this code for single row header in excel sheet, but I want a two row header. Suggestions are welcome.
var Heading =[
[ "EMPLOYEE","SCORES","COMMENTS"]
];
const myworksheet: XLSX.WorkSheet = XLSX.utils.json_to_sheet(this.emp ,{skipHeader:true});
XLSX.utils.sheet_add_json(myworksheet,this.emp,{skipHeader:true , origin: 'A2'});
XLSX.utils.sheet_add_aoa(myworksheet, Heading);
Here i am taking excel sheet from the blob
public DisplayExcelRows(ExcelURL from blob) {
var url = ExcelURL;
var oReq = new XMLHttpRequest();
oReq.open("GET", url, true);
oReq.responseType = "arraybuffer";
var excelrows: any;
oReq.onload = () => {
var arraybuffer = oReq.response;
/* convert data to binary string */
var data = new Uint8Array(arraybuffer);
var arr = new Array();
for (var i = 0; i != data.length; ++i) arr[i] = String.fromCharCode(data[i]);
var bstr = arr.join("");
/* Call XLSX */
var workbook = XLSX.read(bstr, { type: "binary" });
/* DO SOMETHING WITH workbook HERE */
var first_sheet_name = workbook.SheetNames[0];
/* Get worksheet */
var worksheet = workbook.Sheets[first_sheet_name];
excelrows = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
//this will extract headers and other rows separately
this.data = excelrows;
this.header = this.data.shift(); //splitting headers and other rows
}
simplest way i found of doing this if you are using the json method then that is already generating objects with KEYS from the header so when using:
this.decoded = utils.sheet_to_json(workSheet);
just do this to get headers (assuming there was anything decoded):
this.columns = Object.keys(this.decoded[0]);
that will give you the columns, simply by getting the object keys which it used to generate them from the column names initially
// getting all rows
this.data = (XLSX.utils.sheet_to_json(worksheet, { header: 1 }));
// Fetch the first row
const header = this.data.shift();
Iam capturing webcam screenshot in reactjs(react-webcam). Screenshot is in the form of base64 encoded string. I am sending the base 64string to nodejs and I want to convert base64 String to .jpeg file, So that I can save in Azure Blob Storage.
Is there any method to convert base64 string to .jpeg file.
You can convert your Base64 string to Buffer and then try storing it to azure.
var base64String = "....."; // your base64 string
var bufferValue = Buffer.from(base64String,"base64");
I used this and it worked.
below is server side code(NodeJS)
var contentType = 'image/jpeg';
let base64String=req.body.img;
let base64Image = base64String.split(';base64,').pop();
let date=Date.now();
fs.writeFile(`./uploads/${date}.jpeg`, base64Image, {encoding: 'base64'}, function(err) {
console.log('File created');
sourceFilePath= path.resolve(`./uploads/${date}.jpeg`);
blobName=path.basename(sourceFilePath, path.extname(sourceFilePath));
//console.log(sourceFilePath);
blobService.createBlockBlobFromLocalFile(containerName, blobName, sourceFilePath, err => {
if (err) {
console.log(err);
}
else {
//resolve({ message: `Upload of '${blobName}' complete` });
console.log("UPLOADED")
}
});
Try this:
based-blob
(async function() {
const b = require('based-blob');
const base64String = 'some base64 data...';
const blob = b.toBlob(base64String);
const b64s = await b.toBase64(blob);
console.log(b64s == base64String); // true
})();
Hi i use this function
public b64toBlob = (b64Data: string = '', sliceSize?: number) => {
sliceSize = sliceSize || 512;
if ( b64Data !== null) {
let block = b64Data.split(';');
let dataType = block[0].split(':')[1];
let realData = block[1].split(',')[1];
let filename = this.makeid() + '.' + dataType.split('/')[1];
let byteCharacters = atob(realData);
let byteArrays = [];
for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
let slice = byteCharacters.slice(offset, offset + sliceSize);
let byteNumbers = new Array(slice.length);
for (let i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}
let byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}
let blob = new Blob(byteArrays, {type: dataType});
return blob ;
} else {
return '';
}
}
I could use a hand. My company uses Google Sheets extensively, and we need a way to access files when we lose our Internet connection.
I could not get any of the examples found on this site to work for creating xls or ods from Google Sheets via script.
I did script a way to create csv backups, accessible from a local Google Drive folder. When used with an hourly trigger, this script creates csv files of every sheet of any spreadsheet modified in the last hour, puts them in a folder, and zips it inside a folder specifically for backups. From there I can move the zip to our local server.
function backUpMaker() {
var backupFolderId = '<Id of Backup Folder>';
var timeNow = new Date();
var newFolder = DocsList.createFolder(timeNow);
var newFolderId =newFolder.getId();
newFolder.addToFolder(DocsList.getFolderById(backupFolderId));
newFolder.removeFromFolder(DocsList.getRootFolder());
var sheets = DriveApp.getFilesByType(MimeType.GOOGLE_SHEETS);
while (sheets.hasNext()) {
var sheet = sheets.next();
var lastUpdate = sheet.getLastUpdated();
var timeHourAgo = new Date();
timeHourAgo = timeNow - 3600000;
if(lastUpdate >= timeHourAgo){
var sheetId = sheet.getId();
var csv = eachSheet(sheetId,newFolderId);
}
}
var backupFolder = DocsList.getFolderById(backupFolderId);
try{
backupFolder.createFile(Utilities.zip(newFolder.getFiles(), timeNow + '.zip'));
} catch(err) {
Logger.log(err);
}
newFolder.setTrashed(true);
}
function eachSheet(key,newFolderId) {
var ss = SpreadsheetApp.openById(key);
var ssId = ss.getId();
var ssName = ss.getName();
var howManySheets = ss.getNumSheets();
try{
for (var sheetIndex=0; sheetIndex < howManySheets; sheetIndex++) {
var activeSheet = ss.getSheets()[sheetIndex];
var activeName = activeSheet.getName();
if(activeName != 'Dropdowns'){ //Skip a hidden sheet used for validation on many of our spreadsheets
var activeId = activeSheet.getSheetId();
var time = new Date();
var fileName = time + " Backup: " + ssName + " " + activeName + ".csv";
var csv = contentCSV(ssId,activeId);
var folder = DocsList.getFolderById(newFolderId);
folder.createFile(fileName, csv, 'text/plain');
}
}
} catch(err) {
Logger.log(err)
}
}
function contentCSV(key,gid) {
var file = DocsList.getFileById(key);
var response = UrlFetchApp.fetch("https://spreadsheets.google.com/feeds/download/spreadsheets/Export?key=" + key +
"&gid=" + gid + "&exportFormat=csv", oAuth());
var fileText = response.getContentText();
return fileText;
}
function oAuth() {
var oauthConfig = UrlFetchApp.addOAuthService("spreadsheets");
var scope = "https://spreadsheets.google.com/feeds"
oauthConfig.setConsumerKey("anonymous");
oauthConfig.setConsumerSecret("anonymous");
oauthConfig.setRequestTokenUrl("https://www.google.com/accounts/OAuthGetRequestToken?scope="+scope);
oauthConfig.setAuthorizationUrl("https://accounts.google.com/OAuthAuthorizeToken");
oauthConfig.setAccessTokenUrl("https://www.google.com/accounts/OAuthGetAccessToken");
var requestData = {
"oAuthServiceName": "spreadsheets",
"oAuthUseToken": "always",
};
return requestData;
}
How would I modify this to save as ods rather than csv? Or is there a better way to save backups? Thank you for your help!
Working code follows, thanks to input by #serge-insas :
Note: To make this work, enter your backup folder's id key, then choose ods or xlsx by commenting out the other choice. Then you need to set up a timed hourly trigger for backUpMaker(). Logs will catch errors for files that have been moved temporarily. Here goes:
function backUpMaker() {
var backupFolderId = '0B5--------------------1ZX1k';
//var exportFormat = 'ods';
var exportFormat = 'xlsx';
var timeNow = new Date();
var newFolder = DocsList.createFolder(timeNow);
var newFolderId =newFolder.getId();
newFolder.addToFolder(DocsList.getFolderById(backupFolderId));
newFolder.removeFromFolder(DocsList.getRootFolder());
var sheets = DriveApp.getFilesByType(MimeType.GOOGLE_SHEETS);
while (sheets.hasNext()) {
var sheet = sheets.next();
var lastUpdate = sheet.getLastUpdated();
var timeHourAgo = new Date();
timeHourAgo = timeNow - 3600000;
if(lastUpdate >= timeHourAgo){
try{
var key = sheet.getId();
var name = sheet.getName();
var fileName = timeNow + " Backup: " + name + "." + exportFormat;
var blob = contentBackup(key,exportFormat);
var folder = DocsList.getFolderById(newFolderId);
folder.createFile(blob).rename(fileName);
} catch(err){
Logger.log(err);
}
}
}
var backupFolder = DocsList.getFolderById(backupFolderId);
try{
backupFolder.createFile(Utilities.zip(newFolder.getFiles(), timeNow + '.zip'));
} catch(err) {
Logger.log(err);
}
newFolder.setTrashed(true);
}
function contentBackup(key,exportFormat) {
try{
if(exportFormat == 'xlsx'){
exportFormat = 'xls';
}
var file = DocsList.getFileById(key);
var response = UrlFetchApp.fetch("https://spreadsheets.google.com/feeds/download/spreadsheets/Export?key=" + key +
"&exportFormat=" + exportFormat, oAuth());
var fileBlob = response.getBlob();
return fileBlob;
} catch(err) {
Logger.log(err)
}
}
function oAuth() {
var oauthConfig = UrlFetchApp.addOAuthService("spreadsheets");
var scope = "https://spreadsheets.google.com/feeds"
oauthConfig.setConsumerKey("anonymous");
oauthConfig.setConsumerSecret("anonymous");
oauthConfig.setRequestTokenUrl("https://www.google.com/accounts/OAuthGetRequestToken?scope="+scope);
oauthConfig.setAuthorizationUrl("https://accounts.google.com/OAuthAuthorizeToken");
oauthConfig.setAccessTokenUrl("https://www.google.com/accounts/OAuthGetAccessToken");
var requestData = {
"oAuthServiceName": "spreadsheets",
"oAuthUseToken": "always",
};
return requestData;
}
Your code needed very few changes to get ods files.
2 differences : the requested format in the urlFetch becomes "ods" and the returned object is not a string anymore but a blob.
Beside that, I kept all the sheet selection functions that you wrote and it seems to work fine as well. (nice job you did !).
Below is the full code I reproduced from yours and changed as described. My tests were working fine.
function backUpMaker() {
var backupFolderId = '0B3qS--------------TXdlY2M';
var timeNow = new Date();
var newFolder = DocsList.createFolder(timeNow);
var newFolderId =newFolder.getId();
newFolder.addToFolder(DocsList.getFolderById(backupFolderId));
newFolder.removeFromFolder(DocsList.getRootFolder());
var sheets = DriveApp.getFilesByType(MimeType.GOOGLE_SHEETS);
while (sheets.hasNext()) {
var sheet = sheets.next();
var lastUpdate = sheet.getLastUpdated();
var timeHourAgo = new Date();
timeHourAgo = timeNow - 3600000;
if(lastUpdate >= timeHourAgo){
var sheetId = sheet.getId();
var csv = eachSheet(sheetId,newFolderId);
}
}
var backupFolder = DocsList.getFolderById(backupFolderId);
try{
backupFolder.createFile(Utilities.zip(newFolder.getFiles(), timeNow + '.zip'));
} catch(err) {
Logger.log(err);
}
newFolder.setTrashed(true);
}
function eachSheet(key,newFolderId) {
var ss = SpreadsheetApp.openById(key);
var ssId = ss.getId();
var ssName = ss.getName();
var howManySheets = ss.getNumSheets();
try{
for (var sheetIndex=0; sheetIndex < howManySheets; sheetIndex++) {
var activeSheet = ss.getSheets()[sheetIndex];
var activeName = activeSheet.getName();
if(activeName != 'Dropdowns'){ //Skip a hidden sheet used for validation on many of our spreadsheets
var activeId = activeSheet.getSheetId();
var time = new Date();
var fileName = time + " Backup: " + ssName + " " + activeName + ".ods";
var blob = contentODS(ssId,activeId);
var folder = DocsList.getFolderById(newFolderId);
folder.createFile(blob).rename(fileName);
}
}
} catch(err) {
Logger.log(err)
}
}
function contentODS(key,gid) {
var file = DocsList.getFileById(key);
var response = UrlFetchApp.fetch("https://spreadsheets.google.com/feeds/download/spreadsheets/Export?key=" + key +
"&gid=" + gid + "&exportFormat=ods", oAuth());
var fileBlob = response.getBlob();
return fileBlob;
}
function oAuth() {
var oauthConfig = UrlFetchApp.addOAuthService("spreadsheets");
var scope = "https://spreadsheets.google.com/feeds"
oauthConfig.setConsumerKey("anonymous");
oauthConfig.setConsumerSecret("anonymous");
oauthConfig.setRequestTokenUrl("https://www.google.com/accounts/OAuthGetRequestToken?scope="+scope);
oauthConfig.setAuthorizationUrl("https://accounts.google.com/OAuthAuthorizeToken");
oauthConfig.setAccessTokenUrl("https://www.google.com/accounts/OAuthGetAccessToken");
var requestData = {
"oAuthServiceName": "spreadsheets",
"oAuthUseToken": "always",
};
return requestData;
}