(Riot-API) 仅从召唤师(按名称)获取 id api 使用 angularJS 调用
(Riot-API) Grabbing id only from summoner (by-name) api call using angularJS
我正在使用 angularjs 来检索召唤师信息,但仅限于特定字段(例如,仅限召唤师姓名,仅限 id)。如果我得到正确的结果,我正在尝试使用 console.log() 检查。但是,我一直在控制台屏幕上看到这个:
错误:[$resource:badcfg] http://errors.angularjs.org/1.4.4/$resource/badcfg?p0=query&p1=array&p2=obj…2Fna.api.pvp.net%2Fapi%2Flol%2Fna%2Fv1.4%2Fsummoner %2Fby-name%2Fsummoner-name
出错时(本机)
在 http://localhost/riotapi_project/angularjs/angular.min.js:6:416
在 d.module.provider.$get.e.(匿名函数).q.then.p.$resolved (http://localhost/riotapi_project/angularjs/angular-resource.min.js:9:330)
在 http://localhost/riotapi_project/angularjs/angular.min.js:118:217
在 n.$get.n.$eval (http://localhost/riotapi_project/angularjs/angular.min.js:133:39)
在 n.$get.n.$digest (http://localhost/riotapi_project/angularjs/angular.min.js:130:60)
在 n.$get.n.$apply (http://localhost/riotapi_project/angularjs/angular.min.js:133:330)
在 g (http://localhost/riotapi_project/angularjs/angular.min.js:87:340)
在 K (http://localhost/riotapi_project/angularjs/angular.min.js:91:406)
在 XMLHttpRequest.A.onload (http://localhost/riotapi_project/angularjs/angular.min.js:92:437)
这是我的代码:
index.html
//////////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////
<!doctype html>
<html lang="en" ng-app="riotApiApp">
<head>
<meta charset="utf-8">
<title>Angular JS Controller</title>
<script src="angularjs/angular.min.js"></script>
<script src="angularjs/angular-resource.min.js"></script>
<script src="api_call.js"></script>
</head>
<!-- <body ng-controller="getSummonerbyName"> -->
<body>
<div ng-controller="getSummonerbyName">
First Name: <input type="text" ng-model="summonerName"><br>
<ul ng-repeat="post in posts">
<li>
{{post}}
</li>
<!-- <div ng-controller="alternateSummonerRetrieve"> ng-model={{post.id}}></div> -->
</ul>
</div>
</body>
</html>
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
api_call.js
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
var riotApiApp = angular.module('riotApiApp', ['ngResource']);
riotApiApp.controller('getSummonerbyName', function($scope, $http, $resource) {
$scope.$watch('summonerName', function (tmpStr) {
if (!tmpStr || tmpStr.length == 0)
return 0;
setTimeout(function() {
if (tmpStr === $scope.summonerName)
{
var src = $resource('https://na.api.pvp.net/api/lol/na/v1.4/summoner/by-name/:verb', {verb:$scope.summonerName, api_key:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxxx'}, {retrieve: {method: 'GET', isArray: true}});
var user = src.query({}, function() {
});
console.log(user);
}
}, 1000);
});
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
谁能告诉我我做错了什么?
我想我想出了如何从中解析对象。我错了,因为我认为我可以做 .query 而不是 .get,因为 api 方法 returns 一个对象。
例如:
$http.get("https://na.api.pvp.net/api/lol/na/v1.4/summoner/585897?api_key=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx").成功(函数(response_object)
在那之后,我只是将结果存储在一个数组中,我得到了我的结果。
您不应使用 AngularJS 之类的前端框架来调用 Riot Games API,因为这会将您的 API 密钥暴露给您的用户。
您需要在服务器端调用 Riot Games API,并让您的客户端从服务器请求数据。
我正在使用 angularjs 来检索召唤师信息,但仅限于特定字段(例如,仅限召唤师姓名,仅限 id)。如果我得到正确的结果,我正在尝试使用 console.log() 检查。但是,我一直在控制台屏幕上看到这个:
错误:[$resource:badcfg] http://errors.angularjs.org/1.4.4/$resource/badcfg?p0=query&p1=array&p2=obj…2Fna.api.pvp.net%2Fapi%2Flol%2Fna%2Fv1.4%2Fsummoner %2Fby-name%2Fsummoner-name 出错时(本机) 在 http://localhost/riotapi_project/angularjs/angular.min.js:6:416 在 d.module.provider.$get.e.(匿名函数).q.then.p.$resolved (http://localhost/riotapi_project/angularjs/angular-resource.min.js:9:330) 在 http://localhost/riotapi_project/angularjs/angular.min.js:118:217 在 n.$get.n.$eval (http://localhost/riotapi_project/angularjs/angular.min.js:133:39) 在 n.$get.n.$digest (http://localhost/riotapi_project/angularjs/angular.min.js:130:60) 在 n.$get.n.$apply (http://localhost/riotapi_project/angularjs/angular.min.js:133:330) 在 g (http://localhost/riotapi_project/angularjs/angular.min.js:87:340) 在 K (http://localhost/riotapi_project/angularjs/angular.min.js:91:406) 在 XMLHttpRequest.A.onload (http://localhost/riotapi_project/angularjs/angular.min.js:92:437)
这是我的代码: index.html //////////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////
<!doctype html>
<html lang="en" ng-app="riotApiApp">
<head>
<meta charset="utf-8">
<title>Angular JS Controller</title>
<script src="angularjs/angular.min.js"></script>
<script src="angularjs/angular-resource.min.js"></script>
<script src="api_call.js"></script>
</head>
<!-- <body ng-controller="getSummonerbyName"> -->
<body>
<div ng-controller="getSummonerbyName">
First Name: <input type="text" ng-model="summonerName"><br>
<ul ng-repeat="post in posts">
<li>
{{post}}
</li>
<!-- <div ng-controller="alternateSummonerRetrieve"> ng-model={{post.id}}></div> -->
</ul>
</div>
</body>
</html>
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
api_call.js
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
var riotApiApp = angular.module('riotApiApp', ['ngResource']);
riotApiApp.controller('getSummonerbyName', function($scope, $http, $resource) {
$scope.$watch('summonerName', function (tmpStr) {
if (!tmpStr || tmpStr.length == 0)
return 0;
setTimeout(function() {
if (tmpStr === $scope.summonerName)
{
var src = $resource('https://na.api.pvp.net/api/lol/na/v1.4/summoner/by-name/:verb', {verb:$scope.summonerName, api_key:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxxx'}, {retrieve: {method: 'GET', isArray: true}});
var user = src.query({}, function() {
});
console.log(user);
}
}, 1000);
});
////////////////////////////////////////// //////////////////////////////////////////////// //////////////////////////////
谁能告诉我我做错了什么?
我想我想出了如何从中解析对象。我错了,因为我认为我可以做 .query 而不是 .get,因为 api 方法 returns 一个对象。
例如:
$http.get("https://na.api.pvp.net/api/lol/na/v1.4/summoner/585897?api_key=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx").成功(函数(response_object)
在那之后,我只是将结果存储在一个数组中,我得到了我的结果。
您不应使用 AngularJS 之类的前端框架来调用 Riot Games API,因为这会将您的 API 密钥暴露给您的用户。
您需要在服务器端调用 Riot Games API,并让您的客户端从服务器请求数据。