Get Absolute Path of Asset Image in Ionic 2 RC 0+

I’ve searched for this for quite some time and I haven’t been able to find a solution.

Here is the scenario: I have multiple avatar images that I want a user to be able to select from. Once they select their avatar image, I need to send it, as a binary file, to an API.

The problem: The path to the avatar is just relative ( assets/img/avatar-1.jpg ). So, when I attempt to upload it to an API ( using the Transfer module from ionic-native ), I get an error saying “no such file or directory exists” because it’s trying to upload the image thinking that assets/img/avatar-1.jpg is the absolute path.

So, what I think I need to do, is utilize the File module ( also from ionic-native ) and its cordova.file.* paths. The problem is that I don’t have any idea which of these cordova.file.* paths the src/assets/img directory would be found in. Furthermore, I don’t really know how I would go about searching them. Another problem is that I need to be able to find these absolute paths in iOS and Android. And they may have different cordova.file.* paths to get to the src/assets directory.

Has anyone run into a similar situation where they need to get the absolute path of a file in the assets directory of an Ionic project?

Or is there a better solution? All I really want to do is be able to send a file from my project’s assets directory to an API as a binary file.

1 Like

I am facing the same issue. Any ideas ?

The assets resources are within your application’s binary (ex.: on Android you have an .apk), in order to access this kind of resource from the file system, first you need to extract these files from the application binary.

If you know how to create an Ionic plugin you could do something like this (Android only):

AssetManager assetManager = getAssets();
String[] files = assetManager.list("");
InputStream input = assetManager.open(assetName);

Good luck =)

If you don’t get any better answers, I would look into using data URIs. I’ve found them to avoid lots of hassle of slinging images around.

rapropos, can you give an example?

Unfortunately, I was never able to find an ideal solution for this issue.

So my workaround that I used was just hosting the images on a server where each image has its own URL. Then, the user selects one of those images and I download it. By downloading it, I’m able to get an absolute URL for the image in the device and I’m then able to upload the image as a binary to the API.

It’s not a great solution, but it works. Hopefully someone comes along with a really solid one.

1 Like