Получение токена заголовка HTTP

Question

Я работаю над проектом и столкнулся с проблемой, которую до сих пор не смог решить.

Проект представляет собой мобильное веб-приложение, созданное с использованием мобильного фреймворка jquery. Веб-приложение может извлекать json из службы wcf и отображать его, используя эффекты мобильного интерфейса jquery. Мы достигли стадии, когда мы внедряем безопасность на основе токенов, и в этом моя проблема. На данный момент я хочу добавить пользовательский заголовок HTTP, который я буду использовать для всех других моих запросов ajax.

function login_service()
{
    //$.mobile.pageLoading();
    var stringUsername = $('#txtUsername').val();
    var stringPassword = $('#txtPassword').val();
    $('#loginMessage').empty(); // Empty message div        
$.ajax(
    {
        url: "urlstring"+stringUsername+"/"+stringPassword, // This URL uses https
        dataType: "jsonp",
        type: 'GET',
        beforeSend: setHeader,
        success: function(loginResult)
        {
            $('#loginMessage').html('<a>'+ loginResult.tkt + '</a>');
            tkn = loginResult.tkt; // Json token
            if(tkn == null)
            {
            $('#loginMessage').append("invalid login:" + '&nbsp;' + '<br>' + "token:" + '&nbsp;' + tkn);
            $.mobile.pageLoading(true);
            }
            else
            {
                $.mobile.changePage('#search'); // Change page to search screen
            }

        },
        error: function(status)
        {
            alert(status);
            $.mobile.pageLoading(true); // End loading animation
        }
    })
}

function setHeader(xhr) 
{                
    xhr.setRequestHeader('Authorization', tkn); 
    alert("header set");              
} 

function doSearch_webservice(){ // Start of function webservice
$.ajax({ // Start of ajax call
url: "urlstring"+$('#jsonSearch').val(), // If URL string is http, custom header will
         // be displayed in fiddler/firebug. IF HTTPS custom header won't work.
dataType: 'jsonp',
type: 'GET',
timeout: '20000',
beforeSend: setHeader,
success: function(json_results)
    {// Start of success function 
        if(json_results.keys == null)
            {
                $('#errMessage').html('<p class="error"><strong>'+ "Status:" 
                + "No record found" + "<br>Please try again" +'</strong> </p>');    
                $.mobile.pageLoading(true);
            }
        else
            {

                $('#jsonResponse ul').remove();
                // jquery mobile type i.e. data-inset
                $('#jsonResponse').append('<ul class="listItems" data-role="listview"  data-inset="true"></ul>');
                var listItems = $('#jsonResponse').find('ul');
                $.each(json_results.keys, function(key) { // Start of each loop

                html= 
                '<a href="#" data-transition="slide" data-position="inline"OnClick="passQryStrg(\''+json_results.keys[key].id+'\' ,  \''+json_results.keys[key].cat+'\' );">'+'<br>'+' '+'<font class="big-text"><b>'+' '+json_results.keys[key].lbl[0]+' '+'</font></b>'+' '+'<font class="small-text">'+' '+'<br>'+' '+json_results.keys[key].lbl[1]+' '+'</font>'+'</a>'

                listItems.append('<li>'+html+'</li>');
                }); // End of each loop
            $('#info jsonResponse ul').listview();
            $.mobile.pageLoading(true); 
            $.mobile.changePage( "#info", { transition: "slide"} );
            $("#info").page("destroy").page(); 
            }
                 // Destroy the page - next function call won't break css
        }, // End of success function   
        error: function(jqXHR, textStatus, errorThrown)
            {
                $('#errMessage').html('<p class="error"><strong>'+ "Status:" + textStatus + "<br>Please try again" +'</strong> </p>');  
                $.mobile.pageLoading(true);
                }
            }); // End of ajax call 
}; // Emd of webservice function

Резюме: Я могу добавить пользовательский заголовок, если запрос do_search ajax использует URL-адрес http. Однако мне нужно изменить URL на https, который использует наш сервис wcf. Когда я делаю это изменение, пользовательский заголовок перестает работать. Извиняюсь, если мое объяснение неясно, я постараюсь ответить на ответы как можно лучше.

Спасибо

Answer 1

Я решил проблему, с которой столкнулся.

При использовании объекта xmlHttpRequest для создания настраиваемого заголовка HTTP-запроса. Или в моем случае, так как я использую jquery, запрос ajax. И веб-страница, выполняющая запрос, и сам запрос должны использовать URL с одинаковым протоколом. Например. HTTPS. Если веб-страница имеет URL-адрес http и выполняет запрос ajax с https, это не будет работать.

Это из-за той же политики происхождения, которая определена в http://www.w3.org/Security/wiki/Same_Origin_Policy, не допускает этого. Это для защиты сайтов от уязвимостей безопасности. Без такой безопасности скрипты могут использовать уязвимости веб-сайтов.

Надеюсь, это поможет любому, кто застрянет на этой конкретной проблеме.

Answer 2

Вы должны использовать опции headers jQuery.ajax () .

Карта дополнительных пар ключ / значение заголовка для отправки вместе с запросом

Так что вам нужно будет передать заголовки следующим образом:

$('...').ajax(function() {
  url: ... ,
  data: ... ,
  headers: {
    'Authorization': tkn
  }
});

Если ваш токен JSON является строкой, просто преобразуйте его раньше с помощью jQuery.parseJSON () :

var tkn = $.parseJSON(tokenString);