I have tried previewanyfile cordova plugin to open files from external url's in Ionic 5 application. It works well with android but on IOS I noticed sometimes it doesnt preview/open PDF files. Just a grey screen with the file name on it. But strangely some PDF files open.
file preview screen
previewProductDocument(url: string) {
const loading = await this.loadingController.create({
message: 'Loading document...',
});
loading.present().then(() => {
this.previewAnyFile.preview(url).then((res) => {
loading.dismiss();
}).catch((err) => {
loading.dismiss();
this.presentToast('Error previewing the document try later', 'danger');
});
});
}
This is the plugin I have used
https://ionicframework.com/docs/native/preview-any-file
capacitor version "#capacitor/core": "^2.2.0",
Noticed this behavior only in IOS simulator + on Real IOS device.
Any idea what is going on here?
Special character (%2F) in the link is the cause of the issue.
For a quick win; either change the link or sanitise before processing.
In this case url.replace('%2F', '/') should work.
However, another link may, probably, contain a different character. Without being 100% sure, it worth a try decodeURI, which is decodeURI(url).
Related
I'm trying to use the Flutter url_launcher package to create a feedback form template. It worked well so far but I recently did a major package versioning upgrade and now it seems like something is going wrong in the translation of the placeholders.
final Uri _emailLaunchUri = Uri(
scheme: 'mailto',
path: recipient,
queryParameters: {
'subject': subject,
'body': body,
},
);
var newurl = _emailLaunchUri.toString();
return newurl;
The upper is my chunk of code to generate the uri and eventually return the new launch url including some Device information. Printing it out leads to the following output in the console:
mailto:support#support.de?subject=Feedback%3A+App+Name%28Subtitle%29&body=Dear+developers%2C%0D%0A%0D%0AiOS+version%3A+14.6%0D%0Amodel%3A+iPhone11%2C8%0D%0A
So far so good I guess, but that's how it ends up to look in my app (tested on a physical iPhone):
Is there anything I miss or that Apple might have changed in the recent iOS versions? My iPhone is using version 14.6. I figured out to replace the "+" with a %20 instead (seems to be a package error), but I'm not sure how to convert the line breaks correctly.
Would appreciate any help.
I am experimenting with using NativeScript to speed up the process of porting an existing Android app to iOS. The app in question uses a great deal of SVG manipulation in a Cordova webview. To keep things simple I want to port all of my existing Webview side code - in essence the entire existing Cordova www folder and its contents - over to the new NativeScript app. The WebView talks to a custom Cordova plugin which I use to talk with my servers to do such things as get new SVGs to show, keep track of user actions etc.
If I an get through these teething issues I am considering using this component to implement bi-direction communications between by current webview JS code and the, new, NativeScript backend that will replace my current Cordova plugin. Someone here is bound to tell me that I don't need to do that... . However, doing so would mean throwing out the baby with the bathwater and rewriting all of my current Webview ES6/JS/CSS code.
This is pretty much Day 1 for me with NativeScript and I have run into a few issues.
I find that I cannot get rid of the ActionBar even though I have followed the instructions here and set the action bar to hidden.
I can use the following markup in home.component.html
to show external web content. However, what I want to really do is to show the local HTML file that is in the www folder in the following folder hierarchy
app
|
____home
|
____www
|
______ index.html
|
______css
|
______ tpl
|
.....
However, when I use the markup
<Page actionBarHidden="true" >
<WebView src="~/www/index.html"></WebView>
</Page>
I am shown the error message
The webpage at file:///data/data/com.example.myapp/files/app/www/index.html is not available.
I'd be most grateful to anyone who might be able to tell me what I am doing wrong here - and also, how I can get rid of that action bar which is currently showing the app title.
About using local HTML file
Is your local HTML file recognized by Webpack (which is enabled by default in NativeScript)? Try to explicitly add the local HTML file to your webpack.config.js file. This way Webpack will "know" that it will have to bundle this file as well.
new CopyWebpackPlugin([
{ from: { glob: "<path-to-your-custom-file-here>/index.html" } }, // HERE
{ from: { glob: "fonts/**" } },
{ from: { glob: "**/*.jpg" } },
{ from: { glob: "**/*.png" } },
]
Example here
About hiding the ActionBar
NativeScript Core only: Try hiding the action bar directly for the frame that holds the page. See the related documentation here
NativeScript Angular: The page-router-outlet will have an action bar by default (you can hide it by using the Page DI as done here). Otherwise, you could create a router-outlet (instead of page-router-outlet). The router-outler won't have the mobile-specific ActionBar.
My code is working but not exactly the way I want. I'm using the plugin cordova-plugin-inappbrowser. I have an anchor tag to click and opens up a pdf. The code is as follows:
$("#lnkTools").click(function(e){
//e.preventDefault();
url = 'someExternalLink.pdf';
var options = {location: 'yes', clearcache: 'no', toolbar:'no', closebuttoncaption: 'DONE?'};
$cordovaInAppBrowser.open(url, '_blank', options);
}
The problem I'm facing is that, the PDF doesn't open if I don't exit the app, I have to exit the app first and get back in for the PDF to open up. What am I missing? When I try to use _system same thing, before it opens up the browser, I still need to exit the app first.
EDIT:
When I try to change the $urlRouterProvider.otherwise('/app/main'); in my app.js to $urlRouterProvider.otherwise('/app/login'); it's working, well. Why is this like this? when I place a $state.go('app.main') in my login controller, it loops. Is there any way I can get through this?
I am working on an application with PhoneGap (now Apache Cordova, with the version of 2.0), and using the PhoneGap File API to write file.
The File API I use could be referenced at:
http://docs.phonegap.com/en/2.0.0/cordova_file_file.md.html#File
I use Ripple Emulator (0.9.9beta) from here: https://developer.blackberry.com/html5/download to test my application in chrome.
But I find Ripple could not handle the PhoneGap File API correctly.
For example:
I want to create a file (root/foo.json) at the PERSISTENT directory
function onSuccess(fileSystem) {
fileSystem.root.getDirectory("dir", {create: true}, function(dirEntry){
dirEntry.getFile("foo.json", {create: true}, function(fileEntry){
fileEntry.createWriter(function(writer){
writer.write(JSON.stringify(fooData));
}, onfail);
}, onfail);
}, onfail);
}
function onfail(error)
{
console.log(error.code);
}
// request the persistent file system
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, onSuccess, onfail);
It works fine on iOS simulator, which did create the right file at the right place, but in the Ripple Emulator running in chrome, I just got a onfail callback, and got error code 10 (FileError.QUOTA_EXCEEDED_ERR).
I also found someone with the similar question here: Is it able to test phonegap application outside emulator?
But still no answer.
Does Ripple emulator currently not work correctly for PhoneGap API? Or did I missed some setting?
Problem found. I need to grant quota before using the PERSISTENT filesystem object.
https://developers.google.com/chrome/whitepapers/storage#persistent
// Request Quota (only for File System API)
window.webkitStorageInfo.requestQuota(PERSISTENT, 1024*1024, function(grantedBytes) {
window.webkitRequestFileSystem(PERSISTENT, grantedBytes, onInitFs, errorHandler);
}, function(e) {
console.log('Error', e);
});
It seems Ripple-UI didn't do this for me (I checked the source code at lib/ripple/fs.js) . That's why I always get a FileError.QUOTA_EXCEEDED_ERR.
I'm building iOS app with PhoneGap, need to write and read text file to the device.
I followed the steps found here: http://docs.phonegap.com/en/2.0.0/guide_getting-started_ios_index.md.html#Getting%20Started%20with%20iOS
Everything works fine, except I cannot use any of the API (I tried file and notification). I am calling:
alert(navigator.fileMgr) but it's always undefined.
I am calling that in the deviceready callback function.
I think I missed some important steps, could anyone have experience in this give me some link/guide/help?
Thanks in advance!
I'm not sure where you are getting your info but navigator.fileMgr does not exist anymore and hasn't for a long time. We've implemented the W3C File API:
http://docs.phonegap.com/en/2.0.0/cordova_file_file.md.html#File
To get the root path of the file system you would do:
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
console.log("File system root = " + fileSys.root.fullPath);
}, function() {
console.log("Could not get file system");
});
Examples of how to read/write files are also available on the docs site.