Chrome 扩展程序中未显示另存为对话框

Posted

技术标签:

【中文标题】Chrome 扩展程序中未显示另存为对话框【英文标题】:Save As Dialog not showing in Chrome Extension 【发布时间】:2021-05-05 08:41:48 【问题描述】:

我正在为我的同事和我自己开发 chrome 扩展程序。目标是通过单击 behance.net 上的按钮下载单个图像。

问题是我的一些同事使用“下载前询问每个文件的保存位置”选项,因此代码对他们不起作用。我不使用这个选项,所以下载对我来说是成功的。

我尝试为 chrome.downloads.download() 设置不同的选项,但我一无所获。 “另存为”对话框未显示。

清单


"name": "Begrab",
"description": "Download pics right from Behance",
"version": "1.0",
"manifest_version": 3,
"background": 
    "service_worker": "background.js"
  ,
"permissions": ["activeTab", "downloads","tabs", "background"],

"content_scripts": [
  
    "matches": ["https://*.behance.net/*"],
    "run_at": "document_end",
    "css": ["content.css"],
    "js": ["content.js"]
  
]

content.js

window.setTimeout(()=> 
    codeRun();
, 1000)

let projectLinks = document.querySelectorAll('.ProjectCoverNeue-coverLink-102') 

Array.from(projectLinks).forEach(projectLink => 
    projectLink.addEventListener('click', function()
        window.setTimeout(()=> 
            codeRun();
        , 4000)
        
    )
)

function codeRun() 
    let imageParents = document.querySelectorAll('.js-project-lightbox-link');

    Array.from(imageParents).forEach(imageParent => 
        let button = document.createElement('a'),
            buttonCopy = document.createElement('a'),
            buttonsWrap = document.createElement('div'),
            img = imageParent.querySelector('img'),
            controls = imageParent.querySelector('.project-module__actions');

            if(img) 
                button.innerText = "Download";
                button.className = "begrab__btn";
                buttonsWrap.className = "begrab__wrap";

                buttonsWrap.appendChild(button);
                imageParent.appendChild(buttonsWrap)

                button.addEventListener('click', (e) => 
                    let param = src: img.src,
                    fileName: window.location.href;
                    e.stopPropagation()

                    chrome.runtime.sendMessage(param);
                );
            
    );


background.js

chrome.runtime.onMessage.addListener(
  function(arg, sender, sendResponse) 

  if(arg.src)
    
    chrome.downloads.download(
      url: arg.src,
      conflictAction: "prompt"
      , function (downloadId) 
        console.log(downloadId);
    );
  
  
);

有人遇到过同样的问题吗?希望有人能帮助我。谢谢!

【问题讨论】:

【参考方案1】:

经过一些调试,我发现用户出于某种原因取消了下载。

onChanged 事件输出以下内容:


    "error": 
        "current": "USER_CANCELED"
    ,
    "id": 1,
    "state": 
        "current": "interrupted",
        "previous": "in_progress"
    

我能够让它工作的唯一方法是将清单降级到 v2:


    "manifest_version": 2,
    "background": 
        "persistent": true,
        "scripts": [
            "background.js"
        ]
    

我不知道这是否适合你。

【讨论】:

哇!谢谢你的帮助!你真的在我的工作中帮助了 10 个人。 :D 很高兴我能帮上忙 ;)

以上是关于Chrome 扩展程序中未显示另存为对话框的主要内容,如果未能解决你的问题,请参考以下文章

程序中的对话框应用- ”另存为“对话框

如何在“另存为”对话框中强制使用正确的文件扩展名? (.jpg 而不是 .php)

如何使用 javascript 将默认文件扩展名放在另存为对话框中?

不考虑另存为文件类型的另存为通用文件对话框

让 Chrome 扩展程序下载文件

怎么把浏览器的网页另存为mht格式的