Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Naveed Ali 161 posts 426 karma points
    Nov 24, 2016 @ 22:15
    Naveed Ali
    0

    Help Umbraco API!

    Hi,

    I am trying to call my API method via angular.

    but I keep getting a 404.

    I have tried to access the api method via the browser and get this:

    <Error>
    <Message>
    No HTTP resource was found that matches the request URI 'http://localhost:51247/umbraco/api/CreateMember/NewMember'.
    </Message>
    <MessageDetail>
    No action was found on the controller 'CreateMember' that matches the request.
    </MessageDetail>
    </Error>
    

    This is my API controller:

        using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Http;
    using Umbraco.Web.WebApi;
    
    namespace FirstSite.Controllers.Api
    {
        public class CreateMemberController : UmbracoApiController
        {
    
            // GET: CreateMember
            [HttpPost]
            public bool NewMember(string aFirstName, string aEmail, string aPhone)
            {
                try
                {
                    var Name = aFirstName;
                    var Email = aEmail;
                    var Phone = aPhone;
                    return true;
                }
                catch (Exception)
                {
    
                    return false;
                }
    
            }
    
        }
    }
    

    and my angular controller calling the URL:

    angular.module('myApp').factory('registrationService', ['$http',
        function ($http) {
            return {
    
                logMember: function (name, email, phone) {
                    return $http({
                        method: 'POST',
                        params: {
                            aFirstName: name,
                            aEmail: email,
                            aPhone: phone,
                        },
                        url: '/Umbraco/Api/CreateMember/NewMember/'
                    });
                },
            }
        }]
    );
    

    I have tried everything I can find on stackoverflow and now am stuck

    can someone please shed some light on this please

    Thanks

    Nav

  • Steve Morgan 1348 posts 4457 karma points c-trib
    Nov 25, 2016 @ 11:44
    Steve Morgan
    1

    Hi Nav,

    WebApi (which the Umbraco API is built on) doesn't like using value types or strings as parameters - you need to "bind" it to a custom class. I did once find the explanation as to why but I can't find the article now. I suspect it's because the JSON deserializer in the background needs a class defined?!

    So the easy solution is to create a class / model to define the data you're passing in.

    Either way this should work (NOTE I've not tested your Angular - but this worked on my quick Jquery example).

    namespace FirstSite.Controllers.Api
    {
        public class CreateMemberController : UmbracoApiController
        {
            // POST: NewMember
            [HttpPost]
            public bool NewMember(CustomMember newMember)
            {
                try
                {
                    var Name = newMember.aFirstName;
                    var Email = newMember.aEmail;
                    var Phone = newMember.aPhone;
                    return true;
                }
                catch (Exception)
                {
    
                    return false;
                }
            }
        }
    
        public class CustomMember
        {
            public string aFirstName { get; set; }
            public string aEmail { get; set; }
            public string aPhone { get; set; }
        }
    }
    

    In case you need it - here is my noddy jquery test:

        var name = "Steve";
    var email = "[email protected]";
    var phone = "123456";
    
    
    $.ajax({
        url: '/Umbraco/Api/CreateMember/NewMember',
        type: 'post',
        dataType: 'json',
        success: function (data) {
            $('#target').html(data.msg);
        },
        data: {
            aFirstName: name,
            aEmail: email,
            aPhone: phone,
        },
    }); 
    

    HTH

    Steve

  • Steve Morgan 1348 posts 4457 karma points c-trib
    Nov 25, 2016 @ 12:05
  • Naveed Ali 161 posts 426 karma points
    Nov 25, 2016 @ 14:26
    Naveed Ali
    0

    Hi Steve,

    Thanks for the reply. i will give that a go.

    Still not sure how it does not work as just checked a similar solution on another project ( earlier version 7 Umbraco) I did and I passed through strings and a int fine using same method through angular

    Not sure if there is something maybe in my rout.config that is stopping this now as this solution in question is using the latest version of umbraco

    Ill give the above a ago and let you know how I get on

    Thanks

    Nav

  • Steve Morgan 1348 posts 4457 karma points c-trib
    Nov 25, 2016 @ 14:57
    Steve Morgan
    0

    Hi,

    Yes - you pass them from Angular as a collection of strings / value types etc but they need to bind to a model / class on the API end.

    So no changes required to your Angular code but try the tweak to your api.

    Steve

Please Sign in or register to post replies

Write your reply to:

Draft