Laravel 4 + AngularJS (AJAX Request) - ajax

im having a problem retrieving information using my Angular Service from my back end (Laravel 4)
Im just getting error 404
this is my angular service
angular.module("SistelApp.Services.ArticleService", [])
.factory("ArticleService", ["$http", function($http) {
var doRequest = function(location) {
return $http({
method: 'GET',
url: "http://localhost/sistel/" + location + "Service"
});
};
return {
articles: function(location) {
return doRequest(location);
}
};
}]);
this is the laravel route:
Route::get("/homeService", "HomeController#getArticles");
homeController
public function getArticles() {
$array = array();
$array["name"] = "myName";
$array["lastname"] = "myLastName";
return Response::json($array);
}
Using Postman (the chrome app) if i go to the route 'HomeService' i succesfully get the data back in json format... but in my angular app i get Error 404 for /HomeService
am i missing something???

It looks like there is mistake in your code. You are missing '+':
var doRequest = function(location) {
return $http({
method: 'GET',
url: "http://localhost/sistel/" + location + "Service"
});
};

I fixed it! ... I WAS MISSING SOMETHING...
the url: "http://localhost/sistel/" + location + "Service" IS WRONG
because Laravel is routing from "http://localhost/sistel/public/
... adding the "public/" fixed my issue.. ty anyway :D

Related

How to get each http body updates on angular Http request?

I'm using an express api (my back-end) and an angular app (my front-end).
One express js end point (let's call it '/foo') is processing a lot of files,
i send data using res.write() after each treatment so the http response body is update.
I would like to get this update on my angular app.
I was using ajax in a previous version and it worked fine with ajax call :
xhrFields: {
// Getting on progress streaming response
onprogress: function(e)
{
var progressResponse;
var response = e.currentTarget.response;
if(lastResponseLength === false)
{
progressResponse = response;
lastResponseLength = response.length;
}
else
{
progressResponse = response.substring(lastResponseLength);
lastResponseLength = response.length;
}
actualResponse += progressResponse
}
Unfortunatly i found nothing to get partial http body. I tried to use 'reportProgress' Parameter but it's not working.
For some more context my front-end angular code:
service.ts :
setHolidaysDirectory(holidaysKey: string, path: string): Observable<Object>{
const setHolidayDirectoryStreamHttpRequest =
new HttpRequest('POST', 'http://localhost:8089/holidays/pictures/edit', { 'key': holidaysKey,
'path': path
}, {headers: this._httpHeaders, reportProgress: true, responseType: 'text'});
// pipe stream answer
return this._http.request(setHolidayDirectoryStreamHttpRequest);
}
and my component just call the service and subscribe :
this._holidaysService
.setHolidaysDirectory(key, finalHolidaysForm.path)
.subscribe((stream) => {
console.log('new answer');
console.log(stream);
}, error => console.log(error));
But unfortunatly i got empty answer and all the http body is recovered after res.end() (server side)
Can anyone help pls !
Thank a lot !

Yahoo OAuth2 Error 95022

When trying to get a request token for an app, it gets the error:
Oops. Yahoo is unable to process your request. We recommend that you
contact the owner of the application or web site to resolve this
issue. [95022] Close
This is the code raising the error:
var main = angular.module("main", ["ngRoute"]);
main.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'partials/login.html',
controller: 'loginController'
})
});
main.controller("loginController", function ($scope) {
$scope.login = function () {
var clientID = "[redacted]";
window.location.href = "https://api.login.yahoo.com/oauth2/request_auth?client_id=" + clientID + "&redirect_uri=http://www.acleanpairofshorts.com&response_type=token&language=en-us";
};
});
You need to URL-encode the value of the redirect_uri parameter or else the arguments following that will be interpreted as part of that instead of the actual URL.

RESTful Express Mongoose & Backbone - Backbone model.remove() not working

I'm developing a Node app using Express, Mongoose and Backbone with Marionette.
All routes are working well except the delete route.
If I call this.model.destroy, I always get this error:
DELETE http://localhost:3000/api/user 404 (Not Found)
The 404 is returned in Express's delete route, like if Express didn't support it, but I've seen numerous examples across the web using it.
Here's my setup:
Mongoose Schema:
var UserSchema = new mongoose.Schema(
{
name: String,
email: String,
age: Number
});
User = mongoose.model('User', UserSchema);
ExpressJS Route: (not working)
app.del('/api/user/:id', user.remove);
OR
app.delete('/api/user/:id', user.remove);
This route is called by backbone model.destroy(), but returns error 404.
ExpressJS user.js controller: (works but is not reached because of the 404 before)
exports.remove = function(req, res)
{
var id = req.params.id;
User.findById(req.params.id, function(err, user)
{
user.remove(function(err)
{
if(err) res.json(err);
res.json('all good');
});
});
};
BackboneJS Model
var User = Backbone.Model.extend({
idAttribute: "_id",
url: '/api/user/',
});
BackboneJS client View
var UserView = Backbone.Marionette.ItemView.extend(
{
template: Handlebars.compile($('#userView').html()),
events:
{
'click .delete-button': 'deleteUser'
},
deleteUser: function(event)
{
this.model.remove();
}
});
I always get this error:
DELETE http://localhost:3000/api/user 404 (Not Found)
HOWEVER it works if I use this direct ajax call:
jQuery.ajax({
url:'/api/user/' + this.model.id,
type: 'DELETE',
success:function(data, textStatus, jqXHR)
{
}
});
So, why does this work if I call the route via Ajax, if Backbone internally also uses Ajax? Why does Backbone fail to make such a simple model.destroy()?
Is there a way to configure Backbone Model.destroy method to work well like the Ajax example above? Thanks
Found the problem. Backbone model.remove() was not sending the id because I was using "url" in this way:
Backbone.Model.extend({
url: '/users',
//...
});
That will tell Backbone to use exactly /users as the URL for all actions.
To ensure sending the id using "url", one can use a function:
url: function() {
return '/list_items/' + encodeURIComponent(this.id)
}
Or even better use "urlRoot" instead of "url", let the default "url" function add the id:
urlRoot: '/users'
Working like a charm with urlRoot

Dot Net Nuke Ajax Response Returning HTML

I can't seem to get a JSON response from an Ajax post within a Dot Net Nuke site. It returns HTML as a response instead.
I was able to get this to work in a normal test site just fine and am wondering if anybody may know what I need to do.
Below is the code I'm testing with for now:
JavaScript:
$("#ClearTaxFormButton").click(function (e) {
e.preventDefault();
var testValue = 7;
$.ajax({
type: "GET",
url: "localhost/mywebsite/tabid/100/Default.aspx/SumbitByAjaxTest",
data: '{ "taxRate":' + testValue + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
// Replace the div's content with the page method's return.
//$("#Result").text(msg.d);
alert(msg.d);
}
});
});
C# Function:
//just using ths for testing
[WebMethod]
public static string SumbitByAjaxTest(string taxRate)
{
return taxRate;
}
Like I said, this exact code (aside from a different URL) works fine in a normal .NET site but when I move it over to the Dot Net Nuke site, it returns HTML.
Any ideas??
DNN's service layer allows you to follow a Webapi like approach, I think you'll find that easier for controlling the data to/from.
Here's an example of a controller for an open source articles module
https://dnnsimplearticle.codeplex.com/SourceControl/latest#cs/services/DnnSimpleArticleController.cs
Something like
public HttpResponseMessage GetAllArticles(int portalId, bool sortAsc)
{
try
{
//todo: get the latest X articles?
var articles = ArticleController.GetAllArticles(portalId, sortAsc);
//because of the circular reference when cerealizing the taxonomy within content items we have to build out our article view models manually.
var cleanArticles = new List<ArticleViewModel>();
foreach (Article a in articles)
{
var newArt = new ArticleViewModel
{
ArticleId = a.ArticleId,
Body = WebUtility.HtmlDecode(a.Body),
CreatedByUser = a.CreatedByUser,
CreatedByUserId = a.CreatedByUserId,
CreatedOnDate = a.CreatedOnDate,
Description = WebUtility.HtmlDecode(a.Description),
LastModifiedByUser = a.LastUpdatedByUser,
LastModifiedByUserId = a.LastModifiedByUserId,
LastModifiedOnDate = a.LastModifiedOnDate,
ModuleId = a.ModuleId,
Title = a.Title,
url = DotNetNuke.Common.Globals.NavigateURL(a.TabID, "", "&aid=" + a.ArticleId)
};
cleanArticles.Add(newArt);
}
var articleViewModels = new ArticleViewModels
{
Articles = cleanArticles
};
return Request.CreateResponse(HttpStatusCode.OK, articles);
}
catch (Exception exc)
{
DnnLog.Error(exc); //todo: obsolete
return Request.CreateResponse(HttpStatusCode.BadRequest, "error in request"); //todo: probably should localize that?
}
}

prototype javascript ajax request runs back end perl script but continues to return 500

Newbie to this - This code is works - in that the call to the script does what it is supposed to but returns the condition 500 and I can not see why. I am looking for any suggestions or changes that I should be making to make this work.
Thanks to all who respond.
function get_update_odometer(vehicle_key,odometer_value){
var url = "[%Catalyst.uri_for('/invoice/dispatch_util/get_update_odometer')%]";
new Ajax.Request(url, {
method: 'get',
parameters: {
key: vehicle_key,
ovalue: odometer_value
},
asynchronous:false,
onSuccess: successFunc,
onFailure: failureFunc
});
var return_v = $('rcontainer').innerHTML;
document.getElementById('odometer').value = return_v;
return true;
}
function successFunc(response){
if (200 == response.status){
var container = $('rcontainer');
var content = response.responseText;
container.update(content);
}
}
function failureFunc(response){
alert("Call has failed " + response.status );
}
Error code is coming from server side, and you provided the client part.
So have a look if your server script get_update_odometer is working, is callable by your web server and etc ...

Resources