Develop Reference

Angular *.docx and *.xlsx file free tool to preview inside the application using Library like 'ngx-doc-viewer2' or Other

It's been 3 days, I am searching for a solution to display my *.docx and *.xlxs file in my angular application. I have an API which is returning the files as blob. Now, I want to use that blob to show the file. I can easily download the file using window.open(blobLink), however, my main task was to view the file. So, I searched and found ngx-doc-viewer and it does not work with the blob link as I currently found and file needed to be publicly accessible. But, my application will run in the local network. So, how can I solve this problem. Here is my *.ts and HTML code below=>
TS
getFile(fileData: File) {
this.tempBlob= null;
this.ProposalService.getFile(fileData).subscribe(
(retFileData: any) => {
this.tempRetFileData = retFileData;
},
(err: Error) => {
},
() => {
const blob = new Blob([this.tempRetFileData], { type: this.contentType });
this.docURL = window.URL.createObjectURL(blob);
}
);
}
HTML
<ngx-doc-viewer [url]="docURL" viewer="google" style="width:100%;height:50vh;"></ngx-doc-viewer>
Note: Any other free Library and solution is acceptable.

For blob type use viewer="mammoth":
<ngx-doc-viewer [url]="docURL" **viewer="mammoth"** style="width:100%;height:50vh;"></ngx-doc-viewer>
To use mammoth, also add:
npm install mammoth --save
and make sure mammoth.browser.min.js is loaded. For the angular/cli you would add the following in angular.json:
"scripts": [
"node_modules/mammoth/mammoth.browser.min.js"
]

Share image plus text via Whatsapp with React Native

I am working on a react native app and one of my needs is to be able to share via Whatsapp, a png image (created from a svg) plus some text in the message. I have achieved this on Android using react-native-share but when I try it on iOS, the message is populated with the provided text but the image is ignored. I have also tried with Share from react-native but the result is the same.
I have tried this sharing directly a base64 image (data:image/png;base64,image_data) as well as saving the created image and add the path as the url but the result is always the same.
The only way to make this work on iOS (with both react-native-share and Share) is to omit the message, but the text is needed in the requirement.
Is there a way to achieve this?
Versions:
React Native - 0.55.0
react-native-share - 1.1.2
As a side note, the sharing process on Twitter, Email, SMS and some other apps is working correctly.
Code sample:
const base64Data = this.state.uri
const dir = `${RNFS.DocumentDirectoryPath}/tmp_${moment().valueOf()}.png`
RNFS.writeFile(dir, base64Data, 'base64').then(async () => {
const options = {
url: Platform.OS === 'android' ? `file://${dir}` : dir,
message: '' // By omitting the message, whatsapp shows the image
}
try {
await Share.open(options)
// Delete file when share action is completed
await RNFS.unlink(dir)
} catch (error) {
console.log('error', error)
}
}).catch((err) => {
console.log(err.message)
})

Silently print a PDF file using javascript

The thing I want to build is that by clicking a button I want to trigger the direct print of a PDF file, but without opening or viewing it.
I have PDF as blob file returned from fetch API.
I tried a lot of examples but don't know exactly how to do it
Some examples tried:
// In my case, I had only blobData from PDF, but you can ignore this and set fileURL directly if it is not yours.
const file = new Blob([blobData], { type: 'application/pdf' });
const fileURL = window.URL.createObjectURL(file);
// As the URL is dynamic, we must set src here, but if it's not, just leave it direct on the HTML.
// Also, be careful with React literals. If you do this in a <iframe> defined in JSX, it won't work
// as React will keep src property undefined.
window.frames["my-frame"].src = fileURL;
// Then print:
window.frames["my-frame"].print();
<iframe name="my-frame" id="my-frame" title="my-frame" style="display: none"></iframe>
Also tried library, Print.js: http://printjs.crabbly.com/.
Is there way to print the pdf without visually opening it to the user?
We should support only Chrome browser.
Can someone provide example how to do it in React, Redux application?

try this print-js and this is npm package
install npm package
npm install print-js --save
Add following code
import print from "print-js";
const fileURL = "someurl.com/document.pdf";
const handlePrint = (e) => {
e.preventDefault();
print(fileURL);
};
similar question is here

FileError {code: 5} trying to use absolute file paths with Meteor 1.4 Cordova

I'm trying to use Meteor 1.4 with Cordova (mobile support) to read files on my android phone.
I've got a small Meteor app running on my phone (via meteor run android-device). I have also created a small text file in the app's private storage using adb shell and run-as.
I can read the file if I call getFile('a'), but I can't find any way to use cordova.file.dataDirectory (even with WebAppLocalServer.localFileSystemUrl) as recommended in the Meteor guide. I get FileError {code: 5} (ENCODING_ERR).
Here's the JS console output from the Chrome inspector when I click the button in my app:
This repros on both Android 5 and 6.
My dev environment is 64-bit Ubuntu 14.04 LTS.
App Info for my app reports it has these permissions:
modify or delete the contents of your SD card
read the contents of your SD card
The app uses the cordova file plugin version 4.2.0.
Dup? How to read/write a file in Meteor-Cordova?
This does work in the chrome://inspect console via USB debugging: HTTP.call('GET', 'http://localhost:12640/local-filesystem/data/user/0/com.adammonsen.app/files/a', {}, function (e,r) {console.error(e); console.log(r)});
output is Object {statusCode: 200, content: "in external dir↵", headers: Object, data: null}

Got it. The trick is to use window.resolveLocalFileSystemURL() to get at the filesystem. Here's how to get at a file on external storage. My original question was about app-private storage. If you're looking for that, just use the cordova.file.dataDirectory instead of cordova.file.externalDataDirectory.
function reportError(err) {
console.error(err);
}
function readFile(file) {
var reader = new FileReader();
reader.onloadend = function() {
console.log('read file! contents: ' + this.result);
};
reader.readAsText(file);
}
function processFileEntry(fileEntry) {
fileEntry.file(file => {
readFile(file);
}, reportError);
}
Template.hello.events({
'click button'(event, instance) {
// increment the counter when button is clicked
instance.counter.set(instance.counter.get() + 1);
if (Meteor.isCordova) {
// aaaaaand do some other stuff
const path = cordova.file.externalDataDirectory + 'a';
window.resolveLocalFileSystemURL(path, fileEntry => {
console.log('fileEntry: ', fileEntry);
processFileEntry(fileEntry);
}, reportError);
}
},
});
See https://github.com/meonkeys/cordova-file-test/tree/solution for a full working example and instructions.
Make sure AndroidExtraFilesystems includes files-external. I used this line in my mobile-config.js:
App.setPreference('AndroidExtraFilesystems', 'files,files-external');
I'd love to understand the difference between the APIs, but for now I'm just happy I found something that works reliably.

Read local file in Phonegap

I'm trying to read a local file in Phonegap to load the language strings for the application and I can't make it work :(
The code is pretty straightforward:
var pathToLocalFile = "/home/user/android/assets/www/js/";
var langCache = new FileReader();
langCache.onload = function(data){
col = JSON.parse(data);
refreshAllStrings();
};
langCache.onerror = function(err){
debug.error(err);
};
langCache.readAsText(pathToLocalFile+currentLang+'.json');
This code doesn't work on the Ripple emulator and I replaced it with
var pathToLocalFile = "file:///android_asset/www/js/";
in case of android, with the same result:
Uncaught TypeError: Object #<Console> has no method 'warning' cordova-2.4.0.js:2616
initRead cordova-2.4.0.js:2616
FileReader.readAsText cordova-2.4.0.js:2660
loadLanguage
In the Ripple emulator, I started Chrome with google-chrome -–allow-file-access-from-files and the Android config and manifest has all the permissions for and the plugins set.
Of course I'm missing something, but any idea what this could be?
Regards.

If the file is under the www folder of your app you don't need to add '/home/..' or 'file:///'. You should just be able to load the contents using an "AJAX" fetch even though it is bundled in the app.
$.get('js/filename.ext');

The error you're seeing is actually a result of cordova-2.4.0.js calling a non-existent "warning" method. It should be console.warn. It is attempting to warn you that using a string for the readAsText method is now deprecated, and that you should use a File reference instead.
What should be happening is a console.warn of "Using a string argument with FileReader.readAs functions is deprecated."