Rumah  >  Artikel  >  pembangunan bahagian belakang  >  Bagaimana untuk Mengendalikan 302 Ubah hala daripada Pelayan SSO dan Elakkan Ralat CORS dalam ReactJS?

Bagaimana untuk Mengendalikan 302 Ubah hala daripada Pelayan SSO dan Elakkan Ralat CORS dalam ReactJS?

Linda Hamilton
Linda Hamiltonasal
2024-10-28 21:22:02512semak imbas

How to Handle 302 Redirects from SSO Servers and Avoid CORS Errors in ReactJS?

Permintaan ReactJS GET Diubah Hala dengan 302, Menghadapi Ralat CORS

Dalam persekitaran pembangunan ReactJS, mengesahkan pengguna melalui Single Sign-On (SSO) boleh menghadirkan cabaran apabila bahagian belakang bertindak balas dengan ubah hala 302. Mari kita terokai senario dan cari penyelesaian untuk mengatasi ralat CORS.

Senario:

  • Pelayan hadapan: Aplikasi ReactJS yang dijalankan di f.com
  • Pelayan belakang: API Golang berjalan pada b.com
  • Pelayan SSO: sso.example.com

Isu:

ReactJS menghantar permintaan GET ke b.com/users. Bahagian belakang bertindak balas dengan ubah hala HTTP 302 ke halaman SSO di sso.example.com/login. Walau bagaimanapun, apl ReactJS menghadapi ralat CORS daripada sso.example.com, yang menyekat pengalihan.

Penyelesaian:

Memandangkan anda tidak mempunyai kawalan ke atas Pelayan SSO dan tidak boleh mengubah suai pengepala responsnya, adalah lebih baik untuk mengendalikan pengalihan pada bahagian klien dalam JavaScript. Pendekatan ini mengelakkan isu CORS:

Pilihan 1: React Router

Anda boleh menavigasi secara pemrograman menggunakan React Router untuk mengendalikan pengalihan pada bahagian klien. Walau bagaimanapun, kaedah ini lebih kompleks.

Pilihan 2: Window.location.href

Untuk pendekatan yang lebih mudah dan langsung, anda boleh menggunakan window.location.href harta untuk mengubah hala pengguna ke halaman SSO:

<code class="javascript">window.location.href = "https://www.example.com";</code>

Nota: Kaedah ini mungkin mempunyai implikasi untuk sejarah penyemakan imbas.

Atas ialah kandungan terperinci Bagaimana untuk Mengendalikan 302 Ubah hala daripada Pelayan SSO dan Elakkan Ralat CORS dalam ReactJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn