How can test this type of http format below?
$http({
method: 'GET',
url: 'https://api.github.com/user/repos',
headers:{
'Authorization': "Basic " + btoa("xxxx:xxxx"),
'Accept': 'application/json; odata=verbose'
}
})
.success(function(data, status, headers, config) {
$scope.valid = true;
$scope.collection = data;
})
.error(function(data, status, headers, config) {
$scope.error = data;
});
Test code,
it('should demonstrate using when (200 status)', inject(function($http, $httpBackend) {
var $scope = {};
/* Code Under Test */
$http({
method: 'GET',
url: 'https://api.github.com/user/repos',
headers:{
'Authorization': "Basic " + btoa("xxxxx:xxxx"),
'Accept': 'application/json; odata=verbose'
}
})
.success(function(data, status, headers, config) {
$scope.valid = true;
$scope.collection = data;
})
.error(function(data, status, headers, config) {
$scope.error = data;
});
/* End */
$httpBackend
.when('GET', 'https://api.github.com/user/repos', undefined, {
Authorization: "Basic " + btoa("xxxxx:xxxx"),
Accept: "application/json;odata=verbose"
})
.respond(200, { foo: 'bar' });
$httpBackend.flush();
expect($scope.valid).toBe(true);
expect($scope.collection).toEqual({ foo: 'bar' });
}));
I get this error,
Error: Unexpected request: GET https://api.github.com/user/repos No
more request expected
Any ideas?
can you try this
$httpBackend.whenGET('https://api.github.com/user/repos', undefined, {
Authorization: "Basic " + btoa("xxxxx:xxxx"),
Accept: "application/json;odata=verbose"
}).respond(function(){ return [200,[{foo: 'bar' }]]});
Related
I have a problem with a Post query that I use for a form. I get a "406 not acceptable" error every time I try to validate my form, and Object.data is blank..
var edit = function(form){
var token = window.localStorage.getItem('token');
$ionicLoading.show();
return $http({
method : 'POST',
url : API.url + '/user',
headers : {Authorization : 'Bearer ' + token},
transformRequest: function(data, headers){
console.log(headers);
headers = angular.extend({}, headers, {'Content-Type': 'application/json;charset=UTF-8'});
console.log(headers);
console.log(data);
console.log(angular.toJson(data));
return angular.toJson(data); // this will go in the body request
},
data : form
}).then(function(result) {
console.dir(result.data);
},function errorCallback(response) {
console.log(response);
});
};
I I do not understand why it does not accept..
You should to send a json data to your server
try this following code by adding 'Accept': 'application/json, */*' to your header:
var edit = function(form){
var token = window.localStorage.getItem('token');
$ionicLoading.show();
return $http({
method : 'POST',
url : API.url + '/user',
headers : {
Authorization : 'Bearer ' + token,
'Accept': 'application/json, */*'
},
transformRequest: function(data, headers){
console.log(headers);
headers = angular.extend({}, headers, {'Content-Type': 'application/json;charset=UTF-8'});
console.log(headers);
console.log(data);
console.log(angular.toJson(data));
return angular.toJson(data); // this will go in the body request
},
data : form
}).then(function(result) {
console.dir(result.data);
},function errorCallback(response) {
console.log(response);
});
I want to filter retrived sharepoint list using filterFilter.But it is giving ***error as:**angular.min.js:89 TypeError: filterFilter is not a function*****
Not able to inject filter to controller since am using $https.
Below is the code,
$scope.update=function()
{
$scope.drop=$scope.states.Id;
console.log($scope.drop);
$http({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/Lists/getByTitle('List')/items?$select=State/Title,Title,Id&$expand=State/Title",
method: "GET",
headers: { "Accept": "application/json; odata=verbose" }
})
.success(function (data, status, headers, config) {
$scope.city= filterFilter(data.d.results,{State:$scope.drop});
console.log($scope.city);
})
.error (function(data, status, headers, config) { })
}
Thank you for your reply ,i got my answer,Complete code is below
app.controller('Ctrl', function($filter,$scope,$http,filterFilter)
{
$http({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/Lists/getByTitle('States')/items",
method: "GET",
headers: { "Accept": "application/json; odata=verbose" }
})
.success(function (data, status, headers, config) {
$scope.State=data.d.results;
console.log($scope.State);
})
.error (function(data, status, headers, config) { })
$scope.update=function()
{
$scope.drop=$scope.states.Id;
console.log($scope.drop);
$http({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/Lists/getByTitle('City')/items?$select=State/Title,Title,Id,*&$expand=State",
method: "GET",
headers: { "Accept": "application/json; odata=verbose" }
})
.success(function (data, status, headers, config) {
$scope.city=filterFilter(data.d.results,{StateId:$scope.drop});
console.log($scope.city);
})
.error (function(data, status, headers, config) { })
}
});
If you use * in $select,Lookup field Id can be retrieved,using that you can compare :)
I have the following Action
[HttpPost]
[Route("api/client/log")]
public void SetClientLog([FromBody]string error)
{
ClientLogger.LogError(error);
}
And in angular i'm trying to post the following where log is just a string
$http({
method: 'POST',
url: "api/client/log",
data: log,
headers: {'Content-Type': 'application/json'}
});
Make sure you prefix your value with "=" and set the correct Content-Type:
$http.post('api/Companies/Search', "="+$scope.query, {
headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' }
})
.success(function (data, status) {
$scope.result = data;
})
.error(function (data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
This current code when ran returns TypeError: Services.updateUserData.set is not a function
Controller
Services.updateUserData.set($rootScope.user);
Services.js
this.updateUserData = function() {
return {
set: function(data) {
console.log(data);
$http({
method: 'POST',
url: 'api/data/',
data: {'data': data},
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
}).success(function(data, status, headers, config) {
console.log(data);
}).error(function(data, status, headers, config) {
console.log(data);
});
}
}
}
The code below works but I would much rather have a get and set function within updateUserData so that I am not duplicating work.
Current Code
Controller
Services.updateUserData($rootScope.user);
Services.js
this.updateUserData = function() {
console.log(data);
$http({
method: 'POST',
url: 'api/data/',
data: {'data': data},
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
}).success(function(data, status, headers, config) {
console.log(data);
}).error(function(data, status, headers, config) {
console.log(data);
});
}
updateUserData is a function and hence there is no property called set. The option is either convert it to object
this.updateUserData={set:function(){}}
or invoke it
Services.updateUserData().set($rootScope.user);
before accessing set
I've just started learning Angular.js. How do I re-write the following code in Angular.js?
var postData = "<RequestInfo> "
+ "<Event>GetPersons</Event> "
+ "</RequestInfo>";
var req = new XMLHttpRequest();
req.onreadystatechange = function () {
if (req.readyState == 4 || req.readyState == "complete") {
if (req.status == 200) {
console.log(req.responseText);
}
}
};
try {
req.open('POST', 'http://samedomain.com/GetPersons', false);
req.send(postData);
}
catch (e) {
console.log(e);
}
Here's what I have so far -
function TestController($scope) {
$scope.persons = $http({
url: 'http://samedomain.com/GetPersons',
method: "POST",
data: postData,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function (data, status, headers, config) {
$scope.data = data; // how do pass this to $scope.persons?
}).error(function (data, status, headers, config) {
$scope.status = status;
});
}
html
<div ng-controller="TestController">
<li ng-repeat="person in persons">{{person.name}}</li>
</div>
Am I in the right direction?
In your current function if you are assigning $scope.persons to $http which is a promise object as $http returns a promise object.
So instead of assigning scope.persons to $http you should assign $scope.persons inside the success of $http as mentioned below:
function TestController($scope, $http) {
$http({
url: 'http://samedomain.com/GetPersons',
method: "POST",
data: postData,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function (data, status, headers, config) {
$scope.persons = data; // assign $scope.persons here as promise is resolved here
}).error(function (data, status, headers, config) {
$scope.status = status;
});
}
Here is a variation of the solution given by Ajay beni. Using the method then allows to chain multiple promises, since the then returns a new promise.
function TestController($scope) {
$http({
url: 'http://samedomain.com/GetPersons',
method: "POST",
data: postData,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
.then(function(response) {
// success
},
function(response) { // optional
// failed
}
);
}
use $http:
AngularJS: API: $http
$http.post(url, data, [config]);
Implementation example:
$http.post('http://service.provider.com/api/endpoint', {
Description: 'Test Object',
TestType: 'PostTest'
}, {
headers {
'Authorization': 'Basic d2VudHdvcnRobWFuOkNoYW5nZV9tZQ==',
'Accept': 'application/json;odata=verbose'
}
}
).then(function (result) {
console.log('Success');
console.log(result);
}, function(error) {
console.log('Error:');
console.log(error);
});
Lets break this down: Url is a little obvious, so we skip that...
data: This is the body content of your postman request
{
Description: 'Test Object',
TestType: 'PostTest'
}
config: This is where we can inject headers, event handlers, caching... see AngularJS: API: $http: scroll down to config Headers are the most common postman variant of http that people struggle to replicate in angularJS
{
headers {
'Authorization': 'Basic d2VudHdvcnRobWFuOkNoYW5nZV9tZQ==',
'Accept': 'application/json;odata=verbose'
}
}
Response: the $http actions return an angular promise, I recommend using .then(successFunction, errorFunction) to process that promise see AngularJS: The Deferred API (Promises)
.then(function (result) {
console.log('Success');
console.log(result);
}, function(error) {
console.log('Error:');
console.log(error);
});