Chrome打包应用程序-从Webview下载文件

2023-12-07

我正在努力让现有的 Ajax 风格的 Web 应用程序作为 Chrome 打包应用程序运行。 Ajax 应用程序在打包应用程序内的 Web 视图中运行,并且大部分运行良好。

Ajax 应用程序允许用户使用标准 HTML 5 上传和拖/放来上传文档。上传工作正常,但是下载不起作用.

这是 Ajax 应用程序中逻辑的简化示例。它使用Javascript来处理点击事件,执行一些逻辑,然后最终通过设置隐藏的IFrame的位置来触发下载。

<html>
<head>
  <script type="text/javascript">
  function downloadFile(url) {
    window.frames['dataTransfer'].location = url;
  }
  </script>
</head>
<body>
  <a href="http://www.google.com" target="_blank">Google</a><br/>
  <a href="https://s3.amazonaws.com/LYHKDevA1/2058e6cab4304af3a39eeb275eeac96d?response-content-disposition=attachment%3Bfilename%3D%22TestFile.pdf%22%3Bfilename*%3DUTF-8%27%27TestFile.pdf&Signature=FUlZZqNoJ%2F%2FvHIPX6CPDkvJ7uik%3D&Expires=1437854276&AWSAccessKeyId=1ZAN0NYFJ2DCQX8AN8G2" target="_blank">Download PDF</a><br/>
  <a href="#" onclick="downloadFile('https://s3.amazonaws.com/LYHKDevA1/2058e6cab4304af3a39eeb275eeac96d?response-content-disposition=attachment%3Bfilename%3D%22TestFile.pdf%22%3Bfilename*%3DUTF-8%27%27TestFile.pdf&Signature=FUlZZqNoJ%2F%2FvHIPX6CPDkvJ7uik%3D&Expires=1437854276&AWSAccessKeyId=1ZAN0NYFJ2DCQX8AN8G2');return false;" target="_blank">Download PDF JS</a><br/>
  <iframe name="dataTransfer" style="width: 0; height: 0; border: none;"></iframe><br/>
</body>
</html>

如果您在标准 Chrome 选项卡中运行此命令,则所有 3 个链接都可以正常工作。然而,在 Chrome 应用程序中,只有前 2 个链接有效 - 单击第三个链接不会执行任何操作。在开发人员工具的网络部分中,它实际上似乎开始下载,但很快就被取消了。

Chrome应用程序的清单允许Webview和涉及的相关域。

{
  "manifest_version": 2,
  "name": "Test Download",
  "version": "0.1.0",
  "permissions": [
    "webview",
    "<DOMAIN OF THE SAMPLE PAGE ABOVE>",
    "https://s3.amazonaws.com/"
  ],
  "app": {
    "background": {
      "scripts": ["background.js"]
    }
  },
  "icons": {},
  "minimum_chrome_version": "28"
}

Chrome 应用程序有一些简单的newwindow也在其中处理。

window.onload = function() {
  var webview = document.querySelector('#app-webview');
  webview.src = '<URL TO SAMPLE PAGE ABOVE>';
  webview.addEventListener('newwindow', function(e) {
    e.preventDefault();
    e.stopPropagation();
    window.open(e.targetUrl);
  });
};

关于如何让下载工作有什么建议(希望不需要对 Ajax 应用程序进行重大更改)?


从 webview 来宾下载文件由一个permissionrequest每次下载尝试的事件。默认响应是拒绝下载权限。

注意:下载权限请求现在要到 Chrome 30 才会落地,并且似乎尚未提供文档。不过,它通常是一个稳定的 API,并且从现在到那时都不太可能发生变化。

为了覆盖此行为,您需要处理该事件并明确允许下载发生。举个例子:

var webview = document.querySelector('#app-webview');
webview.addEventListener('permissionrequest', function(e) {
  if (e.permission === 'download') {
    e.request.allow();
  }
});

该事件包含附加信息(例如下载 URL)e.url)以防您想进一步过滤您的补助金。

请注意,这只会允许使用常规 Chrome 文件下载体验进行下载,这不一定是您在打包应用程序中想要的。您的选择有限,直到chrome.downloadsAPI可供应用程序使用。

一种可能性是拒绝下载请求,从事件中获取 URL,并使用 XHR、文件系统 API 以及您想要构建的任何 UX 手动管理下载过程。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Chrome打包应用程序-从Webview下载文件 的相关文章

随机推荐

  • Bazel:具有 JNI 依赖项的 Java 应用程序

    我已经成功构建了我的 JNI 库 jar jni 共享 cc library 包装的 cc library 但我不知道如何构建使用它的 Java 应用程序 我的构建很简单 java binary name OCFTestServer src
  • 如何在on_message中检查用户是否具有特定角色?

    目前 如果你执行命令 我有一个机器人会给你一个角色 我想让机器人检查执行该命令的用户是否具有特定角色 到目前为止 我只看到人们在获得许可的情况下这样做 基本的例子也很棒 if message content lower startswith
  • 使用sequelize关联不同的模型?

    您好 我正在尝试将我的用户模型与登录模型和 Question details 模型关联起来 但是 如果我使用 Question details 关联 那么我会收到 eagerLodingError 用户与登录无关 但如果我对其进行评论 那么
  • .htaccess 删除 URL 扩展名,添加尾部斜杠

    我一直试图让它在我正在开发的网站的客户服务器上工作 但我根本无法让它工作 基本上我试图删除 html 扩展名 并添加尾部斜杠 在 URL 栏中 因此 如果有人进入 example com home 转到 example com home e
  • Xcode Playground 时间线为空

    我尝试在 xcode 版本 7 3 1 中使用游乐场的时间轴助理编辑器 它始终为空 时间线助理编辑 我认为错误来自 xcode 但是从搜索来看 似乎没有人遇到相同的错误 所以我很困惑 显示结果print您需要通过菜单打开 调试区域 视图 g
  • PHP 使用什么 XML 解析器?

    我喜欢 XMLReader 类 因为它简单且速度快 但我喜欢 xml parse 相关函数 因为它可以更好地进行错误恢复 如果 XMLReader 类能够针对无效实体引用之类的情况抛出异常 而不是仅仅发出警告 那就太好了 如果可以的话我会避
  • Python日期时间:方法内部tz和.replace(tzinfo=)之间的区别

    我最近修复了一个错误 但仍然不知道为什么会发生 我在 Django 模型中将时间戳 纪元 转换为日期时间字段 our timezone pytz timezone Asia Jerusalem e13 is used for true di
  • IBM Worklight 6.1 - 无法使用 SQL 适配器连接到 MS SQL

    我正在尝试将适配器连接到 SQL Server 2012 Express 数据库 但不太正确 我从这里下载了一个连接器 http msdn microsoft com en us sqlserver aa937724 aspx 并将其添加到
  • 我如何“验证”轨道上的破坏

    在销毁静态资源时 我想在允许销毁操作继续之前保证一些事情 基本上 如果我注意到这样做会使数据库处于无效状态 我希望能够停止销毁操作 销毁操作没有验证回调 那么如何 验证 是否应该接受销毁操作呢 您可以引发一个异常 然后捕获该异常 Rails
  • 解决 Eclipse 的“在服务器上运行”部署问题

    我正在接管现有的基于 Struts 的 Web 应用程序 并尝试首次将其部署在我的本地计算机上 我的前任告诉我在 Tomcat 服务器上通过 Eclipse 运行它 我已经安装了最新的tomcat并且运行良好 我从他们的 CVS 服务器上获
  • Javascript:从cookie中读取会话ID

    对于 websocket 我必须从 cookie 中公开我的 sessionid 我搜索了一下 发现我应该能够通过以下方式访问 cookie console log document cookie 不幸的是 这不起作用 或者更好的是 doc
  • LINQ 忽略重音和大小写

    使用 LINQ 通过以下方式过滤元素的最简单方法是什么Where方法忽略重音和大小写 到目前为止 我已经能够通过调用属性上的方法来忽略大小写 我认为这不是一个好主意 因为它为每个元素调用相同的方法 对吗 这是我到目前为止得到的 var re
  • 需要有关简单 MySQL 数据库设计的技巧

    我正在尝试使用 MySQL 为游戏制作一个简单的项目数据库 这是我的 3 张桌子的样子 items itemId itemName 0001 chest piece 0002 sword 0003 helmet attributes att
  • 如何生成常规 Excel 公式作为查询结果?

    我有一个大型且复杂的 Excel 查询 它可以按预期工作 但是 我正在实现一些实时数据验证功能 即不需要数据刷新 并且我需要在查询结果的一列中包含常规 Excel 公式 该公式将使用工作簿中的其他工作表执行实时数据比较 有意独立于查询本身
  • 在 AngularJS 服务之间共享数据

    有没有办法在 AngularJS 的服务之间共享数据 用例 来自不同服务的数据聚合例如 我想要一个从 REST 服务加载一些数据的 service1 然后 另一个 service2 将来自另一个 REST API 的附加数据添加到 serv
  • 如何在 apache htaccess 中为 angularjs 应用程序重写 url

    我使用的htaccess如下 RewriteBase RewriteEngine on RewriteCond REQUEST FILENAME s OR RewriteCond REQUEST FILENAME l OR RewriteC
  • iOS 中是否支持本机 JSON?

    iOS SDK 中是否有一个类可以从服务器解析 JSON 类似于 XML 的 NSXML 和扩展的 RSS 从 iOS5 开始 原生支持 JSON 无需第三方框架 这是由NSJSONSerialization 类
  • 如何在uwp平台中将图像转换为字节数组

    我需要将图像转换为字节数组以将其存储在数据库中 我还需要将该数组转换回图像 我做了谷歌研究 但找不到解决方案 因为UWP平台有些api不可用 我从这些文章中找到了解决方案外乡人 says 要将图像转换为 byte 我将使用存储文件的 Ope
  • 使用Python抓取动态内容

    我想使用 Python 来抓取网页上 您在寻找这些作者吗 框的内容 如下所示 http academic research microsoft com Search query lander 不幸的是 盒子的内容是由 JavaScript
  • Chrome打包应用程序-从Webview下载文件

    我正在努力让现有的 Ajax 风格的 Web 应用程序作为 Chrome 打包应用程序运行 Ajax 应用程序在打包应用程序内的 Web 视图中运行 并且大部分运行良好 Ajax 应用程序允许用户使用标准 HTML 5 上传和拖 放来上传文