Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Where is the 'www' path? #168

Open
leafiy opened this issue Dec 5, 2020 · 9 comments
Open

Where is the 'www' path? #168

leafiy opened this issue Dec 5, 2020 · 9 comments

Comments

@leafiy
Copy link

leafiy commented Dec 5, 2020

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?

@Maraaghib
Copy link

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.

@micksp
Copy link

micksp commented Apr 18, 2021

@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:

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

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

@Sitronik
Copy link

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>

@micksp
Copy link

micksp commented Aug 21, 2021

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

@Sitronik
Copy link

Sitronik commented Aug 21, 2021

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

@Frtrillo
Copy link

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

@Sitronik
Copy link

Sitronik commented Oct 31, 2021

  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

@demianh
Copy link

demianh commented Nov 3, 2021

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.

@konum
Copy link

konum commented Dec 7, 2022

In ionic 6 + capacitor 4 in file

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

change www with public.

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

And audio should load fine.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants