ドメイン間問題のまとめ(通常のドメイン間、ヘッダヘッダにパラメータを加えてドメイン間)

2625 ワード

背景は、ずっとアプリのためにインタフェースを書いて、postmanでテストして、ドメイン間の問題は発生したことがありません.最近、フロントエンドH 5ページにインタフェースを書いて、ドメイン間の問題が発生しました.私たちのtokenはヘッダが存在して、それからフロントエンドでjsonpを使って、バックエンドですべての人のアクセスを許可する方法を使っても解決していません.
最終的にヘッダヘッダが追加されず、tokenは検証に合格しなかったことが分かった.
参考博文:ajaxドメイン間headers JavaScript ajaxドメイン間要求+設定headers実践
https://www.cnblogs.com/cdemo/p/5158663.html
乾物:
既存の状況:フロントエンドでajax要求インタフェースを使用するデータコードは以下の通りです.
  $.ajax({
              type: "GET",
              url: "http://www.agent.com/api/join/activity",
              data: {activity_id:1},
              dataType:"json",
              beforeSend: function (xhr) {
              xhr.setRequestHeader("Authorization", "Bearer XXX");
                // xhr.setRequestHeader("aaaa", "1111");
            },
              success: function(res) {
                    console.log(res)
              }
});
        });

バックエンドPHP laravelフレームワークには、ミドルウェアが書かれています.
headers->add(['Access-Control-Allow-Origin' => '*']);
        $response->headers->add(['Access-Control-Allow-Headers' => 'Origin, Content-Type, Cookie,X-CSRF-TOKEN, Accept,Authorization']);
        $response->headers->add(['Access-Control-Expose-Headers' => 'Authorization,authenticated']);
        $response->headers->add(['Access-Control-Allow-Methods' => 'GET, POST, PATCH, PUT, OPTIONS']);
        $response->headers->add(['Access-Control-Allow-Credentials' => 'true']);
        
        return $response;
    }
}

この方法を使うのは役に立たないことに気づいた.
その後、ヘッダーが加算されないことに気づきました.ヘッダーを追加する必要がある場合、ブラウザはGETまたはPOST方式で要求する前に、optionsメソッドを使用してこのヘッダーが受け入れられるかどうかを確認します.解決策は,ルーティングにoptionsを記入してからPOSTの要求を行う.コードは次のとおりです.
//   OPTIONS   
Route::options('/join/activity',function(){
    return response("OK", 200)->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,DELETE')
        ->header('Access-Control-Allow-Headers', 'Authorization');//header    
});

//   POST  


      Route::post('join/activity','Activities\ActivitiesController@joinActivity');

ヘッドヘッドは、フロントエンドがバックエンド名と一致するようにして、ヘッド値をコミットできます.そうしないと、KEYだけVALUEがありません.