Jquery+wcf. Problem with basic authentication

Question

My service is secured with basic authentication set in IIS and i am try to get data from service with Jquery.

Cross domain calls is enabled.

I have next request headers

Host http:\\service.com
User-Agent Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0
Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language en-gb,en;q=0.5
Accept-Encoding gzip, deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection keep-alive
Origin null
Access-Control-Request-Me... GET
Access-Control-Request-He... authorization
Pragma no-cache
Cache-Control no-cache

Responses

Content-Type text/html
Server Microsoft-IIS/7.5
WWW-Authenticate Basic realm="172.27.131.5"
X-Powered-By ASP.NET
Access-Control-Allow-Orig... *
Access-Control-Allow-Head... *
Date Fri, 12 Aug 2011 08:07:29 GMT
Content-Length 1293

Code

 $.ajax({
     headers : {
        "Authorization" : "Basic TVNF3TQtU1BGMjAx6C12bVxzbW4ydHBvaW50OlF3Z5J0eSEyM6Q1"
     },
     type: "GET",
     url: url,
     contentType: "application/json; charset=utf-8",
     dataType: "json",
     success: function(data) {
      alert('ok!');
      formatData(format_type,data);
     },
     error: function(jqXHR, textStatus, errorThrown) {
          alert(textStatus + ' / ' + errorThrown);
     }
  });

also i tried to set

 beforeSend : function(xhr) {
      xhr.setRequestHeader("Authorization", "Basic " + Base64.encode(username + ':' + password));
        },

But i have next error:

Request header field Authorization is not allowed by Access-Control-Allow-Headers

What i am doing wrong?

try the ajax call without the headers

John x
– John x

2011-08-12 08:40:24 +00:00
Commented Aug 12, 2011 at 8:40 — John x
– John x, Commented Aug 12, 2011 at 8:40
So how service will authentificate?

Ievgen
– Ievgen

2011-08-12 08:42:45 +00:00
Commented Aug 12, 2011 at 8:42 — Ievgen
– Ievgen, Commented Aug 12, 2011 at 8:42

Luuk · Accepted Answer · 2011-10-30 21:11:29Z

Try adding the following code to the global.asax in your WCF project (only works when hosted in iis):

protected void Application_BeginRequest(object sender, EventArgs e)
{
    EnableCrossDomainAjaxCall();
}

private void EnableCrossDomainAjaxCall()
{
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");

    if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
    {
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST");
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Authorization, Accept");
        HttpContext.Current.Response.End();
    }
}

Jquery issues an OPTIONS call to the WCF service to check if the call is allowed. You'll have to match the exact header. You can also download an example here: http://sameproblemmorecode.blogspot.com/2011/10/creating-secure-restfull-wcf-service.html.

Rafay · Accepted Answer · 2011-08-12 09:17:38Z

1

you need to enable the cross domain in your ajax call

$.ajax({
     headers : {
        "Authorization" : "Basic TVNF3TQtU1BGMjAx6C12bVxzbW4ydHBvaW50OlF3Z5J0eSEyM6Q1"
     },
     type: "GET",
     url: url,
     crossDomain:true, <--
     xhrFields: {
        withCredentials: true
     }, 
     contentType: "application/json; charset=utf-8",
     dataType: "json",
     success: function(data) {
      alert('ok!');
      formatData(format_type,data);
     },
     error: function(jqXHR, textStatus, errorThrown) {
          alert(textStatus + ' / ' + errorThrown);
     }
  });

edited Aug 12, 2011 at 9:17

answered Aug 12, 2011 at 8:31

Rafay

31.1k5 gold badges71 silver badges106 bronze badges

Comments

Juan Mellado · Accepted Answer · 2012-04-30 13:16:04Z

1

$.ajax({
    url: 'https://www.tejastank.com/moderator/v1/series?key='+key,
    data: myData,
    type: 'GET',
    crossDomain: true,
    dataType: 'jsonp',
    success: function() { alert("Success"); },
    error: function() { alert('Failed!'); },
    beforeSend: setHeader
});

Solve the Access-Control-Allow-Origin error modifying the dataType parameter to dataType:'jsonp' and adding a crossDomain:true.

edited Apr 30, 2012 at 13:16

Juan Mellado

15.2k5 gold badges50 silver badges54 bronze badges

answered Apr 30, 2012 at 13:14

tejas tank

111 bronze badge

Collectives™ on Stack Overflow

Jquery+wcf. Problem with basic authentication

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related