Apache Cordova for android do not load resources

Question

I have created an Angular 2 application and I'm looking for creating an Android application with Apache Cordova. When I load the application in a Marshmallow emulator, the application does not load any of the declared resources. If I use the browser plugin it works as expected. Using Chrome to inspect the device's console reveals the following output.

Chrome console output:

If I run the Cordova initial sample it works in the same Android emulator so it has to be a problem with the sources. The code can be checked in the Github repository. The application is in the www directory, for testing it is necessary to add the android platform.

$ cordova platform add android
$ cordova run android

I can not found an answer for this problem:

• The resources looks fine - discard file path issues.
• The browser plugin works (Chrome) - discard application errors and security policies.
• The cordova sample works as expected for Android - discard environment errors.

Please, does anyone knows what is the problem with this setup?

Answer 1

I have found the root cause. The problem is that by using the angular-cli tool, the tag <base href="/"> is being added automatically. According to the tag documentation, it serves a base to resolve all the document's relative URLs.

For this use case, removing the base tag or configuring it to a valid value like <base href="/android_asset/www/"> fixes the problems. As I do not use routing features (yet) I feel more confortable removing it or setting a value like <base href="."/> that it's suitable for more platforms builds.