ajax는 도메인 간 액세스를 달성하기 위해 Access-Control-Allow-Origin을 설정합니다.
- WBOY원래의
- 2016-08-08 09:23:10858검색
Ajax 도메인 간 액세스는 오래된 문제입니다. 더 일반적으로 사용되는 방법은 JSONP 방법입니다. JSONP 방법은 비공식 방법입니다. , 이 방법은 POST만큼 안전하지 않은 GET만 지원합니다.
jquery의 jsonp 메소드를 사용해 타입을 POST로 설정해도 자동으로 GET으로 변경된다.
공식 문제 설명:
"script": 응답을 JavaScript로 평가하고 일반 텍스트로 반환합니다. 캐시 옵션이 true로 설정되지 않은 경우 쿼리 문자열 매개변수 "_=[TIMESTAMP]"를 URL에 추가하여 캐싱을 비활성화합니다.참고:
이렇게 하면 원격 도메인 요청에 대해 POST가 GET으로 전환됩니다.
도메인 전체에서 POST를 사용하는 경우 이를 사용하여 숨겨진 iframe을 생성하고 다음과 같이 업로드할 수 있습니다. ajax 그림의 원리는 동일하지만 더 번거로울 것입니다.
따라서 Access-Control-Allow-Origin을 설정하여 도메인 간 액세스를 달성하는 것이 비교적 간단합니다.
예: 클라이언트의 도메인 이름은 www.client.com이고 요청된 도메인 이름은 www.server.com입니다
Ajax를 사용하여 직접 접속하면 다음과 같은 오류가 발생합니다
XMLHttpRequest가 http://www.server.com/server.php를 로드할 수 없습니다. . 요청한 리소스에 'Access-Control-Allow-Origin' 헤더가 없습니다.따라서 'http://www.client.com' 원본에는 액세스가 허용되지 않습니다.
//를 추가하여 다른 도메인 이름이
헤더( '액세스 -제어-허용-원본:*');
// 응답 유형
header('Access-Control-Allow-Methods:POST');
// 응답 헤더 설정
header('액세스 제어-허용 헤더:x-requested-with,content-type');
Ajax POST 도메인 간 액세스를 구현할 수 있습니다.
코드는 다음과 같습니다.
client.html 경로: http://www.client.com /client.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" c/html;charset=utf-8">
<title> 跨域测试 </title>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<div id="show"></div>
<script type="text/javascript">
$.post("http://www.server.com/server.php",{name:"fdipzone",gender:"male"})
.done(function(data){
document.getElementById("show").innerHTML = data.name + ' ' + data.gender;
});
</script>
</body>
</html>
server.php 경로: http://www.server.com/server.php
<?php
$ret = array(
'name' => isset($_POST['name'])? $_POST['name'] : '',
'gender' => isset($_POST['gender'])? $_POST['gender'] : ''
);
header('content-type:application:json;charset=utf8');
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:POST');
header('Access-Control-Allow-Headers:x-requested-with,content-type');
echo json_encode($ret);
?>
Access-Control-Allow-Origin:*은 모든 도메인 이름에서 도메인 간 액세스를 허용한다는 뜻입니다
도메인 이름 지정이 필요한 경우 도메인 간 액세스를 허용하려면 Access-Control-Allow-Origin:*Changed to Access-Control-Allow-Origin:허용된 도메인 이름
예: header('Access- Control-Allow-Origin:http://www.client.com');
If 필요여러 도메인 이름 설정액세스 허용, 여기에서 처리하려면 PHP를 사용해야 합니다
예를 들어 www.client.com 및 www를 허용합니다. client2.com이 도메인 간 액세스 권한을 갖도록
server.php를
<?php
$ret = array(
'name' => isset($_POST['name'])? $_POST['name'] : '',
'gender' => isset($_POST['gender'])? $_POST['gender'] : ''
);
header('content-type:application:json;charset=utf8');
$origin = isset($_SERVER['HTTP_ORIGIN'])? $_SERVER['HTTP_ORIGIN'] : '';
$allow_origin = array(
'http://www.client.com',
'http://www.client2.com'
);
if(in_array($origin, $allow_origin)){
header('Access-Control-Allow-Origin:'.$origin);
header('Access-Control-Allow-Methods:POST');
header('Access-Control-Allow-Headers:x-requested-with,content-type');
}
echo json_encode($ret);
?>
소스코드 다운로드 주소 : 클릭하시면 보실 수 있습니다
위 내용은 콘텐츠를 포함하여 도메인 간 액세스를 달성하기 위한 Ajax 설정 Access-Control-Allow-Origin을 소개합니다. PHP 튜토리얼에 관심이 있는 친구들에게 도움이 되기를 바랍니다.