$scope.url = "http://localhost/MerchantProgramService.svc/GetMerchantProfile";
myXHRService.getData($scope.url).then(function(data) {
alert(data);
var xhrData = angular.fromJson(data);
// $scope.xhrData = xhrData.data.children;
});
I am trying to access web services with angularjs and i am failed to do it as i am new to angular.
POST http://localhost/MerchantProgramService.svc/GetMerchantProfile 404 (Not Found)
i am getting this error in console. i am using google chorme and using CORS extension to Access cross origin.
Related
I created a GitHub Pages project with AngularJS, the Angular content does not load from the json file, and I am getting a 404 error in the console:
Failed to load resource: the server responded with a status of 404 () birds.json
It is supposed to be just a client-side app. What is going on here? Does it have something to do with html5mode?
Repo
Demo
Related Questions:
Can one host an AngularJS based static blog on github?
AngularJS html5mode support on GitHub Pages
It's because your birds.json lies in the angular-birds directory. Try to change
var promise = $http.get('/birds.json').then(function (response) {
return response.data;
});
to
var promise = $http.get('angular-birds/birds.json').then(function (response) {
return response.data;
});
You may check out this AngularJS repository which I used to build and deploy my own website on github pages. Here is the demo.
I am trying to call soap webservice through angular js code but i am getting below exception while sending xml through xmlHttp.send method where xmlHttp is
var xmlHttp = SOAPClient._getXmlHttp();
Failed to load resource: the server responded with a status of 401 (Unauthorized).
When i sent the same request through soap UI Client,i am getting the correct response.I am also setting the credentials to validate the xml request through angular code given below:-
*app.factory("soapService", ['$soap',function($soap){
var base_url = "http://10.75.108.90:61001/SOAPRouterServlet/?javaBean=true";
$soap.setCredentials("ORWFMT01","******");
return {
GetUsers: function(){
return $soap.post(base_url,"enterNotesForJob",{"destination": "AT", "pck": "PCK<01069JobManagement123Clientuserid2001071912345678BT-0000000001339","callerId":"sss","besUserId":"*******","channel":"ORSI","jobNo":"GBB02001","e2EData":""});
}
}
}]);*
I am following this link for referral angular soap example
I am trying to implement login with Google in an Ionic browser based app. These are the commands I ran to install and create my app:
ionic start tracker sidemenu
cd tracker
cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git
ionic platform add browser
When I click my login button, the Google auth comes up ok. However when the callback is called I get a 404:
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:8100/callback?code=xxxxxx
This OAuth 2 Ionic example gave this code:
var clientId = 'xxxxxx-3rpu226qm-xxxxx.apps.googleusercontent.com';
var scope = 'profile email';
var ref = window.open('https://accounts.google.com/o/oauth2/auth?client_id=' + clientId +
'&redirect_uri=http://localhost:8100/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) {
console.log('listener event.url: ' + event.url);
if ((event.url).startsWith("http://localhost:8100/callback")) {
var requestToken = (event.url).split("code=")[1];
console.log('request token from google: ' + requestToken);
ref.close();
}
});
Why isn't the eventListener catching the callback?
Its a known issue of the cordova-plugin-inappbrowser that loadstart and loaderror events are not being fired in the browser.
Source: https://github.com/apache/cordova-plugin-inappbrowser#browser-quirks-1
You might want to look at an other javascript library like hello.js for the browser case (https://adodson.com/hello.js/#hellojs). Or implement it yourself. Here you can find an example for how to do it for google oath2 yourself: https://developers.google.com/identity/protocols/OAuth2UserAgent
I've used this solution to disable web security in Chrome so I can have localhost:8100 served by Ionic and localhost:8000 served by Laravel communicate without XSS issues, but now I'm getting this error in my Chrome console:
POST localhost:8000/api/user net::ERR_UNKNOWN_URL_SCHEME
I found a couple different solutions for this, but they all seem to be related to third-party services being used on mobile devices (ex. OAuth), old Chromium bugs, or a few Chrome apps, but I'm just trying to round trip with my RESTful endpoints using Ionic/AngularJS ngResource and Laravel's RESTful routing in my development environment.
I'm using an interceptor to switch between asset and API requests:
.factory('API', ['ConfigSettings',
function (ConfigSettings) {
var service = {
request: function (config) {
if (config.url.indexOf("/api") > -1) {
config.url = ConfigSettings.host + ':' + ConfigSettings.port + config.url;
}
return config;
}
}
return service;
}])
.config(['$httpProvider', function ($httpProvider) {
$httpProvider.interceptors.push('API');
}]);
Anyone know what this error means in my case and how to fix it?
I have a WebAPI method here:
http://localhost:50463/api/movies
and when accessing it from a browser it loads perfectly.
In my project (the same project as where Web API resides) when calling the method from AngularJS I get an error 500:
Failed to load resource: the server responded with a status of 500 (Internal Server Error)
When I click the link in the error it loads the data perfectly.
The routing for WebAPI is as follows:
config.Routes.MapHttpRoute("DefaultApiGet", "Api/{controller}",
new {action = "Get"},
new {httpMethod = new HttpMethodConstraint(HttpMethod.Get)}
);
This is the angular call
app.factory('dataFactory', function ($http) {
var factory = {};
factory.data = function (callback) {
$http.get('/api/movies').success(callback);
};
return factory;
});
I added this javascript just to rule-out angular, I get the same:
$.ajax({
url: "/api/movies",
type: 'GET',
//data: "{ 'ID': " + id + "}",
contentType: "application/json; charset=utf-8",
success: function(data) {
alert(data);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(thrownError);
}
});
Any idea what I have done wrong?
I assume your Web API and AngularJS app are running on a different port. In this case you are running in a Same-Origin-Policy issue.
Ensure your Web API is responding with HTTP CORS headers e.g.:
Access-Control-Allow-Origin: http://<angular_domain>:<angular_port>
or
Access-Control-Allow-Origin: *
Doesn't look like a CORS issue to me as you are using a relative URL in your $.ajax() request.
Did you try $.getJSON("/api/movies").then(successHandler, faulureHandler)
Not sure of that will help but for one you are sending a contentType header with a GET request which contains no content. There should be an Accept header instead, but WebAPI should be fine without one.
I would also remove the constrains from the routing and revert back to the default route mapping to see if the problem is there.
config.Routes.MapHttpRoute("DefaultApi",
"api/{controller}/{id}",
new {id = RouteParameter.Optional});