我正在尝试从角度应用程序登录到github。我是角色的新手。
我正在为github钩子使用github.js https://github.com/michael/github插件。
我的javascript如下。我设置模块并创建一个auth控制器。这是由html中的表单触发的。
var app = angular.module('app', []);
app.controller('AuthCtrl', function($scope) {
$scope.username = '';
$scope.password = '';
$scope.auth = function() {
console.log($scope.username);
console.log($scope.password);
$scope.github = new Github({
username: $scope.username,
password: $scope.password,
auth: "basic"
});
}
});
我有console.log调用,以确保它正在触发,它是。但是$ scope.github行似乎没有运行。我正在检查控制台和网络日志(chrome开发人员工具),我希望看到https://api.github.com/ {someotherstring}请求,但没有任何消息。我知道github代码可以工作,因为我在非角度应用程序中运行它。所以我的问题是我错过了什么?
任何帮助将不胜感激。希望我已经为某些人提供了足够的信息。
提前致谢
鲍勃
html:
<div class="container">
<div class="row">
<form name="myForm" ng-controller="AuthCtrl" class="form-horizontal css-form">
<div class="control-group">
<div class="controls">
<input type="text" name="username" ng-model="username" placeholder="enter username" required/><span class="error" ng-show="myForm.username.required">Required!</span>
</div>
</div>
<div class="control-group">
<div class="controls">
<input type="password" name="pwd" ng-model="password" placeholder="enter password" required/><span class="error" ng-show="myForm.pwd.required">Required!</span>
</div>
</div>
<button ng-click="auth()">Login</button>
</form>
</div>
</div>
代码取决于以下库:
<link rel="stylesheet" href="assets/stylesheets/screen.css">
<link rel="stylesheet" href="assets/stylesheets/bootstrap.min.css">
<script src="assets/js/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/base64.js"></script>
<script src="assets/js/underscore-min.js"></script>
<script src="assets/js/github.js"></script>
<script src="assets/js/app.js"></script>
答案 0 :(得分:0)
看起来它确实在起作用。
我添加了
app.controller('AuthCtrl', function($scope) {
$scope.username = '';
$scope.password = '';
$scope.success = false;
$scope.auth = function() {
console.log($scope.username);
console.log($scope.password);
$scope.github = new Github({
username: $scope.username,
password: $scope.password,
auth: "basic"
});
$scope.user = $scope.github.getUser();
$scope.user.repos(function(err, repos) {
$scope.err = err;
$scope.repos = repos;
if($scope.err != null)
{
console.log($scope.err);
}else
{
console.log($scope.repos);
$scope.success = true;
}
});
}
});
它在登录时检索了回购。感谢您的建议。
答案 1 :(得分:0)
angular-github-activity 可以作为让您的身份验证正常运行的示例。
来自 the docs :
GithubActivityService.events({
user:'gigablox',
params:{
//Github API supports CORS as well. (http://developer.github.com/v3/#cross-origin-resource-sharing)
callback:'JSON_CALLBACK',
/*
Github API rate limits to (60 requests per hour) for anonymous requests. (http://developer.github.com/v3/#cross-origin-resource-sharing)
If you need more (5000 requests per hour) you can generate a "scope-less" (access_token) for your app and is safe for client side code:
1. First register a new app by following:
--> https://github.com/settings/applications
--> "Developer Applications"
--> "Register new application"
2. Register a "scope-less" (access_token) via cURL call using that <client_id> and <client_secret> you just made.
# curl -X PUT -H "application/json" -d
'{"client_secret":"<client_secret>","scopes":[],"note":"no scope public access"}'
https://api.github.com/authorizations/clients/<client_id>
-u <username>
3. Your response shoud look something like this and generate a scope-less (token):
{
"id": 1234567,
"url": "https://api.github.com/authorizations/1234567",
"app": {
"name": "Angular Github Activity",
"url": "http://gigablox.github.io/angular-github-activity/",
"client_id": "123456712345671234567"
},
"token": "76841d7b319dc8bb2c731365d38b74b25ab00126", //<-- This is what you want
"note": "no scope public access",
"note_url": null,
"created_at": "2013-10-06T21:06:18Z",
"updated_at": "2013-10-06T21:06:18Z",
"scopes": []
}
*/
access_token:'76841d7b319dc8bb2c731365d38b74b25ab00126' //<-- Put that bad boy right here.
}
}).get().$promise.then(function(events){
$scope.events = events.data;
});