Reputation: 5113
This is my current capacitor.config.ts
:
import { CapacitorConfig } from "@capacitor/cli";
const config: CapacitorConfig = {
appId: "test.app.id",
appName: "test_app_name",
webDir: "build",
bundledWebRuntime: false,
// remove for production
server: {
url: "http://10.0.8.4:2200", // the port on my PC hosting the React UI app
cleartext: true,
},
};
export default config;
The above config file is used when I am live testing using android emulator. The app emulator is paired with my Nokia G10 via Wifi and QR code scan.
I notice that if I leave the config file as it is and then bundle the app, release it for testing on the android add store, download it on my phone, it will still point to the React app running on my PC. If I turn off the React app on my PC, the actual downloaded and installed android app will error out.
If I want to actually bundle, publish, and install an independent version of the app running locally on my Android device, I would have to remove the server
property, like so:
import { CapacitorConfig } from "@capacitor/cli";
const config: CapacitorConfig = {
appId: "test.app.id",
appName: "test_app_name",
webDir: "build",
bundledWebRuntime: false,
};
export default config;
The problem with this is now the actual Android app will not be able to hit the backend API server, which is also running on my local PC. During the testing, the React app references localhost
to hit the backend server API.
But I tried to remove the local host and use the actual URL to my PC, like so in my package.json
file:
proxy: "http://10.0.8.4:2201", // 2201 is the port to the backend API
However, this doesn't work. The installed Android app running locally on my Nokia G10 will not be able to hit the backend API server running on my machine.
Question:
Since my android emulator on my machine is paired using QR code with my Nokia G10, why is it not able to hit my backend server running on my machine, when it is able to still hit the React UI app if I keep the server
property (above) in the capacitor.config.ts
file?
What is the fix?
EDITED:
I was able to hit the backend end API url on the chrome browser on my Nokia G10. So my Nokia G10 is not blocked by firewalls.
Upvotes: 0
Views: 24