Sending Ajax request with Basic Authentication and Raw data

Question

I m making ajax call like this :

            var username = "someusername";
            var password= "somepassword";

    var datam = '{"description":"my description","account":"mehame","username":"hakan","password":"11"}';

    $.ajax
            ({
                url: "http://mywebsite.com:8080/directory/send",
                contentType: "application/json",
                data: datam,
                dataType: 'text',
                type: "PUT",
                headers: {
                    "Authorization": btoa(username + ":" + password)
                  },
                beforeSend: function (){
                    //xhr.setRequestHeader('Authorization', make_base_auth(username, password));
                    console.log(datam);
                },
                success: function (){
                    alert("Here's lots of data, just a string: " + datam);
                },
                error : function(){
                    alert("Here's lots of data, just a string: " + datam);
                }
            });

        });

And firebug console gave me "Cross Domain Error" (and returned error) :

"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://mywebsite.com:8080/directory/send. This can be fixed by moving the resource to the same domain or enabling CORS."

But in my chrome extensions name is "PostMan" its completely working.

What is different?

Then in your java file in backend , check for valid data(Usernm+pwd), If correct ,return True response to ajax else False.Its simpla — Pratik Joshi, Jun 13 '14 at 13:15
Its true. Work on the chrome extensions. But in html page doesn't work. — mehmetakifalp, Jun 13 '14 at 13:16
No I m not using JSP or JSF. I M using plain html. In My backend I m using java. — mehmetakifalp, Jun 13 '14 at 13:23
@ᾠῗᵲᄐᶌ okey I understand and I know CORS Policy. But, chrome extensions working successfully, how? — mehmetakifalp, Jun 13 '14 at 13:31
@mehmetakifalp - https://developer.chrome.com/extensions/xhr - `Regular web pages can use the XMLHttpRequest object to send and receive data from remote servers, but they're limited by the same origin policy. Extensions aren't so limited. An extension can talk to remote servers outside of its origin, as long as it first requests cross-origin permissions.` — wirey00, Jun 13 '14 at 15:24

score 0 · Answer 1 · edited May 23 '17 at 12:13

0

Due to same-origin policy, you can't execute ajax request on a foreign hostname or port number. http://en.wikipedia.org/wiki/Same-origin_policy

You must enable CORS in your http headers : http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

You can also see this post to know how to do that : cant get CORS working in chrome and firefox

edited May 23 '17 at 12:13

Community

1
1

answered Jun 13 '14 at 13:13

Rey0bs

1,192
12
19

Sending Ajax request with Basic Authentication and Raw data

1 Answers1