Meteor mobile-config.js accessRule not working - ios

I am getting a whitelist error when running my app on the iOS simulator. This is my mobile-config.js file which is located in client/js/mobile-config.js
App.info({
id: 'com.example.matt.uber',
name: 'über',
description: 'Get über power in one button click',
author: 'Matt Development Group',
email: 'contact#example.com',
website: 'http://example.com'
});
// Set up resources such as icons and launch screens.
App.icons({
'iphone': 'icons/icon-60.png',
'iphone_2x': 'icons/icon-60#2x.png',
// ... more screen sizes and platforms ...
});
App.launchScreens({
'iphone': 'splash/Default~iphone.png',
'iphone_2x': 'splash/Default#2x~iphone.png',
// ... more screen sizes and platforms ...
});
App.accessRule('*');
But the access rule doesn't update cordova's automatically generated config.xml file with the new accessRule.
UPDATE:
I moved the config-mobile.js to the root directory of my meteor project. Now the config.xml is being updated with the "*" access rule. BUT I still get a whitelist rejection error in the simulator. Please help!

Try adding access rules only as needed:
App.accessRule('https://*.cloudfront.net/*');
App.accessRule('https://pbs.twimg.com/*');
Also prefer using of https over http.

Related

Ionic capacitor/cordova blank screen

i've got a long issue with ionic. I tried to run through an emulator but all i got is a blank screen. Even with the default tabs app you get with ionic start
I've seen few answers talking about the capacitor config file but mine look like this.
const config: CapacitorConfig = {
appId: 'io.ionic.starter',
appName: 'test-ios',
webDir: 'www',
bundledWebRuntime: false
};
export default config;
with webDirpointing to wwwlike it seems to be good for many people.

Quasar hot reloading issue

Hi I am using Quasar CLI with latest Quasar downloaded yesterday in Windows 10. I have some issues with hot reloading highlighted here: https://www.loom.com/share/3137f7ac86974af78a222a207b7c375e, what is the problem?
So in my case after connecting with Safari to Developer and triggering the problem.
The vendor.js and app.js are loading from wrong URL path such as "account/vendor.js" when it should be "vendor.js".
The index.html should put a / before these perhaps.
Could be due to using routing without the # symbol?
quasar.conf.js has this in the build options.
vueRouterMode: 'history', // available values: 'hash', 'history'
But with the index.html that I can see generated it puts the url as js/app.js and js/vendor.js...
Fix for me was to set these in the devServer and build in quasar.conf.js
It's probably appBase that "fixed it". but this could break other things I suppose depending on how the urls are structured.
// Full list of options: https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer
devServer: {
historyApiFallback: true
// ...
},
// Full list of options: https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-build
build: {
appBase: '/',
publicPath: '/',
vueRouterBase: '/',
vueRouterMode: 'history', // available values: 'hash', 'history'
// ...
}

Ionic 5 capacitor/angular preview files from external url's

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).

'meteor build', cordova - error for ios platform

I am trying to build my hello app (works on a web browser) for mobile platforms. I ran the command 'meteor build ../mobile/hello --server=localhost:3000' on the terminal. The build process for Android was successful but not for iOS.
Does anyone know what the issue could be?
Error:
=> Errors executing Cordova commands:
While preparing Cordova project for platform iOS:
Error: ENOENT: no such file or directory, open
'/Users/John/apps/hello/.meteor/local/cordova-build/platforms/ios/hello.xcodeproj/project.pbxproj'
I searched on google and some suggest it could be an issue with mobile-config.js file. I already checked that file and it seems ok.
// This section sets up some basic app metadata, the entire section is optional.
App.info({
id: 'com.example.hello',
name: 'hello',
description: 'hello',
author: 'John',
email: 'contact#example.com',
website: 'http://example.com'
});
// Set up resources such as icons and launch screens.
App.icons({
'iphone': 'icons/phone.png',
'iphone_2x': 'icons/phone2.png'
// More screen sizes and platforms...
});
App.launchScreens({
'iphone': 'splash/anotherPhone.png',
'iphone_2x': 'splash/anotherPhone2.png'
// More screen sizes and platforms...
});
// Set PhoneGap/Cordova preferences.
App.setPreference('BackgroundColor', '0xff0000ff');
App.setPreference('HideKeyboardFormAccessoryBar', true);
App.setPreference('Orientation', 'default');
App.setPreference('Orientation', 'all', 'ios');
// Pass preferences for a particular PhoneGap/Cordova plugin.
App.configurePlugin('com.phonegap.plugins.facebookconnect', {
APP_ID: '1234567890',
API_KEY: 'supersecretapikey'
});
// Add custom tags for a particular PhoneGap/Cordova plugin to the end of the
// generated config.xml. 'Universal Links' is shown as an example here.
App.appendToConfig(`
<universal-links>
<host name="localhost:3000" />
</universal-links>
`);
Delete from your project the folder /.meteor/local
launch Meteor again
Warning: you will loose your DataBase (it is located inside the local folder)
Tks #ghybs for the solution. I encountered the same issue and worked perfectly fine for me.

How to add launch image to a Sencha Touch 2 app?

The iOS guideline requires launch image for all apps. To my understanding, that's a "default.png" file located in the root folder of your app.
I packaged my app using Sencha CMD v3 and I don't see any launch image while loading.
There are some default launch images located in root/webapp/resources/loading/ folder but they are not showed in my app. Any idea?
The "startupImage" seems only appliable to the app added to the home screen, anyway, here is a part of my app.js:
startupImage: {
'320x460': 'resources/startup/320x460.jpg',
'640x920': 'resources/startup/640x920.png',
'768x1004': 'resources/startup/768x1004.png',
'748x1024': 'resources/startup/748x1024.png',
'1536x2008': 'resources/startup/1536x2008.png',
'1496x2048': 'resources/startup/1496x2048.png'
}
Added related posts:
[2.1] Splash screen is white on startup on Android and iOS
I have this at the beginning of my application - I'm not packaging it for iOS, but this seems like what you may need:
Ext.require([
'Ext.XTemplate',
'Ext.Panel',
'Ext.Button',
'Ext.List'
]);
// Main application entry point
Ext.application({
phoneStartupScreen: 'images/sencha_logo.png',
name: 'Analytics',
// setup our MVC items
Here is a handy-dandy link to the api doc on this:
http://docs.sencha.com/touch/2-0/#!/api/Ext.app.Application-cfg-phoneStartupScreen
For launch image you need to modify the index.html in your app directory. In here you will find a div with id appLoadingIndicator inside body tag. In my application I have replaced the content of #appLoadingIndicator with an img tag which refers to my splash image.
<div id="appLoadingIndicator">
<img src="resources/images/splash.png" />
</div>
For customizing the css you might want to remove the default embedded styles in index.html present in style tag inside the head tag which are applied to #appLoadingIndicator.
Now add your custom css and you will have your splash image ready.

Resources