Git Product home page Git Product logo

Comments (6)

a-sully avatar a-sully commented on August 13, 2024

Given the following code:

let root = await navigator.storage.getDirectory();
let fileHandle = await root.getFileHandle('image.png', { create: true });
let file = await fileHandle.getFile();
console.log(file.type);

The latest stable versions of the major browsers logs:

  • Safari: 'image/png'
  • Chrome: 'image/png'
  • Firefox: ''

So we should probably either:

  • use some dummy value (as Firefox seems to always do), or
  • create an algorithm which infers the mime type from the file extension (as Safari and Chrome seem to always do)

It seems like the latter algorithm should exist anyways in https://w3c.github.io/FileAPI/. That
the Blob spec doesn't give any indication as to how a Blob's type is inferred is a known problem: w3c/FileAPI#43 (comment)

The Blob spec does give file type guidelines, which are supposed to apply only to "real" files on disk. In practice, it seems like these guidelines are applied to more than just "real" files, though (at least on Safari/Chrome).

One option is to point the getFile() algorithm in to those guidelines for now - which would still technically mean the type is implementation-defined, though by a specific well-established procedure - and then once w3c/FileAPI#43 is resolved (perhaps by defining a mapping of file extension to mime type, as proposed in w3c/FileAPI#51?) re-use that algorithm here?

curious if others have thoughts @jesup @szewai @inexorabletash @mkruisselbrink

from fs.

a-sully avatar a-sully commented on August 13, 2024

FWIW it looks like drag-and-drop for files uses "application/octet-stream" as a default value

The only restriction seems to be that it must be ASCII lowercase, but otherwise is just refers to the (unhelpful) File spec

from fs.

annevk avatar annevk commented on August 13, 2024

The problems with type are a bit separate from this problem I think (at least those discussed in File API issue 43). I don't think the actual MIME type is inferred at the moment for File objects, except when they come from disk. Can you give a counter example?

from fs.

a-sully avatar a-sully commented on August 13, 2024

I don't think the actual MIME type is inferred at the moment for File objects, except when they come from disk. Can you give a counter example?

let root = await navigator.storage.getDirectory();
let fileHandle = await root.getFileHandle('image.png', { create: true });
let file = await fileHandle.getFile();
console.log(file.type);

This still logs 'image/png' in Chrome in incognito mode, when the "file" is in-memory. I don't have all the historical context here (@inexorabletash please feel free to chime in), but my guess is that this behavior (i.e. inferring mime types for File objects based on the extension, regardless of whether the file is on disk) has been in place in Chromium at least since earlier APIs like webkitRequestFileSystem().

from fs.

inexorabletash avatar inexorabletash commented on August 13, 2024

FWIW, our mapping: https://source.chromium.org/chromium/chromium/src/+/main:net/base/mime_util.cc

See also: w3c/FileAPI#51

Decisions about where in the processing to apply the mapping predate me, so definitely before the WebKit/Blink split.

from fs.

annevk avatar annevk commented on August 13, 2024

@a-sully that is an example using File System, against which I reported this issue. 😊 If this also exists with just the File object I agree we can say it's a larger problem, but if it only surfaces here we should tackle it. And to be clear, I mean outside of <input type=file> or drag & drop from the OS, as in those cases there clearly is a type of sorts.

from fs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.