javascript - Phonegap 中的 Dropbox Javascript Datastores API 示例为 Windows8 应用程序提供了错误 forbidframing

Question

我试图为 Dropbox Javascript 数据存储 API 创建一个同时支持 Android 和 Windows8 的 Phonegap 应用程序，该应用程序使用此处提供的示例:https://github.com/dropbox/cordova-datastores-example

当我构建并运行 Android 应用程序时，它可以在 Android 平板电脑上完美运行。但是当我运行为 Windows8 创建的应用程序时，会显示错误:The app couldn't navigate to ... because of this error: FORBIDFRAMING。然后什么也没有发生。

我一直无法找到使用框架的替代方法。我想知道，是否有办法成功运行此示例的 Windows8 应用程序，以及我将在哪里更改示例以替换框架。 (或者，如果有另一种方法来授权用户登录，这样我就不必使用框架了。)

谢谢。

Answer 1

前提

这是一个 hacky 解决方案，可能会被移植到针对 dropbox-js 的适当 Pull Request:

准备:

• 从 here 下载 dropbox-js 客户端并将其放入项目的 js 文件夹中。
• 确保它列在您的“解决方案资源管理器”中。如果不是，请右键单击该文件夹并通过“添加 -> 现有项目...”添加它。
• 将 dropbox.js 添加到您的 default.html。
• 创建一个新文件。我将其命名为 helpers.js 并将其添加到您的 default.html。
• 打开您的 package.appxmanifest 文件并声明自定义协议(protocol)。 (声明 -> 从下拉列表中选择协议(protocol) -> 为其命名(例如 myapp))
• 转到保管箱app console并注册一个新的应用程序。
• 将重定向 URI 添加到已注册的应用程序:myapp://dropbox。请注意，myapp 引用自定义协议(protocol)。

第 1 步:添加助手

将以下内容添加到helpers.js: http://pastebin.com/qpZbv7YG

第 2 步:添加对协议(protocol)处理程序的支持

当我们将自定义协议(protocol)添加到我们的应用程序并将重定向 uri 添加到保管箱时，我们需要处理来自保管箱的电话。你的 default.js

app.addEventListener("activated", function (args) {
  if (args.detail.kind === activation.ActivationKind.protocol) {
    // the application has been called via the custom protocol

    var requestUri = args.detail.uri.rawUri
      , params     = Dropbox.Util.Oauth.queryParamsFromUrl(requestUri)

    AppHelpers.dropbox.setParams(params)
  } else if (args.detail.kind === activation.ActivationKind.launch) {
    /* you should have this alread in place */
  }
})

第 3 步:将自定义 AuthDriver 添加到 dropbox-js

打开 dropbox.js 并找到行:

  Dropbox.AuthDriver.Cordova = (function (_super) {

将以下代码粘贴到该行的正上方:

Dropbox.AuthDriver.WinRT = (function (_super) {
  __extends(WinRT, _super);

  function WinRT(options) {
    WinRT.__super__.constructor.call(this, options);
  }

  WinRT.prototype.url = function () {
    return 'myapp://dropbox';
  };

  WinRT.prototype.doAuthorize = function (authUrl, stateParam, client, callback) {
    var authHost, browser, onEvent, promptPageLoaded, removed,
      _this = this;
    var uri = new Windows.Foundation.Uri(authUrl);

    Windows.System.Launcher.launchUriAsync(uri)
  };

  return WinRT;
})(Dropbox.AuthDriver.BrowserBase);

请注意，这里再次引用了我们的自定义协议(protocol)。

第 4 步:使用保管箱

在 helpers.js 中，你会发现一个名为 sync 的函数，我用它来

• 检查用户是否已通过身份验证。如果还不是这种情况，我们会将他重定向到保管箱。
• 下载用户的联系人数据并将其登录到控制台。

您基本上只需使用 MyHelpers.dropbox.getClient() 并与生成的客户端进行交互。它将返回 dropbox client 的正确实例

结语

希望对您有所帮助!您可以在这里找到客户端的可用方法:http://coffeedoc.info/github/dropbox/dropbox-js/master/classes/Dropbox/Client.html#readFile-instance