↧
Capacitor live-reload for IOS launch browser instead of webview
↧
Capacitor live-reload for IOS launch browser instead of webview
I mean, is the url that the browser opens the same that you configured in the server.url?
Or is it different? (because of a redirect or something else)
↧
↧
Is the accessory bar meant to show without adding the Keyboard plugin?
After removing the plugin using npm uninstall @capacitor/keyboard, everything seems to be as expected. What would be the cause of this? Thanks!
↧
Capacitor live-reload for IOS launch browser instead of webview
Yes, it is opened the same in the server. It is not redirected or is different.
It works fine in Android, but IOS. I tested in both IOS simulator and the actual device, the same problem occurs. Give me your private email, I can send u the link in private.
↧
SyntaxError: Unexpected number in JSON at position 4 when trying to debug with VSCode (Android)
I have to convert my old Ionic 3 project to Ionic 5. My old Ionic 3 project uses cordova. So I was traying to test a Ionic 5 project from scratch with no errors first before start the conversion. I’m stuck if I can’t debug a simple Ionic 5 project with nothing added by me. I didn’t know that I’m mixing cordova with capacitor, the project was created using ionic start myApp1 tabs --cordova
Anyway I’m gonna try using capacitor for testing.
My old project uses bluetooth serial and ng-canvas-gauges. Are there compatible with capacitor?
↧
↧
Is the accessory bar meant to show without adding the Keyboard plugin?
Then the problem might be what you said, that as there is no room for scrolling the arrows don’t work.
You can try adding more scrollable area after your fields so they have room for scrolling, or try using a different keyboard resize mode such as “ionic” (if using ionic) or “body”.
↧
Similar example to "Ionic Infinite Scroll" from @Angular into @React
Hello,
Is there an example of code simulation to the “Ionic Infinite Scroll” from @Angular into @React, like in the link below: Infinite Scroller | ion-infinite-scroll Action Component
I will be very grateful for the help.
Thanks in advance.
↧
In app purchase 2 receipt validation CORS
Hi there,
I have an app which uses In App Purchase 2, however my submission was rejected due to requiring receipt validation.
When validating receipts on your server, your server needs to be able to handle a production-signed app getting its receipts from Apple’s test environment. The recommended approach is for your production server to always validate receipts against the production App Store first. If validation fails with the error code “Sandbox receipt used in production,” you should validate against the test environment instead.
They link me to the following for validation urls, however when I try hit the urls I get cors errors:
[Error] Preflight response is not successful
[Error] XMLHttpRequest cannot load https://sandbox.itunes.apple.com/verifyReceipt due to access control checks.
[Error] Failed to load resource: Preflight response is not successful (verifyReceipt, line 0)
This is how I implemented it in the code for now:
//TODO try production first
this.inAppPurchase.validator = "https://sandbox.itunes.apple.com/verifyReceipt";
Have I missed something? I am using capacitor 3.2.0
Thanks in advance
Liam
↧
Dynamic sizing of Ionic UI Components
I’m working with Ionic Angular and I’m trying to size the alerts and ionic menu icon based on screen size. I want to do something like width: 50vw but that doesn’t work. The closest thing I’ve been able to do is transform: scale(2.5) but that’s not dynamic.
Any help is appreciated!
↧
↧
In app purchase 2 receipt validation CORS
I was of the understanding receipt validations were only required for subscriptions (not a one off in app purchase)
↧
Ion Slides in Super tabs Ionic 4
in service i set new var
private swipeEnabled = new BehaviorSubject(true);
and make a function to return it
swiper() {
return this.swipeEnabled;
}
in the super tabs
<super-tabs-container [swipeEnabled]=“swipeEnabled”>
in TS
swipeEnabled: boolean = true;
swiper() {
this.service.swiper().subscribe((res) => {
this.swipeEnabled = res;
console.log(this.swipeEnabled);
});
}
in component that has slide
ionSlideDrag() {
this.service.swiper().next(false);
}
ionSlideTransitionEnd() {
this.service.swiper().next(true);
}
↧
Capacitor storage plugin does not seem to hold data on iOS when app is force-killed
I am using the Storage plugin on one of my pages to get the user’s gender from an input:
x.page.html:
<ion-select
[(ngModel)]="userMale"
[ngModelOptions]="{standalone: true}"
(ngModelChange)="onChangeGender(coeff); onCalcPoints(coeff);"
interface="popover"
>
<ion-select-option [value]="true">Male</ion-select-option>
<ion-select-option [value]="false">Female</ion-select-option>
</ion-select>
x.page.ts
ngOnInit() {
this.checkGender();
}
setGender = async () => {
const gender = (this.userMale) ? 'male' : 'female';
await Storage.set({
key: 'gender',
value: gender
});
};
checkGender = async () => {
if (typeof this.userMale === 'boolean') {
const { value } = await Storage.get({ key: 'gender' });
this.userMale = (value === 'male') ? true : false;
}
};
onChangeGender(form: NgForm): void {
this.coeffService.male = this.userMale;
this.onCalcPoints(form);
this.setGender();
}
But when I force kill the app on an iPhone, and then go back to the app the data does not seem to have been held.
↧
Vue ionic-multilevel-sidebar
I solved this using:
“stopPropagation()” function.
Is it a good practice to use it in order to prevent sidebar menu to auto-close while a higher lever menu is collapsing ?
const toggleMenu = (menu: any, e: Event) => {
e.stopPropagation();
const from = menu.isOpen ? '50px' : '0px';
const to = menu.isOpen ? '0px' : '50px' ;
const animation = createAnimation()
.addElement(document.querySelectorAll('.' + menu.tag))
.duration(300)
.fromTo('height', from, to);
animation.play();
menu.isOpen = !menu.isOpen;
};
↧
↧
Sc-ion class changes app style
Hey again! 
I managed to figure it out. See the comments in the issue I linked above, but the short version is that we’re using a tool called HotJar, and their JS code is overwriting a native browser function which confuses Stencil.
Try this…
- In chrome, get the problem to happen.
- Then, in the dev tools console, run
document.head.attachShadow - This will print out the contents of that function. You will probably not see
ƒ attachShadow() { [native code] } - Assuming you see something else, double-click on it. That should take you to the sources tab where you can see where it’s implemented. Wherever that’s happening, you need it to not happen in order for Ionic to work properly. In my case, it’s implemented by HotJar, so I’m going to remove it for now.
↧
Similar example to "Ionic Infinite Scroll" from @Angular into @React
↧
Capacitor storage plugin does not seem to hold data on iOS when app is force-killed
First off, apologies for the giant wall of text. There probably isn’t a direct, straightforward answer to your question in here, but if you need something to ponder while you wait for better answers, continue on.
I don’t know which if any of these things are actually responsible for the behavior you’re seeing, and you’re totally free to ignore my opinions, because they are admittedly arbitrary rules that are designed solely to prevent me from making mistakes that I have made in the past.
That being said,
- I only read from device storage (whatever the implementation) once per app run.
checkGenderbreaks that rule. - I also never touch device storage from pages, only services.
- Finally, I never bind multiple handlers to the same event. You’ve got two on
ngModelChangehere.
I would be interested to know if rearchitecting the code to follow these rules magically designs away your problem here. There are two reasons that I think it might.
-
I don’t know if there is an officially-defined execution order when multiple handlers are present on an event binding, but I strongly feel that acting as if it were totally unspecified is the safest thing for app code to do. If we invert the order of the assignment to
userMaleand the call toonChangeGender, I think we would get surprising behavior. (Incidentally, I think you are likely to run into trouble attempting to represent gender as a mere boolean). So here’s a situation where you might be inadvertently storing stale data. -
The liberal use of
asyncandawait(another thing I avoid, largely because of situations like this) obscures this, butsetGenderreturns aPromisethat is silently ignored byonChangeGender. You have no guarantee thatcheckGenderhas completed (either its read or its write) whenonChangeGenderreturns.
In summary, I would redesign this so that:
- all interaction with storage happens only in a service
- reads happen only at app startup (or the first time the data is requested)
- gender is stored as a string, not a boolean
- do the assignment to
userMalemanually in yourngModelChangehandler instead of banana-binding(ngMdoel), so you know when it happens
I applaud your decision to test this by force-quitting the app, because it exposes the futility of attempting to protect device storage referential integrity at write time. The reason I have the “do not read from storage more than once per app run” rule is that it allows me to blissfully ignore Promises from write operations. I don’t have to worry about the following scenario:
A. “foo” is sitting in storage.
B. live data becomes “bar”.
C. initiate write to storage for “bar”.
D. read from storage.
E. maybe we get new “bar”, maybe we get old “foo”.
If I never do D, the problem in E can’t happen. I never do D, because the only time I read from storage would be before B.
There is an alternative strategy here, which would be to ensure that C completes before D is allowed to start. I reject this strategy for two reasons, one of which you shined a light on here. First, it needlessly blocks the CPU. The live service, which should be the only source of truth for all the pages in the app, already knows that the new value is “bar”. It doesn’t have to wait to write it to storage and read it back again. The second reason is that it’s always possible that the app will get force quit while the write is pending, and there is absolutely no way to either block that or know about it from inside the app, so it’s pointless to try to address it directly.
↧
SyntaxError: Unexpected number in JSON at position 4 when trying to debug with VSCode (Android)
I believe the list of known incompatible plugins is here.
↧
↧
Which is the best ecommerce platform to build an ionic app from?
↧
Cant build blank projects anymore
Just for fun, can you try doing all this in a section of the filesystem that doesn’t have any strange characters in the full path (those '#'s are concerning me).
↧
Is it possible to integrate Capacitor into an existing iOS/Android App?
Capacitor, like Cordova and PhoneGap before it, is fundamentally a message bridge with a browser/JavaScript environment on one side and a twisty maze of native plugins on the other. All the user interaction is typically done on the browser side, because that sort of thing is what browsers are good at.
So if your UI is not using a webview, then it doesn’t really fit neatly into the slot Capacitor is designed to fill.
The task of (re)writing your interaction screens as web pages using a JavaScript app framework like Angular, React, or Vue would need to be done by you first, and then Capacitor can help you “reach back” to the native world for functionality that can’t be achieved directly from the browser (something like Bluetooth communication, for example).
↧