Angular JS - can't receive any response using $http.post

Question

I'm trying to get a response from a web service using Angular JS, which I can perfectly reach via my shell using a simple curl command:

curl --header "Content-type: application/json" --request POST 
     --data '{"username": "name", "password": "pwd"}' 192.168.2.1:9000/ws/login

However, when I try to reach it using Angular with an $http.post I experience some "funny" behaviour.

While my data are:

    var url = "192.168.2.1:9000/ws/login"
    var postData = {
        username: un,
        password: pwd
    }

I've tried both postData as a JSON object and as a stringified JSON

Using a call like this:

    $http.post( url, postData ).
        success(function(data) {
        console.log(data)
        }).
        error(function(data, status, headers, config) {
            console.log(data, status, headers, config)
        })

or even

    $http({
        url: url,
        method: 'POST',
        data: JSON.stringify(postData),
        headers: {'Content-type': 'application/json'}
        }).
        success(function(data, status, headers, config) {
            console.log('Success: ', data, status, headers, config)

        }).
        error(function(data, status, headers, config) {
            console.log('Error: ', data, status, headers, config)

        })

Simply do nothing.
Nothing at all!

Prepending an http:// to the url instead, gives me:

OPTIONS http://192.168.2.1:9000/ws/login 404 (Not Found) angular.js:7073
OPTIONS http://192.168.2.1:9000/ws/login Origin http://localhost:9000 is not allowed by Access-Control-Allow-Origin.

I'm really really lost... any advice would be much appreciated!

What if you run the server locally on the same box you are making the post? Have you tried not adding headers? — Foo L
– Foo L, Commented Oct 28, 2013 at 17:55
I think you answered the question yourself... OPTIONS 192.168.2.1:9000/ws/login Origin localhost:9000 is not allowed by Access-Control-Allow-Origin. Your web service is running on 192.168.2.1:9000 while your angular app is running on localhost:9000. You cannot make AJAX requests to a different site (combination of scheme:host:port). Read more here: en.wikipedia.org/wiki/Same-origin_policy You may need to do something like this: better-inter.net/enabling-cors-in-angular-js — Adam
– Adam, Commented Oct 28, 2013 at 18:36

Community · Accepted Answer · 2017-05-23 12:21:10Z

1

I've managed to get a CORS setup up & running.

The server side for my case was far from trivial, since we're using Play! framework and modern browsers sends an OPTION method before sending the real POST method, to be somewhat "pre-authorized" to send the CORS request.

As stated in http://better-inter.net/enabling-cors-in-angular-js/ I had to add

        $http.defaults.useXDomain = true;

prior of the actual $http.post, but I didn't had to delete the 'Content-Type' header

Should you ever use a similar setup, I would reccomend taking a look on these resources:

Play 2.0.1 and setting Access-Control-Allow-Origin
Play! 2.0 easy fix to OPTIONS response for router catch-all?

edited May 23, 2017 at 12:21

CommunityBot

11 silver badge

answered Oct 30, 2013 at 17:14

domokun

3,0034 gold badges32 silver badges56 bronze badges

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

Comments

user2241980 · Accepted Answer · 2013-10-28 18:50:09Z

0

As Adam said!

If you are using apache:

 Header set Access-Control-Allow-Origin:  http://domain.com, http://localhost/

or just

Header set Access-Control-Allow-Origin: *

Do this only for testing. For production limit the origin to only your domain.

answered Oct 28, 2013 at 18:50

user2241980

1 Comment

domokun Over a year ago

@Adam Indeed it's a SAME-ORIGIN issue, the first 404 mislead me. However, I need to deal with this issue in some way, since it's not possibile for my case to have the web services and the same server of angular. ATM I'm using python SimpleHTTPServer to test my angular app, though i doubt I can configure the ORIGIN headers. It is possibile to suppress the header sending or something like that (as Adam suggested with django)?

Collectives™ on Stack Overflow

Angular JS - can't receive any response using $http.post

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related