AngularJS and google cloud endpoint: walk through

2020-02-26 02:24发布

I'm new to AngularJS but I really like the way AngularJS works so I want to deployed it as client side for my Google cloud endpoint backend. Then I immediately get two problems:

1, Where to put the myCallback, so it's able to work into the ANgularJs controller?

<script src="https://apis.google.com/js/client.js?onload=myCallback"></script>

2, How I'm able to do the oauth2? and how the controller knows if the user authorized?

gapi.auth.authorize({client_id: myCLIENT_ID,
      scope: mySCOPES,.....

Any help is appreciated.

3条回答
男人必须洒脱
3楼-- · 2020-02-26 02:34

Regarding the callback - In order to access an Angular controller you need to use an injector (http://docs.angularjs.org/api/AUTO.$injector)

Simply create a global callback function, and then get reference to the controller from it like this:

window.callbackFunction() {
  injector = angular.element(document.getElementById('YourController')).injector()
  injector.invoke(function ($rootScope, $compile, $document) {
    $rootScope.variable = "stuff you want to inject";
  })
}

In this example I'm injecting the data to the rootScope, but this will also work for a specific controller scope (just inject $scope instead)

Can't help with the second question as I'm not familiar with gapi, though making auth2 calls from angularjs is quite straight forward.

查看更多
该账号已被封号
4楼-- · 2020-02-26 02:42

For loading Google Javascript Library with AngularJs, the callback function passed to onLoad of Google Javascript Library is the function that bootstrap AngularJS, like this:

This goes to the final of html file:

<script src="https://apis.google.com/js/client.js?onload=startApp">

Then, in <head> section you bootstrap angular like this:

<script type='text/javascript'>

function startApp() {

    var ROOT = 'http://<yourapi>.appspot.com/_ah/api';
    gapi.client.load('myapifromgoogleendpoint', 'version1', function() {
        angular.bootstrap(document, ["myModule"]);
    }, ROOT);
}

</script>

As described by Kenji, you also need to remove ng-app directive from your html.

查看更多
登录 后发表回答