Ponieważ używanie uwierzytelniania CORS i http w AngularJS może być trudne, zredagowałem pytanie, aby podzielić się jedną wyuczoną lekcją. Najpierw chcę podziękować igorzg. Jego odpowiedź bardzo mi pomogła. Scenariusz jest następujący: Chcesz wysłać żądanie POST do innej domeny z usługą AngularJS $ http. Jest kilka trudnych rzeczy, o których należy pamiętać podczas pobierania AngularJS i konfiguracji serwera.
Po pierwsze: w konfiguracji aplikacji musisz zezwolić na połączenia między domenami
/**
* Cors usage example.
* @author Georgi Naumov
* gonaumov@gmail.com for contacts and
* suggestions.
**/
app.config(function($httpProvider) {
//Enable cross domain calls
$httpProvider.defaults.useXDomain = true;
});
Po drugie: w żądaniu należy określić withCredentials: true oraz nazwę użytkownika i hasło.
/**
* Cors usage example.
* @author Georgi Naumov
* gonaumov@gmail.com for contacts and
* suggestions.
**/
$http({
url: 'url of remote service',
method: "POST",
data: JSON.stringify(requestData),
withCredentials: true,
headers: {
'Authorization': 'Basic bashe64usename:password'
}
});
Po trzecie: Konfiguracja serwera. Musisz podać:
/**
* Cors usage example.
* @author Georgi Naumov
* [email protected] for contacts and
* suggestions.
**/
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: http://url.com:8080");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization");
Na każde życzenie. Po otrzymaniu OPCJI musisz zdać:
/**
* Cors usage example.
* @author Georgi Naumov
* gonaumov@gmail.com for contacts and
* suggestions.
**/
if($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
header( "HTTP/1.1 200 OK" );
exit();
}
Uwierzytelnianie HTTP i wszystko inne następuje później.
Oto kompletny przykład użycia strony serwera z php.
<?php
/**
* Cors usage example.
* @author Georgi Naumov
* gonaumov@gmail.com for contacts and
* suggestions.
**/
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: http://url:8080");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization");
if($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
header( "HTTP/1.1 200 OK" );
exit();
}
$realm = 'Restricted area';
$password = 'somepassword';
$users = array('someusername' => $password);
if (isset($_SERVER['PHP_AUTH_USER']) == false || isset($_SERVER['PHP_AUTH_PW']) == false) {
header('WWW-Authenticate: Basic realm="My Realm"');
die('Not authorised');
}
if (isset($users[$_SERVER['PHP_AUTH_USER']]) && $users[$_SERVER['PHP_AUTH_USER']] == $password)
{
header( "HTTP/1.1 200 OK" );
echo 'You are logged in!' ;
exit();
}
?>
Na moim blogu jest artykuł na ten temat, który można zobaczyć tutaj .
Odpowiedzi:
Nie, nie musisz umieszczać poświadczeń, musisz umieścić nagłówki po stronie klienta, np .:
$http({ url: 'url of service', method: "POST", data: {test : name }, withCredentials: true, headers: { 'Content-Type': 'application/json; charset=utf-8' } });
A po stronie serwera musisz umieścić nagłówki, na przykład dla nodejs:
/** * On all requests add headers */ app.all('*', function(req, res,next) { /** * Response settings * @type {Object} */ var responseSettings = { "AccessControlAllowOrigin": req.headers.origin, "AccessControlAllowHeaders": "Content-Type,X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Date, X-Api-Version, X-File-Name", "AccessControlAllowMethods": "POST, GET, PUT, DELETE, OPTIONS", "AccessControlAllowCredentials": true }; /** * Headers */ res.header("Access-Control-Allow-Credentials", responseSettings.AccessControlAllowCredentials); res.header("Access-Control-Allow-Origin", responseSettings.AccessControlAllowOrigin); res.header("Access-Control-Allow-Headers", (req.headers['access-control-request-headers']) ? req.headers['access-control-request-headers'] : "x-requested-with"); res.header("Access-Control-Allow-Methods", (req.headers['access-control-request-method']) ? req.headers['access-control-request-method'] : responseSettings.AccessControlAllowMethods); if ('OPTIONS' == req.method) { res.send(200); } else { next(); } });
źródło
Aby wykonać żądanie CORS, należy dodać nagłówki do żądania wraz z tym, co musi sprawdzić, czy w Apache jest włączony tryb mode_header.
Aby włączyć nagłówki w Ubuntu:
Aby serwer php zaakceptował żądanie z innego źródła, użyj:
Header set Access-Control-Allow-Origin * Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE" Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"
źródło