cordova-plugin-nativeaudio icon indicating copy to clipboard operation
cordova-plugin-nativeaudio copied to clipboard

Where is the 'www' path?

Open leafiy opened this issue 3 years ago • 9 comments

I'm using capacitorjs, the only www folder I can found in the whole project is 'src-capacitor/www'. But its not work. So where should I put my audio files?

leafiy avatar Dec 05 '20 20:12 leafiy

Try to put your audio files in your-project/src/assets and after building, your must have a new folder in the root of your project named www where the assets folder and its content will be copied.

Maraaghib avatar Dec 21 '20 22:12 Maraaghib

@leafiy - did you get this to work? I spend hours already, but I'm not getting anywhere. I found a hardcoded www directory (hmmm) in the sourcecode, but my build doesn't create a www dir. see: https://github.com/floatinghotpot/cordova-plugin-nativeaudio/blob/8407c8c9b3264d363545b5553217119b93810fa5/src/android/NativeAudio.java#L85

The tip from @Maraaghib didn't make any difference. Also when I add a www dir it still can't find the asset. So apparently this www dir is expected somewhere else. If I use a url, as described in the docs, it still puts www in front of it, because of it being hardcoded: www/http:// etc

NativeAudio.preloadSimple("ballbounce", "assets/audio/basketball.mp3")
Line 1 - Msg: Error loading sound: java.io.FileNotFoundException: www/assets/audio/basketball.mp3

I have put the file in src/assets/audio and in public/assets/audio. I would expect the latter to be correct, I would expect public to be 'www' - it is correct for other assets like images and fonts.

I'm using ionic/capacitor and Vue 3 - did anyone get this to work in that setting?

  • @ionic-native/native-audio: ^5.32.0
  • @ionic/vue: ^5.4.0

micksp avatar Apr 18 '21 13:04 micksp

Hello @micksp, I had the same problem as you. I am using capacitor 3, ionic 5, vue 3 in my project. I fork a repository in which I removed www from the asset path and now everything works correctly on android and ios

Configuration example:

  1. You need to place your audio folder in the public folder in the root of the ionic project
  2. Remove cordova-plugin-nativeaudio from package.json
  3. You need to install: npm install cordova-plugin-nativeaudio2 npm install @ionic-native/native-audio ionic cap sync

Example how to use in vue 3:

<script lang="ts">
import {NativeAudio} from '@ionic-native/native-audio';

export default defineComponent({
  name: 'App',
  setup() {
    NativeAudio.preloadSimple('sound', 'public/audio/you_sound.wav').then((data) => {
      console.log('success', data);
    },
    (data) => {
      console.log('error', data);
    });
  }
});
</script>

Sitronik avatar Aug 20 '21 08:08 Sitronik

Thanks @Sitronik - In the meantime I have ported my app to Flutter/Dart.

micksp avatar Aug 21 '21 07:08 micksp

Thanks @Sitronik - In the meantime I have ported my app to Flutter/Dart.

Understood 👍
I ended up using this plugin because there were problems with the buttons to decrease and increase the sound on ios

Sitronik avatar Aug 21 '21 09:08 Sitronik

Hello @micksp, I had the same problem as you. I am using capacitor 3, ionic 5, vue 3 in my project. I fork a repository in which I removed www from the asset path and now everything works correctly on android and ios

Configuration example:

  1. You need to place your audio folder in the public folder in the root of the ionic project
  2. Remove cordova-plugin-nativeaudio from package.json
  3. You need to install: npm install cordova-plugin-nativeaudio2 npm install @ionic-native/native-audio ionic cap sync

Example how to use in vue 3:

<script lang="ts">
import {NativeAudio} from '@ionic-native/native-audio';

export default defineComponent({
  name: 'App',
  setup() {
    NativeAudio.preloadSimple('sound', 'public/audio/you_sound.wav').then((data) => {
      console.log('success', data);
    },
    (data) => {
      console.log('error', data);
    });
  }
});
</script>

Hello, where would I put my audio folder in angular for it to work with your fork ? Right now Im setting them on assets/audio but its not working

Frtrillo avatar Oct 31 '21 17:10 Frtrillo

  1. You need to place your audio folder in the public folder in the root of the ionic project

You need to place your audio folder in the public folder in the root of the ionic project

It work correct on vue ionic project, on angular not tested

Sitronik avatar Oct 31 '21 17:10 Sitronik

I ended up using the Web Audio API instead: https://developer.mozilla.org/en-US/docs/Web/API/HTMLAudioElement

Might not be suitable for everyone, but in my case this worked fine.

demianh avatar Nov 03 '21 22:11 demianh

In ionic 6 + capacitor 4 in file

https://github.com/floatinghotpot/cordova-plugin-nativeaudio/blob/8407c8c9b3264d363545b5553217119b93810fa5/src/android/NativeAudio.java#L85

change www with public.

 String fullPath = "public/".concat(assetPath);

And audio should load fine.

konum avatar Dec 07 '22 17:12 konum