问题
i am developing Hybrid app using ionic. i want to open (doc, ppt, xlsx, pdf, jpg ,png) file from device internal or external storage using ionic native file opener plugin, but i'm able to open only pdf file using below code. i use application/pdf to open pdf, to open other files what shoud i replace at the place of application/pdf? please help me. thank you.
import { FileOpener } from '@ionic-native/file-opener';
constructor(private fileOpener: FileOpener) { }
...
this.fileOpener.open('path/to/file.pdf', 'application/pdf')
.then(() => console.log('File is opened'))
.catch(e => console.log('Error openening file', e));
回答1:
finally i got solution.
let fileExtn=file_name.split('.').reverse()[0];
let fileMIMEType=this.getMIMEtype(fileExtn);
this.fileOpener.open("file:///storage/emulated/0/download/"+ file_name+"", fileMIMEType)
.then(() => console.log('File is opened'))
.catch(e => console.log('Error openening file', e));
make other function for MIMEtype
getMIMEtype(extn){
let ext=extn.toLowerCase();
let MIMETypes={
'txt' :'text/plain',
'docx':'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'doc' : 'application/msword',
'pdf' : 'application/pdf',
'jpg' : 'image/jpeg',
'bmp' : 'image/bmp',
'png' : 'image/png',
'xls' : 'application/vnd.ms-excel',
'xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'rtf' : 'application/rtf',
'ppt' : 'application/vnd.ms-powerpoint',
'pptx': 'application/vnd.openxmlformats-officedocument.presentationml.presentation'
}
return MIMETypes[ext];
}
回答2:
Ok, I made a file-extension.ts file in my provider folder having a good handful of extensions along with it's appropriate headers . Below is it's code(taken from Mozilla Docs, see here for full reference):
file-extension.ts:
export const FILE_EXTENSION_HEADERS = {
'aac' : 'audio/aac',
'abw' : 'application/x-abiword',
'arc' : 'application/x-freearc',
'avi' : 'video/x-msvideo',
'azw' : 'application/vnd.amazon.ebook',
'bin' : 'application/octet-stream',
'bmp' : 'image/bmp',
'bz' : 'application/x-bzip',
'bz2' : 'application/x-bzip2',
'csh' : 'application/x-csh',
'css' : 'text/css',
'csv' : 'text/csv',
'doc' : 'application/msword',
'docx' : 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'eot' : 'application/vnd.ms-fontobject',
'epub' : 'application/epub+zip',
'gif' : 'image/gif',
'htm' : 'text/html',
'html' : 'text/html',
'ico' : 'image/vnd.microsoft.icon',
'ics' : 'text/calendar',
'jar' : 'application/java-archive',
'jpeg' : 'image/jpeg',
'jpg' : 'image/jpeg',
'js' : 'text/javascript',
'json' : 'application/json',
'jsonld' : 'application/ld+json',
'mid' : 'audio/midi',
'midi' : 'audio/midi',
'mjs' : 'text/javascript',
'mp3' : 'audio/mpeg',
'mpeg' : 'video/mpeg',
'mpkg' : 'application/vnd.apple.installer+xml',
'odp' : 'application/vnd.oasis.opendocument.presentation',
'ods' : 'application/vnd.oasis.opendocument.spreadsheet',
'odt' : 'application/vnd.oasis.opendocument.text',
'oga' : 'audio/ogg',
'ogv' : 'video/ogg',
'ogx' : 'application/ogg',
'otf' : 'font/otf',
'png' : 'image/png',
'pdf' : 'application/pdf',
'ppt' : 'application/vnd.ms-powerpoint',
'pptx' : 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
'rar' : 'application/x-rar-compressed',
'rtf' : 'application/rtf',
'sh' : 'application/x-sh',
'svg' : 'image/svg+xml',
'swf' : 'application/x-shockwave-flash',
'tar' : 'application/x-tar',
'tif' : 'image/tiff',
'tiff' : 'image/tiff',
'ttf' : 'font/ttf',
'txt' : 'text/plain',
'vsd' : 'application/vnd.visio',
'wav' : 'audio/wav',
'weba' : 'audio/webm',
'webm' : 'video/webm',
'webp' : 'image/webp',
'woff' : 'font/woff',
'woff2' : 'font/woff2',
'xhtml' : 'application/xhtml+xml',
'xls' : 'application/vnd.ms-excel',
'xlsx' : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
'xml' : 'application/xml ',
'xul' : 'application/vnd.mozilla.xul+xml',
'zip' : 'application/zip',
'3gp' : 'video/3gpp',
'3g2' : 'video/3gpp2',
'7z' : 'application/x-7z-compressed'
};
- Later imported this in my provider file and made a method to have this available application wide.
APIService.ts:
import { FILE_EXTENSION_HEADERS } from './file_extension_headers';
@Injectable()
export class APIService{
/* some other methods */
fetchFileHeader(extension){
extension = extension.toLowerCase();
return FILE_EXTENSION_HEADERS[extension] !== undefined ? FILE_EXTENSION_HEADERS[extension] : 'text/plain';// default if no appropriate header is found
}
}
- Note that it is still quite possible that sending appropriate header might not open the file. In this case, you will need to have appropriate application installed on your mobile devices to open such kind of files.
来源:https://stackoverflow.com/questions/48583578/how-to-open-doc-ppt-xlsx-pdf-jpg-png-file-using-ionic-native-file-opener