(topic deleted by author)
Fetching data works in browser but not in ios or android for certain pages
↧
↧
Ionic inAppBrowser end of life on July 1, 2024
@julio-ionic Thank you for the quick response. I’ll look forward to use @awesome-cordova-plugins/in-app-browser.
↧
We are looking for an ionic developer
Hello,
I can surely help you out let’s connect for a detailed discussion.
Regards,
Srishti
Skype:live:.cid.f2c84566cabcba14
Email:srishti.2ibrinfotech@gmail.com
↧
SOLVED -–ion-safe-area has no effect on iOS
Thank you for taking the time to reply @twestrick.
While this indeed applies the necessary padding, it opens up another problem: the padding will be the same in landscape mode. Which in the end would lead to me having to detect landscape mode and then adding/removing css. That feels like a hack…
I really feel like we’re missing something here and that there must be a better/proper way to get this working without tweaking it manually.
Should I file an issue on Github?
↧
SOLVED -–ion-safe-area has no effect on iOS
Hold up, I just stumbled across the answer:
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
The viewport-fit directive is the crucial part. Once added, no more messing around with custom css, neither in landscape nor portrait mode.
Hope this helps others as well and finds its way into the docs.
↧
↧
Cordova-plugin
(post deleted by author)
↧
Ionic in web. Hide browser address bar
it’s 2024 and ionic 8 is realesed but still facing this issue. I am very disappointed with the team and not providing solution for this very know and major problem. 
↧
We are looking for an ionic developer
Hello
Hope you are doing great
I can help you with your requirement for the same and I have 5+ years of experience developers in our team please reply so we can discuss in detail
Waiting for your response
Thanks
Sunil
↧
SOLVED -–ion-safe-area has no effect on iOS
Nice find! You might still need to override the safe area defaults due to different size notches. That’s what I had to do starting in Ionic 5 (currently on Ionic 7 and haven’t re-visited).
I am also using Vue and have the following:
<meta
name="viewport"
content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
/>
This matches the starter project too here. You might want to add the additional bits if you copied everything from that discussion.
↧
↧
Capacitor - APP plugin on IOS
Hello, i use capacitor - app plugin on my android / ios application and i have issue with App.exitApp(); i know that this function only on android is there any solution that will do this on ios?
↧
How to Share Chaatsapp.com WhatsApp Group Links
Open the WhatsApp group chat, then tap the group name. Tap Invite via link. Choose to Send link via WhatsApp, Copy link, Share link, or QR code. The admin can always make the previous invite link invalid and create a new
↧
Capacitor - APP plugin on IOS
Apple doesn’t like apps that provide an “exit” functionality as it looks like the app is crashing.
↧
Capacitor - APP plugin on IOS
Okay so there isn’t a solution to this problem?
↧
↧
Capacitor - APP plugin on IOS
No because if there was it would cause app store rejection. Just don’t do it.
↧
SOLVED -–ion-safe-area has no effect on iOS
Coming from a base of VueJS built with vite, this html of course is missing. Didn’t even think about that. Thanks for pointing me to that file, definitely gonna grab the additional bits!
↧
"Webpage not available" on Android with Live Reload
I have recently set up a tabs Ionic 8 project to try out the new features. I have added Capacitor to the project and want to test out Live Reload with Android. While building and running the app on Android without Live Reload works, doing so with Live Reload enabled gives me either one of two results. This is with an Android emulator and hardware device. I get a “Webpage not available” WebView displayed with various errors like net::ERR_EMPTY_RESPONSE, net::ERR_CONNECTION_RESET, or net::ERR_SOCKET_NOT_CONNECTED:
I get a similar error page when I try to open the same private IP and port in a web browser on the same host machine:
I have tried clearing out my node_modules, www, and android folders and rebuilt multiple times. Here is the output of ionic info:
Ionic:
Ionic CLI : 7.2.0 (/Users/user/.nvm/versions/node/v20.12.2/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.0.1
@angular-devkit/build-angular : 17.3.6
@angular-devkit/schematics : 17.3.6
@angular/cli : 17.3.6
@ionic/angular-toolkit : 11.0.1
Capacitor:
Capacitor CLI : 6.0.0
@capacitor/android : 6.0.0
@capacitor/core : 6.0.0
@capacitor/ios : 6.0.0
Utility:
cordova-res : 0.15.4
native-run : 2.0.1
System:
NodeJS : v20.12.2 (/Users/user/.nvm/versions/node/v20.12.2/bin/node)
npm : 10.5.0
OS : macOS Unknown
capacitor.config.js:
import type { CapacitorConfig } from '@capacitor/cli';
const config: CapacitorConfig = {
appId: 'com.app.name',
appName: 'AppName',
webDir: 'www/browser'
};
export default config;
angular.json:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"app": {
"projectType": "application",
"schematics": {
"@ionic/angular-toolkit:page": {
"styleext": "scss",
"standalone": true
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"outputPath": "www",
"index": "src/index.html",
"polyfills": ["src/polyfills.ts"],
"tsConfig": "tsconfig.app.json",
"inlineStyleLanguage": "scss",
"assets": [
{
"glob": "**/*",
"input": "src/assets",
"output": "assets"
}
],
"styles": ["src/global.scss", "src/theme/variables.scss"],
"scripts": [],
"browser": "src/main.ts"
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"outputHashing": "all"
},
"development": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
},
"ci": {
"progress": false
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"buildTarget": "app:build:production"
},
"development": {
"buildTarget": "app:build:development"
},
"ci": {
"progress": false
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"buildTarget": "app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"inlineStyleLanguage": "scss",
"assets": [
{
"glob": "**/*",
"input": "src/assets",
"output": "assets"
}
],
"styles": ["src/global.scss", "src/theme/variables.scss"],
"scripts": []
},
"configurations": {
"ci": {
"progress": false,
"watch": false
}
}
},
"lint": {
"builder": "@angular-eslint/builder:lint",
"options": {
"lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
}
}
}
}
},
"cli": {
"schematicCollections": ["@ionic/angular-toolkit"],
"analytics": false
},
"schematics": {
"@ionic/angular-toolkit:component": {
"styleext": "scss"
},
"@ionic/angular-toolkit:page": {
"styleext": "scss"
},
"@angular-eslint/schematics:application": {
"setParserOptionsProject": true
},
"@angular-eslint/schematics:library": {
"setParserOptionsProject": true
}
}
}
Warning message in output of ionic build:
Output location: /Users/user/AppName/www
Application bundle generation complete. [7.563 seconds]
▲ [WARNING] The glob pattern import("./**/*.entry.js*") did not match any files [empty-glob]
node_modules/@stencil/core/internal/client/index.js:2749:2:
2749 │ `./${bundleId}.entry.js${BUILD24.hotModuleReplacement && hmrVe...
╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
▲ [WARNING] 20 rules skipped due to selector errors:
:host-context([dir=rtl]) .ion-float-start -> Unknown pseudo-class :host-context([object Object])
.ion-float-start:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-end -> Unknown pseudo-class :host-context([object Object])
.ion-float-end:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-sm-start -> Unknown pseudo-class :host-context([object Object])
.ion-float-sm-start:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-sm-end -> Unknown pseudo-class :host-context([object Object])
.ion-float-sm-end:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-md-start -> Unknown pseudo-class :host-context([object Object])
.ion-float-md-start:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-md-end -> Unknown pseudo-class :host-context([object Object])
.ion-float-md-end:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-lg-start -> Unknown pseudo-class :host-context([object Object])
.ion-float-lg-start:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-lg-end -> Unknown pseudo-class :host-context([object Object])
.ion-float-lg-end:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-xl-start -> Unknown pseudo-class :host-context([object Object])
.ion-float-xl-start:dir(rtl) -> Unknown pseudo-class :dir
:host-context([dir=rtl]) .ion-float-xl-end -> Unknown pseudo-class :host-context([object Object])
.ion-float-xl-end:dir(rtl) -> Unknown pseudo-class :dir
A bit more info is that I have switched to ESBuild for Angular as recommended by the Ionic VSCode extension. I believe ESBuild changes the webapp build directory from www to www/browser, so I wonder if that’s related. Maybe the Live Reload feature is not properly finding the index.html in the new location. If there is any more info I can provide, please let me know.
↧
Plugin development
Hi,
We have a mobile library (Android and iOS) and we also have a JS library, now we have an App developer who wants to integrate our library into his App, the App is built using Capacitor framework, so I checked the docs and some topics in here in the forum and what I understood is that we should build a custom plugin which will call the native SDKs directly, but while I was working on this plugin I discovered that Android opens to a certain URL based on this configurations,
{
"appId": "com.xxx.yyy,
"appName": "XXX-App",
"bundledWebRuntime": false,
"webDir": "build",
"server": {
"url": "http://192.168.28.43:8100"
}
}
this URL I guess represents the website in a mobile view, so now I’m a little bit confused, should we integrate our JS library directly into the Capacitor App or should we build a custom plugin that is a wrapper around the native SDK.
Note: I’m a native mobile developer.
Thanks in advance.
↧
↧
Experiencing errors lately?
I got some questions regarding some errors I’ve started to see recently does anyone experiencing the same. This seems to have happened after updating xCode but I’m not really sure since I usually use the run iOS command in CLI and the app works so I never noticed.
Only on psychical devices:
→ nw_application_id_create_self NECP_CLIENT_ACTION_GET_SIGNED_CLIENT_ID [80: Authentication error] // Anybody knows what this mean? Seems to be due to iOS beta since i got two one beta and one without and the one with out does not have this.
→ Failed to resolve host network app id // Anybody knows what this mean? Seems to be due to iOS beta since i got two one beta and one without and the one with out does not have this.
→ Warning: -[BETextInput attributedMarkedText] is unimplemented
→ Failed to request allowed query parameters from WebPrivacy. // Anybody knows what this mean?
↧
More Pages to Explore .....
