Laravel API 구성
Laravel API 구성
API 구성에 필요한 것.
1. 클라이언트에서 API 콜 할때 헤더 세팅들.
2. 서버에서 Request 처리할때 CORS 등 세팅들.
GET 테스트 =========================
1. 클라이언트 세팅
//javascript
var api_host = "http://api.domain.co.kr/api/v1/lists";
$("#btn_test").on('click',function(){
$.ajax({
type: 'get',
url: api_host,
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
data : {
name:'myname'
},
dataType: 'json',
success: function(data){
console.log(data);
},
error:function(request,status,error){ console.log("code:"+request.status+"
"+"message:"+request.responseText+"
"+"error:"+error);
}
});
)};
2. 서버세팅
//php 파일
//API를 요청하는 클라이언트 URL 을 적어준다. ( * 로 적으면 모두 허용)
header('Access-Control-Allow-Origin: http://client.domain.co.kr');
POST 테스트 ===========================
POST에는 CSRF 토큰을 헤더에 넣어 함께 전송해야 함.
본격적인 POST 전송 전에 OPTIONS Method로 Preflight를 날린다.
그래서 라라벨 라우터 내 web.php 또는 api.php 에서 Route::options 를 꼭 열여줘야 함.
1. 클라이언트 세팅
//HTML 파일
//javascript
var api_host = "http://api.domain.co.kr/api/v1/lists";
$("#btn_test").on('click',function(){
$.ajax({
type: 'post',
url: api_host,
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
//contentType: "multipart/form-data",
headers: {
'X-CSRF-TOKEN' : $('meta[name="csrf-token"]').attr('content')
},
data : {
name:'myname'
},
dataType: 'json',
success: function(data){
console.log(data);
},
error:function(request,status,error){ console.log("code:"+request.status+"
"+"message:"+request.responseText+"
"+"error:"+error);
}
});
)};
2. 서버세팅
//php 파일
//API를 요청하는 클라이언트 URL 을 적어준다. ( * 로 적으면 모두 허용)
header('Access-Control-Allow-Origin: http://client.domain.co.kr');
header('Access-Control-Allow-Headers: x-ncp-apigw-api-key,x-csrf-token');
// app/Http/Middleware/VerifyCsrfToken.php 파일
// $except 에 실제 호출하는 API URI를 적어야 함 (Origin 서버 주소를 적는게 아님)
protected $except = [
'/api/*',
'http://api.domain.co.kr/v1/*'
];
//번외로 위 VerifyCsrfToken.php 를 거치지 않고 POST 요청을 허용하려면 설정을 변경해주면 됨
// app/Http/Kernel.php 파일에서
protected $middlewareGroups = [
'web' => [
\App\Http\Middleware\EncryptCookies::class,
\Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
\Illuminate\Session\Middleware\StartSession::class,
// \Illuminate\Session\Middleware\AuthenticateSession::class,
\Illuminate\View\Middleware\ShareErrorsFromSession::class,
//\App\Http\Middleware\VerifyCsrfToken::class,
\Illuminate\Routing\Middleware\SubstituteBindings::class,
\App\Http\Middleware\RequiredDF::class,
\App\Http\Middleware\ExceptAppendableVerifyCsrfToken::class,
\App\Http\Middleware\LangPreprocessor::class,
\App\Http\Middleware\Purifying::class,
\App\Http\Middleware\FreezeSEO::class,
],
// 위 처럼 VerifyCsrfToken::class 를 사용안함으로 주석처리하면 됨
Cookie 테스트 ===================================
1. 클라이언트 세팅
//평상시는 사용안하지만 쿠키를 넘기거나 할때는 xhrFields 를 설정해줘야 한다.
//ajax 호출시
xhrFields: {
withCredentials: true
},
//위 코드를 삽입해서 호출해야 함
//위 withCredentials 옵션을 적용하면, 서버에서 CORS header 세팅할때 * 옵션을 사용하지 못한다. 사용하면 에러남.
2. 서버세팅
//클라이언트에서 xhrFields 를 설정해서 보낼경우에는 서버에서 꼭 Credentials 를 설정해줘야 한다.
header('Access-Control-Allow-Origin: http://client.domain.co.kr');
header('Access-Control-Allow-Headers: x-ncp-apigw-api-key,x-csrf-token');
header('Access-Control-Allow-Credentials: true');
//위 처럼 Credentials를 사용할 때는 Access-Control-Allow-Origin 을 * 으로 설정하면 *으로 설정하지말라는 오류메시지를 뱉는다.
//위 두개 설정만 추가해주면 헤더에 따로 쿠키를 추가해주는 작업을 하지 않아도 Cookie 가 자동으로 헤더에 넣어져서 넘어간다.
from http://mosei.tistory.com/136 by ccl(A) rewrite - 2020-03-06 10:20:52
댓글
댓글 쓰기