javascript - Phonegap 中的 Dropbox Javascript Datastores API 示例为 Windows8 应用程序提供错误禁止框架

Question

我尝试为 Dropbox Javascript Datastores API 创建一个支持 Android 和 Windows8 的 Phonegap 应用程序，该应用程序利用此处提供的示例:https://github.com/dropbox/cordova-datastores-example

当我构建并运行 Android 应用程序时，它可以在 Android 平板电脑上完美运行。但是，当我运行为 Windows8 创建的应用程序时，会显示错误:由于此错误，应用程序无法导航到...:FORBIDFRAMING。然后之后什么也没有发生。

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

谢谢。

Answer 1

前提

这是一个 hacky 解决方案，可能会被移植到针对 dropbox-js 的正确 Pull 请求中:

准备工作:

• 从 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 添加到 dropbox 时，我们需要处理 来自 Dropbox 的调用。你的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 步:向 dropbox-js 添加自定义 AuthDriver

打开 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 步:使用 Dropbox

在 helpers.js 中，您会找到一个名为 sync 的函数，我用它来

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

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

最后的话

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