- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在 ng-Cordova 上构建一个项目。我尝试了很多例子来使用谷歌进行日志记录。我的需要是使用谷歌帐户登录我的应用程序。我有登录按钮。当我单击按钮时,它需要重定向到谷歌帐户并使用谷歌帐户登录,然后需要返回到我的应用程序。我有一个谷歌客户ID。我特此发布我的index.html文件和app.js文件。
索引.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content>
</ion-content>
</ion-pane>
</body>
</html>
我的 app.js 文件
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
var exampleApp = angular.module('starter', ['ionic', 'ngCordova']);
//.run(function($ionicPlatform) {
// $ionicPlatform.ready(function() {
//// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
//// for form inputs)
// if(window.cordova && window.cordova.plugins.Keyboard) {
// cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
// }
// if(window.StatusBar) {
// StatusBar.styleDefault();
// }
var requestToken = "";
var accessToken = "";
var clientId = "";
var clientSecret = "";
var exampleApp = angular.module('example', ['ionic'])
.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('login', {
url: '/login',
templateUrl: 'templates/login.html',
controller: 'LoginController'
})
.state('secure', {
url: '/secure',
templateUrl: 'templates/secure.html',
controller: 'SecureController'
});
$urlRouterProvider.otherwise('/login');
});
exampleApp.controller('LoginController', function($scope, $http, $location) {
$http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
$scope.login = function() {
var ref = window.open('https://accounts.google.com/o/oauth2/auth?client_id=' + clientId + '&redirect_uri=http://localhost/callback&scope=https://www.googleapis.com/auth/urlshortener&approval_prompt=force&response_type=code&access_type=offline', '_blank', 'location=no');
ref.addEventListener('loadstart', function(event) {
if((event.url).startsWith("http://localhost/callback")) {
requestToken = (event.url).split("code=")[1];
$http({method: "post", url: "https://accounts.google.com/o/oauth2/token", data: "client_id=" + clientId + "&client_secret=" + clientSecret + "&redirect_uri=http://localhost/callback" + "&grant_type=authorization_code" + "&code=" + requestToken })
.success(function(data) {
accessToken = data.access_token;
$location.path("/secure");
})
.error(function(data, status) {
alert("ERROR: " + data);
});
ref.close();
}
});
}
if (typeof String.prototype.startsWith != 'function') {
String.prototype.startsWith = function (str){
return this.indexOf(str) == 0;
};
}
});
exampleApp.controller('SecureController', function($scope, $http) {
$scope.accessToken = accessToken;
});
在搜索了一些示例后,我另外创建了两个 html 页面。
登录.html
<ion-view ng-controller="LoginController" title="Oauth Login">
<ion-content>
<div>
<div class="padding">
<button ng-click="login()" class="button button-block button-stable">
Sign In
</button>
</div>
</div>
</ion-content>
</ion-view>
和 secure.html
<ion-view ng-controller="SecureController" title="Oauth Secure">
<ion-content>
<div>
<div class="padding">
{{accessToken}}
<button class="button button-block button-stable">
Do Something
</button>
</div>
</div>
</ion-content>
</ion-view>
当我运行应用程序时,仅显示带有空白页的索引文件。我不知道出了什么问题。有人可以帮助我吗?
最佳答案
嗨,在 github 中,我上传了一个示例项目以通过 google 登录在执行项目之前,请按照github的README.md文件中的步骤进行操作
关于javascript - ngCordova:oauth 与谷歌失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32076118/
我正在尝试使用 Ionic 和 ngCordova 录制音频。 这是我的代码: $scope.captureAudio = function() { var options = { limit: 3,
我正在尝试获取 ngCordova 类型,但 tsd 和类型都失败了: 如果我执行: tsd install ng-cordova --save 它输出; zero results 如果我执行: ty
我正在尝试使用' https://github.com/danwilson/google-analytics-plugin.git ' 带有 ngCordova 的插件。我已经添加了插件并在我的 Co
我正在 ng-Cordova 上构建一个项目。我尝试了很多例子来使用谷歌进行日志记录。我的需要是使用谷歌帐户登录我的应用程序。我有登录按钮。当我单击按钮时,它需要重定向到谷歌帐户并使用谷歌帐户登录,然
我在Ionic应用程序中使用ngCordova LocalNotification插件来安排设备上的通知并将其发送到本地。我的应用要求每次发送前一条通知时安排新的通知。 我正在使用$ cordovaL
我正在 ionic(angular + cordova)上开发应用程序,为了访问我使用 ngCordova 的 cordova 插件(angular 的 cordova 插件实现)。我有一个 $cor
我正在使用 ngcordova contacts plugin检索应用程序中的联系人。我想知道是否可以只获取至少有一个电话号码的联系人。 我使用了以下代码,它返回包含电子邮件但不包含电话号码的我的谷歌
我在我的 Ionic 应用程序中使用 ngCordova LocalNotification 插件,我试图让它以随机时间跨度重复。 例如,用户将触发通知在 1 分钟内启动,然后我需要在另外 2 分钟内
ngCordova getUUID() 返回设备未定义 我正在使用 Ionic 框架构建移动应用程序,我需要检索设备 UUID我使用 ngCordova 使用这里的缩小版本 ngCordova ! 这
我正在尝试将图像上传到我的 FTP。 到目前为止我所取得的成就是在这个 plnkr 我的cordova文件传输看起来像 $scope.upload =function(){ var opt
为了合并 Toastr ngCordova 插件..我按照以下步骤操作 凉亭安装 ngCordova 在我的应用中包含 ngCordova angular.module('app', ['ionic'
最近,我遇到了一些应用程序,它们能够在推送通知到达时在应用程序抽屉/锁定屏幕中向我显示图片(以及一些文本)。我想知道是否可以使用 Ionic/Angular/ngCordova 堆栈来实现此功能。 最
我试图确保我使用的是最新版本,因为我的 ngCordova 媒体插件由于某种原因无法工作。 我收到此错误: npm WARN locking Error: EACCES, open '/Users/S
我尝试在安装 Bower 后安装 ngCordova,但出现错误Bower 未被识别为内部命令任何想法如何解决此问题 最佳答案 首先使用以下命令检查您的计算机是否安装了 Bower bower -v
我有个小问题。我在 visual studio 2015 中启动了一个空的 cordova 应用程序,只是为了进行一些测试,我想在我的应用程序中尝试 ng-cordova 插件(没有 ionic )。
应用程序的目标:在应用程序处于前台和后台时获取每次移动的地理位置并记录位置。 我已经尝试了很多代码和组合,但我无法让它工作(2 天后...)。 经典地理定位 (getCurrentPosition)
我目前正在使用 ionic/ngcordova 构建一个 android 应用程序。我正在实现推送通知。我已经将推送通知实现为在 app.run(function(){..}) 注入(inject)的
我正在尝试将 native fb 连接添加到我的 ionic 应用程序。 我正在使用: - ionic - ngCordova - http://ngcordova.com/docs/plugins/
我正在尝试使用 readAsText ngCordova 插件读取 CSV 文件的内容。 只有当文件编码为unicode时我才能做到这一点,但大多数CSV文件都是Shift-JIS。当文件为 Shif
我已经安装了 cordova inapp 浏览器插件来添加社交 Facebook 登录。问题是,在我的应用程序中,我只允许通过 Facebook 登录,而不允许注册。在我的网络应用程序上,如果该用户已
我是一名优秀的程序员,十分优秀!