File upload plugin audio files issue

Topic: File upload plugin audio files issue

devtrix pro asked 2 years ago

I have the file data-mdb-accepted-extensions="audio/*", like this. It only works with .mp3, everything else it posts a null on the server. console.log shows the file's presence in the list. Also when I add .flac, .wav & .mp3, only the .mp3 gets posted. I use Asp.net core 6.0 in the back. For test purposes I just post the files to the server. Any ideas?

Michał Duszak staff commented 2 years ago

Here is a possible custom fix: https://mdbootstrap.com/support/standard/file-upload-plugin-accepted-extensions-error/

Add comment

Grzegorz Bujański staff answered 2 years ago

0 0 Best answer

Please insert min. 20 characters.

As @Michał Duszak wrote before, we are not able to reproduce this issue - therefore no fix has appeared. Check out this snippet sent by @Michał Duszak: https://mdbootstrap.com/snippets/standard/m-duszak/3957022#html-tab-view

There you will find the native file input and our File input plugin + submit button. Put a .flac or .wav file into our plugin and native input then hit submit. In the browser console, you will see two consol.logs with exactly the same results.

If you are able to modify this snippet to reproduce this issue or tell us what is missing here, we will be able to analyze it again. At the moment it looks like this is not a problem with our plugin.

Add comment

Michał Duszak staff answered 2 years ago

0 0 Best answer

Hello, there are now two aspects for this issue:

First, what should be done after cloning the webpack starter. <a href="https://github.com/mdbootstrap/mdb-webpack-starter" target="_blank" rel="nofollow">Readme</a> says that you will have to install your package, whether it's Advanced or Essential.
Example for advanced:

<pre class="prettyprint"><code>npm install git+https://oauth2:ACCESS_TOKEN@git.mdbootstrap.com/mdb/standard/mdb-ui-kit-pro-advanced
</code></pre>

Then you can download the mdb src code with <code>npm run getMDBsrc</code> so that you can edit files in the <code>mdb</code> catalog and build your custom mdb package with <code>npm run buildMDB</code>.

Second is that I have tried to reproduce this issue from before including this fix. .flac, .wav and .mp3 files work as expected - I reproduced them in the snippet: <a href="https://mdbootstrap.com/snippets/standard/m-duszak/3957022#html-tab-view" target="_blank">https://mdbootstrap.com/snippets/standard/m-duszak/3957022#html-tab-view</a>

You can try uploading files both from default input of file type, and from the MDB File Upload plugin - all the necessary informations are provided in both FileLists. If it works in the snippet, then it means that problems occur in the server-side or in the project's middlewares.

Please insert min. 20 characters.

Hello, there are now two aspects for this issue:

First, what should be done after cloning the webpack starter. Readme says that you will have to install your package, whether it's Advanced or Essential. Example for advanced:

npm install git+https://oauth2:ACCESS_TOKEN@git.mdbootstrap.com/mdb/standard/mdb-ui-kit-pro-advanced

Then you can download the mdb src code with npm run getMDBsrc so that you can edit files in the mdb catalog and build your custom mdb package with npm run buildMDB.

Second is that I have tried to reproduce this issue from before including this fix. .flac, .wav and .mp3 files work as expected - I reproduced them in the snippet: https://mdbootstrap.com/snippets/standard/m-duszak/3957022#html-tab-view

You can try uploading files both from default input of file type, and from the MDB File Upload plugin - all the necessary informations are provided in both FileLists. If it works in the snippet, then it means that problems occur in the server-side or in the project's middlewares.

devtrix pro commented 2 years ago

Perfect. I am going to attempt this. Can you post a link to how I can get the oath2 access token please? Visiting https://git.mdbootstrap.com/-/profile/personal_access_tokens, I am a bit unclear as to what options to take.

devtrix pro commented 2 years ago

Michał Duszak staff commented 2 years ago

Yes, simply choose a Token name (it's up to you), set the Expiration date (again, up to you) and the choose the scopes - you can select all of the available scopes. Then click on "Create personal access token" - you will be provided with an access token. Remember to keep it safe.

By the way - Have you tried uploading .flac, .wav and .mp3 files to your server using the default file input element? https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file

Please insert min. 15 characters.

devtrix pro commented 2 years ago

So I saw that this dint even get fixed in your 4.1.0 update. To answer your last question, no I didnt since I could use the HTML FileInput control directly which works. But how hard would it be for you guys to just fix it in and release an update?

Add comment

Michał Duszak staff answered 2 years ago

0 0 Best answer

Hello, thank you for your feedback. We will fix this issue as soon as possible.

devtrix pro commented 2 years ago

Are you kidding me? How do you guys get away with so many issues? This should have been caught during testing phase before release. Not only this is an issue, if one adds a comma separated list of acceptable extensions, it shows a red error box. My God fellows, get with the program. We buy library like yours to save our time. Please understand my frustration here.

Adam Jakubowski staff commented 2 years ago

Hi @devtrix,

We are very sorry for this situation and of course I understand your frustration. The above error will be fixed as soon as possible

Until then have you tried to use the solution that @Michał Duszak posted above? https://mdbootstrap.com/support/standard/file-upload-plugin-accepted-extensions-error/

Keep coding

Please insert min. 15 characters.

devtrix pro commented 2 years ago

https://mdbootstrap.com/docs/standard/getting-started/webpack-starter/#section-custom-version-of-mdb-ui-kit is very confusing. I have modified the file-upload.js like suggested. Given I have downloaded your files, What next?

Add comment