javascript - plugin - ionic google plus

¿Cómo colocar un botón Google Plus+1 dentro de la aplicación cordova/ionic?

Question

He añadido un botón +1 en mi aplicación:

He usado este código:

<div class="g-plusone" data-size="tall" data-href="GOOGLE PLAY STORE LINK TO MY APP"></div>

y

(function() {
    var po = document.createElement(''script''); po.type = ''text/javascript''; po.async = true;
    po.src = ''https://apis.google.com/js/platform.js'';
    var s = document.getElementsByTagName(''script'')[0]; s.parentNode.insertBefore(po, s);
})();

También he permitido la api:

index.html:

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src ''self'' ''unsafe-inline''; script-src ''self'' ''unsafe-inline'' ''unsafe-eval'' https://apis.google.com">

config.xml:

<allow-navigation href="https://apis.google.com" />

El problema: esto funciona en el navegador ( ionic serve ) pero no funciona en la aplicación ... Cuando hago clic no pasa nada ... (sin errores ...)

De todos modos puedo hacer que esto funcione en la aplicación? ( ionic run )

Más información / información de depuración:

1. Si he hecho clic en el botón +1 en la web, no me muestra el botón rojo en la aplicación (Leer significa que ya he compartido ese enlace) (No sé quién soy ...)
2. No quiero hacer un inicio de sesión / registro, solo un botón +1 ...

Si agrego:

<allow-navigation href="*" />

en config.xml, me pide que inicie sesión cuando hago clic en el botón +1: (No debería)

Esto significa que el botón +1 no funciona porque está "en un navegador anónimo", no autenticado con el sistema operativo ...

También creé una aplicación de Android pura de demostración siguiendo estas instrucciones: https://developers.google.com/+/mobile/android/recommend Funciona perfectamente ... (Puedo +1 el enlace ...)

Mis posibilidades:

1. Alguna forma de hacer que una vista nativa de Android con el botón +1 aparezca en la vista web.

2. Haga un botón falso de +1 y cuando se hace clic en él, se llama un complemento que hace que algunos de los reyes de solicitud / clic en el botón +1 real ...

3. ¿Alguna sugerencia sobre cómo hacerlo?

¿Es posible alguna de estas dos posibilidades?

¡Gracias por tu ayuda!

Answer 1

Si no desea manejar el inicio de sesión, puede crear un complemento para agregar un PlusOneButton nativo. Estoy trabajando en ello ahora mismo, intentaré publicarlo esta tarde, pero como a los moderadores no les gusta "enlazar solo con respuestas", explicaré aquí cómo construir el complemento, y agregaré el enlace una vez. Termino de desarrollarlo.

En primer lugar, lea la guía sobre cómo crear un complemento de cordova , no voy a entrar en ese nivel de detalle.

Su subclase CordovaPlugin necesitará estas variables:

private PlusOneButton mPlusOneButton;
private String URL;

Tu método de ejecución debería ser así:

public boolean execute(String action, final JSONArray args, final CallbackContext callbackContext) throws JSONException {
    if (action.equals("show")) {//show is the name of the method you call from javascript
        URL = "http://www.phonegap.es";//you should pick it from the plugin params
        mPlusOneButton =  new PlusOneButton(cordova.getActivity());
        mPlusOneButton.initialize(URL, null);

        //you have to run this part making sure you run it on the UI Thread
        cordova.getActivity().runOnUiThread(new Runnable() {
            public void run() {
                cordova.getActivity().addContentView(mPlusOneButton,new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,RelativeLayout.LayoutParams.WRAP_CONTENT));


                //position the button wherever you want, you should pick the values from the plugin params
                mPlusOneButton.setX(300);
                mPlusOneButton.setY(300);

            }
        });

    } else {
        return false;
    }
    return true;
}

Finalmente, agregue el método onResume para mantener el estado del botón actualizado.

@Override
public void onResume(boolean multitasking) {
    super.onResume(multitasking);
    mPlusOneButton.initialize(URL, null);
}

El complemento deberá agregar la dependencia com.google.android.gms:play-services-plus

Puedes hacer eso agregando esta línea al plugin.xml

<framework src="com.google.android.gms:play-services-plus:+" />

EDITAR: El complemento está listo https://github.com/jcesarmobile/plusOneButtonPlugin

Para instalarlo

cordova plugin add https://github.com/jcesarmobile/plusOneButtonPlugin

Para usarlo:

var params = {};
params.url = "http://www.example.com";
params.position = {x:100,y:100};
plusOneButton.show(params);

O

plusOneButton.show("http://www.example.com");

Answer 2

Su problema es que el usuario no ha iniciado sesión con su cuenta de Google dentro del navegador de Córdoba, por lo que, obviamente, verá un mensaje de inicio de sesión al hacer clic en el botón +1.

Entiendo que desea acceder a la cuenta global de Google conectada al teléfono / sistema operativo del usuario y usar esta dentro de su aplicación. Primero, su aplicación necesita credenciales para acceder a estos datos, luego debe ser accesible desde el navegador de Córdoba. Hay un plugin que hace eso por ti.

En su código de inicialización, puede llamar a window.plugins.googleplus.login(...) , que solicitará al usuario que confirme (si es necesario) e inicie sesión.

Asegúrese de que el botón +1 se inicialice después de iniciar sesión, para que el estado se indique correctamente. Por ejemplo (asumiendo que estás usando jQuery):

$(document).ready(function() {
  loginToGoogle();
  initPlusOneButton();
}

function loginToGoogle() { ... }

function initPlusOneButton() {
    var po = document.createElement(''script''); po.type = ''text/javascript''; po.async = true;
    po.src = ''https://apis.google.com/js/platform.js'';
    var s = document.getElementsByTagName(''script'')[0]; s.parentNode.insertBefore(po, s);
}