CODEWITHSUNDEEP
javascriptnode.jsjsonpermissionsweb-share
Jamie Phan
Jamie Phan

Reputation: 876

Web Share API: Permission Denied on certain file type

I would like to share a JSON object as a file via the Web Share API.

However, when specifying the type as application/json, I got the DOMException: Permission denied Error:

navigator.share({
    files: [new File(["{}"], "test.json", {type: "application/json"})]
})

// Uncaught (in promise) DOMException: Permission denied

However, if I change the type to text/plain and the file name extension to .txt, it works as expected:

navigator.share({
    files: [new File(["{}"],"test.txt", {type: "text/plain"})]
})

// File share success

I would like to have it as a `JSON file to be shared instead.

Browser: Microsoft Edge (Chromium) 96.0.1054.43

Any helps would be appreciated.

Snippet Example:

const textbtn = () => {
  navigator.share({
      files: [new File(["{}"],"test.txt", {type: "text/plain"})]
  }).catch(e => alert(e.message))
}

const jsonbtn = () => {
  navigator.share({
      files: [new File(["{}"],"test.json", {type: "application/json"})]
  }).catch(e => alert(e.message))
}
<h1>WebShare Test<h1>

<button onclick="jsonbtn()">test.json | application/json</button>
<br />
<button onclick="textbtn()">text.text | text/pain</button>

Upvotes: 4

Views: 1250

Answers (2)

Marcel
Marcel

Reputation: 15722

Per this MDN documentation about shareable file types, the supported kinds of file type are only quite a few.

  • PDF
  • some audio files
  • some image files
  • some text files
  • some video files

The text files in particular are:

.css - text/css
.csv - text/csv
.ehtml - text/html
.htm - text/html
.html - text/html
.shtm - text/html
.shtml - text/html
.text - text/plain
.txt - text/plain

Unfortunately, JSON (application/json) is not among them, but txt (text/plain) is.

Depending on your scenario, you might want to consider sharing an URL to the file in question, via the URL parameter.

Upvotes: 2

DenverCoder9
DenverCoder9

Reputation: 2514

This is working as intended. You can see the list of supported file types in this document.

Upvotes: 2

Related Questions