2016-02-21 2 views
19

Ich habe eine + 1-Schaltfläche in meiner App: +1 in Cordova/IonicWie platziert man eine Google Plus + 1-Schaltfläche in der cordova/ionic App?

ich diesen Code verwendet haben:

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

und

(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); 
})(); 

ich auch die api erlaubt haben:

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" /> 

Das Problem: Dies funktioniert im Browser (ionic serve), aber es funktioniert nicht in der App ... Wenn ich auf nichts passiert ... (keine Fehler ...)

Wie auch immer, ich kann das mit der App machen? (ionic run)

Weitere Informationen/Debug-Informationen:

  1. Wenn ich die + 1-Schaltfläche auf dem Netz geklickt haben es mir nicht zeigen die rote Taste auf der app (Read bedeutet habe ich schon geteilt, dass Link) (Er weiß nicht, wer ich bin ..)
  2. ich möchte noch kein Login/Anmelden, um nur + 1-Schaltfläche ...

machen, wenn ich hinzufügen:

<allow-navigation href="*" /> 

in config.xml, fragt er mich anmelden, wenn ich die + 1-Schaltfläche klicken: (Es soll nicht) enter image description here

Das bedeutet, die + 1-Schaltfläche, weil nicht funktioniert ist „in einem anonymen Browser “, nicht mit dem Betriebssystem authentifiziert ...

ich auch eine Demo reine Android App im Anschluss an diese Anweisungen erstellt: https://developers.google.com/+/mobile/android/recommend Es funktioniert perfekt ... (ich den Link +1 kann ...)

Meine Möglichkeiten:

  1. Eine Möglichkeit, eine native Android-Ansicht mit der + 1-Schaltfläche zu erstellen, wird in der Webansicht angezeigt.

  2. Machen Sie eine gefälschte + 1-Schaltfläche und wenn es ruft ein Plugin, das einige König der Anfrage macht/klicken Sie auf die reale + 1-Schaltfläche ....

  3. Jeder Vorschlag, wie man es tun geklickt ?

Sind irgendwelche dieser beiden Möglichkeiten möglich?

Danke für Ihre Hilfe!

Antwort

1

Wenn Sie das Login nicht behandeln möchten, können Sie ein Plugin bauen eine native PlusOneButton hinzuzufügen. Ich arbeite gerade daran, ich werde versuchen, es heute Nachmittag zu veröffentlichen, aber da Moderatoren nicht mögen "Link nur asnwers" werde ich hier erklären, wie das Plugin zu bauen, und ich werde den Link hinzufügen Sobald ich fertig bin, es zu entwickeln.

Zuallererst, lesen Sie die guide about how to build a cordova plugin, ich werde nicht in diese Detailebene eingehen.

Ihre CordovaPlugin Unterklasse wird diese Variablen benötigen:

private PlusOneButton mPlusOneButton; 
private String URL; 

Ihre Methode execute so sein sollte:

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; 
} 

schließlich die onResume Methode hinzufügen auf dem aktuellen Stand auf den Button Status zu halten.

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

Das Plugin wird die com.google.android.gms:play-services-plus Abhängigkeit hinzufügen haben

Sie, dass diese Zeile in der EDIT

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

plugin.xml Hinzufügen tun: Das Plugin ist bereit https://github.com/jcesarmobile/plusOneButtonPlugin

Um es zu installieren

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

es zu benutzen:

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

Oder

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

: O Du bist in letzter Minute gekommen, werde ich teste es jetzt und melde dich in ein paar Minuten ... –

+0

OMG, es funktioniert! Vielen Dank! Nein wirklich, danke! –

+0

Das einzige "Problem" ist jetzt das x, y Ding .... Wenn ich Fortschritte mache, werde ich zum Plugin Repo beitragen! Haben Sie irgendwelche guten Ideen, wie Sie das lösen können? Ich dachte daran, ein leeres div dort zu platzieren, wo ich es möchte und die "Koordinaten" daraus zu verwenden. –

7

Ihr Problem ist, dass der Benutzer nicht mit seinem Google-Konto innerhalb des Cordova-Browsers angemeldet ist. Daher wird beim Klicken auf die + 1-Schaltfläche offensichtlich eine Anmeldeaufforderung angezeigt.

Ich verstehe, dass Sie auf das globale Google-Konto zugreifen möchten, das mit dem Telefon/Betriebssystem des Benutzers verbunden ist, und dieses in Ihrer App verwenden. Zunächst benötigt Ihre App Anmeldeinformationen für den Zugriff auf diese Daten. Diese müssen dann über den cordova-Browser zugänglich sein. Es gibt this plugin, die das für Sie tun.

In Ihrem Initialisierungscode, können Sie dann window.plugins.googleplus.login(...) nennen, die den Benutzer zur Bestätigung aufgefordert werden (falls erforderlich) und melden Sie sich an.

Vergewissern Sie sich, dass die + 1-Schaltfläche nach der Anmeldung initialisiert wird, so dass der Zustand wird richtig angezeigt. Zum Beispiel (vorausgesetzt, Sie jQuery verwenden):

$(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); 
} 
+0

Ich mag nicht den Benutzer anmelden (wie ich bereits darauf hingewiesen) und ich hatte dieses Plugin gesehen, es scheint nicht zu arbeite wie ich wollte aber ich werde es später versuchen ... –

+0

verstehe ich nicht. Die + 1-Schaltfläche erfordert immer, dass der Benutzer angemeldet ist. Der Grund dafür, dass Sie in Ihrem Desktop-Browser arbeiten, ist, dass Sie bereits angemeldet sind. Versuchen Sie dasselbe in einem privaten/inkognito Fenster und Sie werden eine Anmeldeaufforderung sehen. –

+0

Ja, aber eine normale Android-App muss das nicht tun ... Aber ich verstehe, dass es ist, als ob der Benutzer im Inkognito/Privat-Modus war .... (Ich habe das Plugin noch nicht ausprobiert ...) –