Google auth2 外部 clojurescript

Question

因此，我通过包含 https://apis.google.com/js/platform.js in my index.html and simply using javascript interop to emulate the instructions given here for an ordinary javascript client: https://developers.google.com/identity/sign-in/web/sign-in 成功地获得 google 登录以在我的开发 cljs 构建中工作。但是我无法使用 :optimizations :advanced 进行生产构建。

在我所有与 gapi.auth2 对象交互的代码中，我使用了 (aget object "propertyName") 这似乎让我一直调用相当于 gapi.load("auth2") 的 cljs在 gapi.auth2.getAuthInstance().currentUser.

上访问 'listen' 函数

当我尝试调用此 'listen' 函数时，出现 "cannot read property 'add' of undefined" 错误。我不知道这个 'add' 属性应该存在于什么对象上，如果我需要为这个对象创建一个 extern，或者如何创建。

我是否首先以理智的方式接近 gapi.auth2 集成？

Answer 1

我用 https://apis.google.com/js/platform.js 做了一个小的自定义 google 登录。

这是我的 externs.js 文件所需要的。

var gapi = {};
gapi.load = function (){};
gapi.auth2 = {};
gapi.auth2.init = function(){};
gapi.auth2.getAuthInstance = function (){};

基本上，有一个全局 js 对象 gapi，根据那个 google 网站上的示例代码，gapi 有方法 load 和属性 auth2。 gapi.auth 引用的对象有 init 和 getAuthInstance 方法。

我不建议使用 aget 来获取对象的属性。 aget 用于 js 数组。对于 JavaScript 对象，使用 goog.object/get 或多元数 goog.object/getValueByKeys.

对于像您的 gapi.auth2.getAuthInstance().currentUser 我不知道其类型的对象，我使用 js-invoke 函数对其调用 listen。

 (let [callback-fn (fn [_] ...)
       auth-inst  (.getAuthInstance js/gapi.auth2)
       currentUser (goog.object/get auth-inst "currentUser")]
  (js-invoke currentUser "listen" callback-fn))

Answer 2

在高级模式下使用闭包编译器时，另一个答案给了我一堆 errors/warnings，所以这就是我的 google-platform.js 外部文件的样子

/**
 * @fileoverview Externs for Google platform
 *
 * @externs
 */

/**
 * @constructor
 * @return {!gapi}
 */
function gapi() {}

/**
 * @param {string} name
 * @param {Function} success
 */
gapi.load = function (name, success) {};
gapi.prototype.load = gapi.load;

/**
 * @constructor
 * @return {!gapi.auth2}
 */
gapi.auth2 = function () {};
gapi.prototype.auth2 = gapi.auth2;

/**
 * @constructor
 * @param {Object<string,*>} options
 * @return {!gapi.auth2.init}
 */
gapi.auth2.init = function (options) {};
gapi.auth2.prototype.init = gapi.auth2.init;

/**
 * @param {Element} element
 * @param {Object} options
 * @param {Function} success
 * @param {Function} error
 */
gapi.auth2.init.attachClickHandler = function (element, options, success, error) {};
gapi.auth2.init.prototype.attachClickHandler = gapi.auth2.init.attachClickHandler;

/**
 * @constructor
 * @return {!googleUser}
 */
function googleUser() {}

/**
 * @constructor
 * @return {!googleUser.getAuthResponse}
 */
googleUser.getAuthResponse = function () {};
googleUser.prototype.getAuthResponse = googleUser.getAuthResponse;

 /** @type {string} */
googleUser.getAuthResponse.id_token;
googleUser.getAuthResponse.prototype.id_token = googleUser.getAuthResponse.id_token;

这是调用它的代码（对于自定义按钮）

let /** !gapi.auth2.init */ auth2;
gapi.load('auth2', function () {
    // Retrieve the singleton for the GoogleAuth library and set up the client.
    auth2 = gapi.auth2.init({
        'client_id': 'YOUR_CLIENT_ID.apps.googleusercontent.com',
        'cookiepolicy': 'single_host_origin',
        // Request scopes in addition to 'profile' and 'email'
        //scope: 'additional_scope'
});

$main.find('<selector for your button(s)>').each(/** @this {Element} */ function () {
    const t = this;
    auth2.attachClickHandler(t, {},
        function (/** Object<string,*> */ googleUser) {
            console.log(typeof googleUser, googleUser);
        },
        function (/** Object<string,*> */ error) {
            console.log(typeof error, error);
            alert(JSON.stringify(error, undefined, 2));
        });
    });
});

Google auth2 外部 clojurescript

Google auth2 clojurescript externs

google-authentication

google-closure-compiler

clojurescript