capacitorquasar-frameworknodejs-express-server

cant fetch data in capacitor mode

i'm struggling with capacitor. im have a quasar project and i somehow want to try this in capacitor.

after following the documentation. i am able to run my app in an android device in android studio. but the problem is most the data is not being fetch in the app.

but in the web app which is running in the browser there's no problem at all.

this is the image that is working in web app. enter image description here

and this is the one in the android

enter image description here

and additional info the express server which has the server.js handles the fetching to to Api of respected source. in web app in order to make the data load i need to run node server.js

i think when running the quasar dev -m capacitor -T android

the server running in web app should also run in the android. i think...

please someone help or suggest.

this is the capacitor.config.json

{
    "appId": "com.nutrivue.www",
    "appName": "NutriVue",
    "webDir": "www",
    "server": {
        "url": "http://192.168.1.148:8080"
    }
}

and AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android">

    <application
        android:usesCleartextTraffic="true"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

        <activity
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode"
            android:name=".MainActivity"
            android:label="@string/title_activity_main"
            android:theme="@style/AppTheme.NoActionBarLaunch"
            android:launchMode="singleTask"
            android:exported="true">

            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>

        </activity>

        <provider
            android:name="androidx.core.content.FileProvider"
            android:authorities="${applicationId}.fileprovider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/file_paths"></meta-data>
        </provider>
    </application>

    <!-- Permissions -->

    <uses-permission android:name="android.permission.INTERNET" />
</manifest>
Solution

  • Hello guys i found a solution. we just need to add this part

    xmlns:tools="http://schemas.android.com/tools" in manifest

    tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" in application

    <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"  xmlns:tools="http://schemas.android.com/tools">

    <application
        android:usesCleartextTraffic="true"
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme"
        tools:targetApi="28"
        tools:ignore="GoogleAppIndexingWarning"
        >

        <activity
            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|smallestScreenSize|screenLayout|uiMode"
            android:name=".MainActivity"
            android:label="@string/title_activity_main"
            android:theme="@style/AppTheme.NoActionBarLaunch"
            android:launchMode="singleTask"
            android:exported="true">

            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>

        </activity>

        <provider
            android:name="androidx.core.content.FileProvider"
            android:authorities="${applicationId}.fileprovider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/file_paths"></meta-data>
        </provider>
    </application>

    <!-- Permissions -->

    <uses-permission android:name="android.permission.INTERNET" />
</manifest>

    adb reverse tcp:8081 tcp:8081 adb reverse tcp:3000 tcp:3000

    The first command maps port 8081 (used by the Metro Bundler) between your device and your local machine. The second command maps port 3000 (used by your Express server) between your device and your machine.