Jadi saya sedang membangun aplikasi tumpukan penuh (Ekspres dan Bereaksi) yang menggunakan cookie backend untuk otentikasi dan yang tidak. Masalah yang saya alami adalah di Android saya mendapatkan perilaku aneh; dan mungkin di perangkat seluler apa pun. Berikut adalah contoh kodenya:

// React App.js

const App = () => {
  const [user, setUser] = useState("");
  const [auth, setAuth] = useState(false);

  const checkIfLogged = async () => {
     console.log('[CHECKIFLOGGED]')
     try {
        const user = await axios.get('/user/route/', {withCredentials: true})
        setAuth(true)
        setUser(user.data)
     } catch (error) {
        console.log(error)
     }
  };

  useLayoutEffect(() => {
     checkIfLogged();
  })

  return(
   <>
     {components example, not real code}
   </>
  )
}

Jadi dalam contoh ini setelah Aplikasi dipasang, useEffect() memanggil checkIfLogged(), yang membuat permintaan aksio ke backend dan jika cookie yang tepat ada, pengguna dikembalikan dan disetel ke status. Dan juga status 'auth' disetel ke true. Dan variabel status itu dapat mengontrol komponen kondisional misalnya.

Jadi inilah masalahnya. Di browser desktop ini berjalan dengan baik! Tidak ada masalah! Negara diatur dengan benar; setiap kali halaman memuat atau menyegarkan checkIfLogged() berjalan. Di Android di browser seluler, Negara agak tidak dapat diprediksi. Jika saya membuka situs web di browser Android saya, lalu tutup browser dari Android terbaru saya (jadi sapuan penuh dari dekat) lalu buka kembali browser saya; situs dimuat seperti cara memuat cepat cache yang aneh. Dan ketika itu terjadi, wait axios.get() terkadang akan berjalan dan terkadang tidak berjalan. Tetapi bahkan jika axios.get() tidak "menjalankan" setAuth(true) setUser(user.data) setelah itu masih akan dieksekusi seolah-olah panggilan axios diteruskan... meskipun tidak pernah dikirim. Dan saya menggunakan morgan di backend untuk menonton semua permintaan http dan axios.get tidak berhasil. Ini sangat menjengkelkan... dan situs web yang saya bangun ini sebagian besar untuk saya sendiri untuk dilihat sebagian besar di Android... tetapi sepertinya saya tidak dapat menemukan solusi dan sepertinya tidak ada informasi tentangnya di seluruh web.

Bantuan apa pun akan sangat dihargai

0
Eric Christensen 11 Maret 2020, 09:15

1 menjawab

Jawaban Terbaik

Saya benar-benar berpikir saya memecahkan masalah ini; Saya mengubah useLayEffect menjadi useEffect; itu sebenarnya salah ketik. Dan kemudian di index.js saya, saya mengatur pekerja layanan ke "tidak terdaftar". Saya pikir serviceworker sedang menyimpan permintaan HTTP untuk penggunaan offline; yang tidak saya inginkan.

0
Eric Christensen 11 Maret 2020, 21:57