starred/audiobookshelf
1
0
Fork 0
mirror of https://github.com/advplyr/audiobookshelf.git synced 2026-05-30 23:40:40 +02:00
Code Issues 1.0k Packages Projects Releases 10 Wiki Activity

[PR #3632] [MERGED] on iOS, do not restrict file types for upload #4042

New Issue
Closed
opened 2026-04-25 00:18:05 +02:00 by adam · 0 comments
adam commented 2026-04-25 00:18:05 +02:00
Owner
Copy Link
Copy Source

📋 Pull Request Information

Original PR: https://github.com/advplyr/audiobookshelf/pull/3632
Author: @sevenlayercookie
Created: 11/21/2024
Status: ✅ Merged
Merged: 11/21/2024
Merged by: @advplyr

Base: master ← Head: master

📝 Commits (3)

  • fc5f35b on iOS, do not restrict file types for upload
  • 268fb2c on iOS, hide UI on upload page related to folder selection (since iOS Webkit does not support folder selection)
  • 1d4e699 Upload page UI updates for mobile

📊 Changes

3 files changed (+33 additions, -28 deletions)

View changed files

📝 client/mixins/uploadHelpers.js (+16 -16)
📝 client/pages/upload/index.vue (+16 -12)
📝 client/strings/en-us.json (+1 -0)

📄 Description

Brief summary

  1. On iOS, in the upload media screen of ABS, .m4b's are not selectable when using file extension or MIME-type accept filters for the file input HTML element. By disabling these filters on iOS-based browsers, m4b's are now selectable.
  2. In addition, iOS webkit does not support selecting folders for upload. Thus, on iOS, UI related to folders should be hidden on iOS browsers.

Which issue is fixed?

#2690

In-depth Description

On iOS, in the upload media screen of ABS, .m4b's are not selectable when using file extension or MIME-type accept filters for the file input HTML element. This holds true even when .m4b and audio/* are added to the accept filter. From what I can tell, iOS Webkit browser cannot determine MIME-type of .m4b files (related issue to #3310 ?), and iOS webkit file input only supports MIME-type filtering, not file extension filtering (caniuse.com). By disabling accept filters on iOS-based browsers, m4b's are now selectable.

  1. This PR includes a check for an iOS-based User Agent. If found, it disables file type check for upload. Otherwise, it filters file types per usual.
  2. second commit hides UI elements related to folder selection on iOS browsers. Adds a dictionary string to split "files" from "folders"

How have you tested this?

I have tested on iOS browsers (Chrome, Safari), as well as on my MacBook browsers (Chrome, Safari).

Screenshots

Before / non-iOS browsers:

After on iOS browsers:

Possible issues

This does allow iOS users to select any file type for upload, which will need to be handled by ABS. However it seems that ABS handles this already by ignoring incompatible files that are selected.

Room for improvement

There may be a different/more standard way of determining user agent (such as method used in #3319 ).
There may be a way to keep filters on iOS browsers, but I was unable to find a simple way to do this.

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/advplyr/audiobookshelf/pull/3632 **Author:** [@sevenlayercookie](https://github.com/sevenlayercookie) **Created:** 11/21/2024 **Status:** ✅ Merged **Merged:** 11/21/2024 **Merged by:** [@advplyr](https://github.com/advplyr) **Base:** `master` ← **Head:** `master` --- ### 📝 Commits (3) - [`fc5f35b`](https://github.com/advplyr/audiobookshelf/commit/fc5f35b3887044e057367331dbc384d12522db70) on iOS, do not restrict file types for upload - [`268fb2c`](https://github.com/advplyr/audiobookshelf/commit/268fb2ce9a29ff5acce81d030537141fca2a7bc1) on iOS, hide UI on upload page related to folder selection (since iOS Webkit does not support folder selection) - [`1d4e699`](https://github.com/advplyr/audiobookshelf/commit/1d4e6993fc09a954b150eeaed69156559cc892c8) Upload page UI updates for mobile ### 📊 Changes **3 files changed** (+33 additions, -28 deletions) <details> <summary>View changed files</summary> 📝 `client/mixins/uploadHelpers.js` (+16 -16) 📝 `client/pages/upload/index.vue` (+16 -12) 📝 `client/strings/en-us.json` (+1 -0) </details> ### 📄 Description <!-- For Work In Progress Pull Requests, please use the Draft PR feature, see https://github.blog/2019-02-14-introducing-draft-pull-requests/ for further details. If you do not follow this template, the PR may be closed without review. Please ensure all checks pass. If you are a new contributor, the workflows will need to be manually approved before they run. --> ## Brief summary 1. On iOS, in the upload media screen of ABS, .m4b's are not selectable when using file extension or MIME-type accept filters for the file input HTML element. By disabling these filters on iOS-based browsers, m4b's are now selectable. 2. In addition, iOS webkit does not support selecting folders for upload. Thus, on iOS, UI related to folders should be hidden on iOS browsers. <!-- Please provide a brief summary of what your PR attempts to achieve. --> ## Which issue is fixed? #2690 <!-- Which issue number does this PR fix? Ex: "Fixes #1234" --> ## In-depth Description <!-- Describe your solution in more depth. How does it work? Why is this the best solution? Does it solve a problem that affects multiple users or is this an edge case for your setup? --> On iOS, in the upload media screen of ABS, .m4b's are not selectable when using file extension or MIME-type accept filters for the file input HTML element. This holds true even when .m4b and audio/* are added to the accept filter. From what I can tell, iOS Webkit browser cannot determine MIME-type of .m4b files (related issue to #3310 ?), and iOS webkit file input only supports MIME-type filtering, **not** file extension filtering ([caniuse.com](https://caniuse.com/?search=file%20input)). By disabling accept filters on iOS-based browsers, m4b's are now selectable. 1. This PR includes a check for an iOS-based User Agent. If found, it disables file type check for upload. Otherwise, it filters file types per usual. 2. second commit hides UI elements related to folder selection on iOS browsers. Adds a dictionary string to split "files" from "folders" ## How have you tested this? <!-- Please describe in detail with reproducible steps how you tested your changes. --> I have tested on iOS browsers (Chrome, Safari), as well as on my MacBook browsers (Chrome, Safari). ## Screenshots **Before / non-iOS browsers:** <img src="https://github.com/user-attachments/assets/5de9f0c4-d0cb-4bda-a2c8-611b4c492e44" width="300"> **After on iOS browsers:** <img src="https://github.com/user-attachments/assets/4518b88c-9d3e-45bf-a2fc-23af4e3ba117" width="300"> <!-- If your PR includes any changes to the web client, please include screenshots or a short video from before and after your changes. --> ## Possible issues This does allow iOS users to select any file type for upload, which will need to be handled by ABS. However it seems that ABS handles this already by ignoring incompatible files that are selected. ## Room for improvement There may be a different/more standard way of determining user agent (such as method used in #3319 ). There may be a way to keep filters on iOS browsers, but I was unable to find a simple way to do this. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
adam added the pull-request label 2026-04-25 00:18:05 +02:00
adam closed this issue 2026-04-25 00:18:05 +02:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
authentication
backlog
bug
chapter editor
config-issue
ebooks
encoding/embedding
enhancement
help wanted
listening sessions & progress
planned
possible plugin
progress sync
pull-request
Mirrored from GitHub Pull Request
 sorting/filtering/searching
unable to reproduce
upload
users & permissions
waiting
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
adam (Adam Melkus)
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/audiobookshelf#4042
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?