2011-12-14 8 views
13

Jeśli wykonamy window.location = "http://MyApi.com/Pdf";, przeglądarka wykona GET adresu URL http://MyApi.com/Pdf. Ale jeśli chcemy ustawić nagłówek żądania authentication przed wykonaniem GET adresu URL, ponieważ serwer jest serwerem REST i nie obsługuje plików cookie. Jak to zrobić?JavaScript - Jak ustawić nagłówek żądania dla przeglądarki GET

We wszystkich przypadkach używam $.ajax do wywoływania usługi, ale tym razem muszę wyświetlić odpowiedź w nowym oknie. Odpowiedź to treść pliku PDF.

Z góry dziękuję.

Odpowiedz

8

W nowszych przeglądarek, może być w stanie używać plamy:

<!DOCTYPE html> 
<html> 
<head> 
</head> 
<body> 
<button onclick="tryit();">PDF</button> 
<script> 
    function tryit() { 
     var win = window.open('_blank'); 
     downloadFile('/pdf', function(blob) { 
      var url = URL.createObjectURL(blob); 
      win.location = url; 
     }); 
    } 
    function downloadFile(url, success) { 
     var xhr = new XMLHttpRequest(); 
     xhr.open('GET', url, true); 
     xhr.setRequestHeader("Authorization", "Basic " + btoa("username:password")); 
     xhr.responseType = "blob"; 
     xhr.onreadystatechange = function() { 
      if (xhr.readyState == 4) { 
       if (success) success(xhr.response); 
      } 
     }; 
     xhr.send(null); 
    } 

</script> 
</body> 
</html> 

w IE, poprosić użytkownika:

window.navigator.msSaveOrOpenBlob(blob, 'readme.pdf'); 

PS: można przetestować backend w węźle:

router.get('/pdf', function(req, res) { 
    if(req.headers.authorization !== 'Basic dXNlcm5hbWU6cGFzc3dvcmQ=') return res.status(403).send('Not allowed'); 
    res.sendFile(path.join(__dirname, 'public', 'render.pdf')); 
}); 
router.get('/', function(req, res) { 
    res.render('index'); 
}); 
+0

Wygląda na to, że zadziała. wypróbowane? – IsmailS

+1

Tak, z Chrome 48 -> Węzeł 0.12 Oznacz to? :) – malix

+0

obsługiwane przez główne najnowsze przeglądarki. Ale wciąż w toku. https: //developer.mozilla.org/pl/docs/Web/API/URL/createObjectURL # Kompatybilność przeglądarki – IsmailS

-2

Powinieneś skonfigurować $.ajax używając beforeSend. Poniżej przykład, ale oczywiście nie wiem, czy dokładna konfiguracja zadziała dla ciebie bez żadnego kodu do obejrzenia.

$.ajax({ 
    url : '/model/user.json', 
    dataType : 'json', 
    'beforeSend' : function(xhr) { 
      var bytes = Crypto.charenc.Binary.stringToBytes(username + ":" + password); 
      var base64 = Crypto.util.bytesToBase64(bytes); 
      xhr.setRequestHeader("Authorization", "Basic " + base64); 
    }, 
    error : function(xhr, ajaxOptions, thrownError) { 
     reset(); 
     onError('Invalid username or password. Please try again.'); 
     $('#loginform #user_login').focus(); 
    }, 
    success : function(model) { 
     cookies(); 
      ... 
    } 
}); 

Aby to zadziałało trzeba crypto-js.

+0

Nie dość odpowiedzieć na pytanie, jak sądzę, odpowiedź jest dokumentem PDF mają być świadczone przez przeglądarkę. –

+0

Pozwól mi wyjaśnić ponownie. Nie muszę ustawiać nagłówka dla zapytania ajax. Chcę ustawić nagłówek dla pełnego żądania GET strony. Używam 'beforeSend' do ustawienia nagłówka dla wszystkich żądań ajax. – IsmailS

1

Jeśli nie dbają o ukrywanie lub kasował poświadczenia użytkownika tylko wtedy używać zwykłego GET uwierzytelnienia: korzystanie http://username:[email protected]/ zamiast http://MyApi.com/

+0

Dziękuję bardzo za odpowiedź. Mam niestandardowy mechanizm uwierzytelniania. :(. Tak więc wartość nagłówka 'authorization' wygląda jak' CompanyNameToken '. Nie miałbym nic przeciwko umieszczeniu tokena w adresie URL, jeśli istnieje jakieś dziwactwo możliwe, takie jak to. – IsmailS

1

Czy to ma być GET?

Powodem, dla którego pytam jest to, że możesz po prostu mieć formularz POST (do target = "_ BLANK"), który wysyła cokolwiek, ale pokazuje osadzony plik w nowym oknie. Oczywiście nie rozwiąże to problemu z Twoimi niestandardowymi nagłówkami, ale ponieważ możesz również POST z użyciem jquery.ajax - co pozwala ci ustawić własne nagłówki - będziesz miał najlepsze z obu światów.

Oto jQuery plugin, który tworzy taką formę dynamicznie, aby pobrać dowolny plik. Można to wykorzystać jako punkt odniesienia ...

Nadzieja to pomaga

Powiązane problemy