个人中心
gpt4 book ai didi

Web Share API sharing files Permission Denied(Web共享API共享文件权限被拒绝)

转载 作者：bug小助手 更新时间：2023-10-25 17:43:48 28 4
gpt4 key购买 nike



I'm not sure what I'm doing wrong here, I think there should be more documentation or better error descriptions for this Web Share API.

我不确定我在这里做错了什么，我认为应该有更多的文档或关于这个Web Share API的更好的错误描述。


I'm trying to share the following file

我正在尝试共享以下文件


{
  lastModified: 1622843015507
  lastModifiedDate: Fri Jun 04 2021 16:43:35 GMT-0500 (Eastern Standard Time) {}
  name: "60b1d17b7f2cd71c8307fae2"
  size: 37835
  type: "image/png"
  webkitRelativePath: ""
}

using

使用


await navigator.share({
    text: 'TEST',
    files: [file],
  });

I've made sure that the type is a permitted type, but I keep getting DOMException: Permission denied. I really don’t understand what should I be looking for.

我已经确保该类型是允许的类型，但我一直收到DOMException：Permission Dened。我真的不知道我应该找什么。


更多回答
优秀答案推荐

I think the issue you're facing is the fact that your file name doesn't have an extension. Try adding .png to the file name, it should automagically work.

我认为您面临的问题是您的文件名没有扩展名。尝试将.png添加到文件名中，它应该会自动工作。


const file = new File(['hello'], 'hello.png', { type: 'image/png' });
await navigator.share({ files: [file] });


I had the same issue with a pdf file I had stored as a Blob. Kept getting the 'Permission Denied' error:

我存储为Blob格式的pdf文件也遇到了同样的问题。不断收到‘权限被拒绝’的错误：


 if (pdfBlob && pdfBlob.type && pdfBlob.type.startsWith('application/pdf')) {
        const fileName = report.id.toString(); 
        const file = new File([pdfBlob], fileName);        
        const files = [file];       
        if (navigator.canShare({files})) {                
            navigator.share({
                files: files,
            })
                .then(() => console.log('PDF shared successfully'))
                .catch(error => console.error('PDF sharing failed:', error));
        } else {
            console.log('PDF sharing is not supported in this browser.');
        }
    }
    else {
        console.error('Invalid Blob: Not a PDF file.');
    }

I was missing two things:

我错过了两件事：



  1. Adding the extension to the file name, like @François Beaufort said:
    "Try adding .png to the file name, it should automagically work."

  2. Including the proper file type as the third parameter, in my case: {type: 'application/pdf'}.


The end result:

最终结果是：


const file = new File([pdfBlob],  report.id.toString() + '.pdf', {type: 'application/pdf'});

This worked perfectly!

这真是太好了！



I see you have gotten some feedback on the issue that you raised already. Here is a concrete example that hopefully helps you get started:

我看到你已经就你已经提出的问题得到了一些反馈。这里有一个具体的例子，希望能帮助你开始：


if (navigator.canShare && navigator.canShare({ files: filesArray })) {
  navigator.share({
    files: filesArray,
    title: 'Vacation Pictures',
    text: 'Photos from September 27 to October 14.',
  })
  .then(() => console.log('Share was successful.'))
  .catch((error) => console.log('Sharing failed', error));
} else {
  console.log(`Your system doesn't support sharing files.`);
}

One way of getting a files array (the filesArray above) is through an <input type=files> element. See the official example for this.

获取文件数组(上面的文件数组)的一种方法是通过<输入类型=文件>元素。有关这一点，请参阅官方示例。


更多回答

28 4 0
文章推荐： replace specific line in file text(替换文件文本中的特定行)
文章推荐： How correctly integrate angular-froala-wysiwyg and codemirror v5 to edit code?(如何正确地集成角度-Froala-wysiwyg和codemirror v5来编辑代码？)
文章推荐： How can I make the queryset filter `or` conditions dynamically from the array?(如何使查询集从数组动态过滤`或`条件？)
文章推荐： Why do both fnmatch and glob exist?(为什么fnMatch和Globb都存在？)
bug小助手
个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章
滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com