Android: https response returns capacitor.js javascript

Capacitor
1

Hi all!
I am migrating a Cordova project to Capacitor. While iOS went flawlessly, I have issues with HTTPS requests at Android. Basically, when I do any https request, I get 200 with Capacitor-related javascript content. Looks like it failed somewhere at local Capacitor js-native bridge and returns 200 with this javascript file as response body:

<!doctype html><html><head>
<script type="text/javascript">window.Capacitor = { DEBUG: true, isLoggingEnabled: true, Plugins: {} };

window.WEBVIEW_SERVER_URL = 'https://api.mydomain.com';


/*! Capacitor: https://capacitorjs.com/ - MIT License */
/* Generated File. Do not edit. */

const nativeBridge = (function (exports) {
    'use strict';

    // For removing exports for iOS/Android, keep let for reassignment
    // eslint-disable-next-line
    let dummy = {};
    const initBridge = (w) => {
        const getPlatformId = (win) => {
            var _a, _b;
            if (win === null || win === void 0 ? void 0 : win.androidBridge) {
                return 'android';
            }
            else if ((_b = (_a = win === null || win === void 0 ? void 0 : win.webkit) === null || _a === void 0 ? void 0 : _a.messageHandlers) === null || _b === void 0 ? void 0 : _b.bridge) {
                return 'ios';
            }
            else {
                return 'web';
            }
        };
 ...

The response headers are:

Client-Via: shouldInterceptRequest
Content-Length: 25358
Content-Type: text/html

The request dumped with Chrome inspector:

  -H 'User-Agent: Mozilla/5.0 (Linux; Android 9; HTC U11 Build/PQ2A.190205.003; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/94.0.4606.61 Mobile Safari/537.36' \
  -H 'Referer: https://api.mydomain.com/search/form' \
  --compressed

Of course, the same request executed from terminal works fine. The same thing happens for any request executed on Android.

What have I already tried?

  1. android:usesCleartextTraffic=“true” in Android Manifest
  2. android:networkSecurityConfig="@xml/network_security_config" along with the following content:
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">mydomain.com</domain>
    </domain-config>
</network-security-config>
  1. Extended capacitor config with server.allowNavigation: ["*.mydomain.com"]
  2. Extended capacitor config with android.allowMixedContent:true

My current capacitor.config.json (for server object) is:

"server": {
		"hostname": "api.mydomain.com",
		"iosScheme": "httpsionic",
		"androidScheme": "https",
		"allowNavigation": [
			"*.mydomain.com"
		]
	},

Do you have any idea what happened here? The same www bundle works fine for the iOS app with httpsionic scheme. On android I’m using https.

2

I’ve managed to solve it.

The reason why it failed was “hostname” was the same as api which my web content called to.
Capacitor’s WebViewLocalServer.java injected this javascript code, because it determined that I’m trying to load something local (since the hostname matched the hostname from Capacitor config).
Now I’m calling api.mydomain.com from mydomiain.com hostname.

Hope it helps other folks!

2 Likes
3

I’m having the same problem, but I can’t change the application’s domain and, if I change the hostname, it gives a COSR error, do you have any other suggestions?

1 Like
4

Either fix the CORS error or try the new official Capacitor HTTP plugin.

1 Like
5

That’s the problem, I can’t fix the CORS error, because we use a company’s own framework, there’s no way to change the permissions.