How to add dataType property of ajax in $http of angular?

Question

I want to make a rest call to server using Angular but I am block I tried with traditional jQuery ajax call with Basic Authorization header looks something like this:

        jQuery.ajax({
            url: "http://localhost:8080/public/emp",
            type: "GET",
            dataType:"jsonp",
            Accept : "application/json",
            contentType: "application/json",
            headers: {
                'Authorization': 'Basic XXXXXXXXXXX'
            },
            success: function (data){
                alert(data);
            },
            error: function(){
                alert('Error');
            }
        });

It works perfectly and Data is retrieved.

But When I try to convert it with $http of AngularJs. Something like this:

        $http({
            method:'GET',
            url : 'http://localhost:8080/public/emp',
            headers: {'Authorization': 'Basic XXXXXXXXXX',"content-type":"application/json","Accept" : "application/json"}})
        .success(function (data) {
            alert("success");
        })
        .error(function (error) {
            alert("error");
        });

Its giving me Error 401 - Unauthorized

How can I add dataType property to $http? I have tried this link of stack overflow but Still unable to get a solution.

2ooom · Accepted Answer · 2014-09-10 07:28:28Z

1

Did you try $http.jsonp method? For your case this should work like this:

$http.jsonp('http://localhost:8080/public/emp', {
        headers: {
            'Authorization': 'Basic XXXXXXXXXX',
            "content-type":"application/json",
            "Accept" : "application/json"
        }});

Also here is working plunker example. And more general one from angular team

edited Sep 10, 2014 at 7:28

answered Sep 10, 2014 at 7:12

2ooom

1,7601 gold badge23 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rahul Jadav Over a year ago

Thanks, The call completed but Its callbacked in error response. Moreover this being a REST call how can I mention it is a GET request so that server responds correctly ?

Rahul Jadav Over a year ago

I got it working and data is also retrieved by adding third parameter data-type somethin like this: [{'data-type':"json"}] but I am getting the callback in error function.

2ooom Over a year ago

@user3256761 this is already GET request. Here is example for both Angular and jQuery jsonp requests. You can see that the only difference they have is the callback function. If you can craft a sample this could help.

Shohel · Accepted Answer · 2014-09-10 07:42:00Z

Try this get method

In js

$http({
                url: 'customUrl',
                method: 'GET',
                params: {},
            }).then(function (result) {
                return result;
            }).catch(function (e) {
                throw e;
            });

In api

[HttpGet]
    public string GetDraftData(byte id)
    {
        return string;
    }

Try this post method

In js

                $http({
                    url: 'customUrl',
                    method: 'POST',
                    data: yourJsonData,
                    headers: { 'Content-Type': 'application/json; charset=UTF-8' },
                    //params: { jsonData: "I am shohel rana" },
                    //timeout: 10,
                    //cache: false,
                    //transformRequest: false,
                    //transformResponse: false
                }).then(function (success) {
                    return success;
                }).catch(function (e) {
                    throw e;
                });

In api

       [HttpPost]
        public bool SaveDraft([FromBody]object draft)
        {
            try
            {
                return _iDraftDataSvc.InsertDraftData(draft);
            }
            catch (Exception)
            {
                throw;
            }
        }

Yodacheese · Accepted Answer · 2015-03-08 10:33:49Z

0

Try changing the method from GET to JSONP. I'm not quite sure if it's possible to add custom headers though (as I've heard), I haven't tried that yet.

$http({
    method:'JSONP',
    url : 'http://localhost:8080/public/emp',
    headers: {'Authorization': 'Basic XXXXXXXXXX',"content-type":"application/json","Accept" : "application/json"}})
.success(function (data) {
    alert("success");
})
.error(function (error) {
    alert("error");
});

answered Mar 8, 2015 at 10:33

Yodacheese

5,0975 gold badges36 silver badges44 bronze badges

Collectives™ on Stack Overflow

How to add dataType property of ajax in $http of angular?

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related