Cara menggunakan CORS untuk membenarkan kuki ditetapkan
P粉765684602
P粉765684602 2023-08-29 17:26:51
0
2
352

Saya telah melihat siaran lain yang berkaitan tetapi tiada satu pun daripada mereka yang berkesan untuk saya. Saya menggunakan vue pada bahagian klien dan nod pada bahagian pelayan.

Saya mencuba pendekatan yang dicadangkan dalam siaran lain menggunakan perpustakaan cors tanpa berjaya. Seseorang mungkin berfikir bahawa kod berikut akan membolehkan saya menghantar permintaan daripada localhost:8080 klien ke localhost:3000 pelayan, tetapi semua permintaan gagal.

const cors = require("cors"); if (process.env.ENV !== "prod") { biarkan corsOptions = { asal: ["http://localhost:8080"], kelayakan: benar, optionsSuccessStatus: 200, }; app.use(cors(corsOptions)); }

Ini ialah pengawal yang saya gunakan untuk menetapkan kuki.

router.route("/login").post(async (req, res) => { //Sahkan pengguna pengguna const = tunggu Users.findOne({ where: { email: req.body.email } }); if (pengguna == null) { return res.status(400).send("Pengguna tidak ditemui!"); } cuba { if (menunggu bcrypt.compare(req.body.password, user.password)) { const userInfo = { nama pengguna: pengguna.nama pengguna, e-mel: pengguna.e-mel, umur: pengguna.umur, }; const accessToken = generateAccessToken(userInfo); const refreshToken = jwt.sign(userInfo, process.env.REFRESH_TOKEN_SECRET); res.cookie("token", accessToken, { maxUmur: 300000, selamat: benar, httpSahaja: benar, sameSite: "tiada", }); res.status(200).send("Log masuk berjaya!"); } lain { res.send("E-mel atau kata laluan tidak betul!"); } } tangkap { res.status(500).send(); } });

Pada asasnya setiap jawapan di tapak ini kembali kepada app.use(cors) tetapi atas sebab tertentu ia tidak berfungsi untuk saya.

P粉765684602
P粉765684602

membalas semua (2)
P粉514001887

Ini mungkin kerana untuk kuki merentas domain anda menetapkan {sameSite: true} dan {secure: true}, tetapi dalam contoh anda, anda melakukannya di http://localhost jadi tiada kuki yang akan ditetapkan. Sila rujuk pautan di bawah untuk keperluan.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite#samesitenone_requires_secure

Tetapkan juga pengepala yang betul seperti Access-Control-Allow-Credentials, Access-Control-Allow-Origin, Access-Control-Allow-Headers

Anda boleh menggunakanmkcertuntuk merujuk kepada membuat sambungan selamat pada localhost.

Saya juga mengesyorkan menggunakan domain peringkat atas yang sama pada bahagian hadapan dan belakang serta menggunakan subdomain.

Satu lagi perkara yang perlu diperhatikan di sini ialah saya tidak fikir Chrome akan menetapkan kuki jika terdapat port dalam nama domain, sila cuba.

    P粉647449444

    Saya berjaya menyelesaikan masalah ini supaya orang lain yang datang kemudian dapat mencari jawapannya. Saya mengalihkan pengisytiharan cookieparser sebelum ini di mana sambungan sekuel dimulakan. Saya juga menambahkan pilihan withCredentials pada permintaan pos axios saya. Dengan kedua-dua langkah, kuki saya kini ditetapkan dengan betul dan boleh diakses.

    const express = require("express"); require("dotenv").config(); const cors = require("cors"); const app = express(); app.use(express.json()); app.use(express.urlencoded({ extended: true })); const cookieParser = require("cookie-parser"); app.use(cookieParser()); const port = process.env.PORT || 8080; const lib = require("./lib"); //这是所有自定义函数 const sql = require("./database");
    onSubmit() { let loginInfo = { email: email.value, password: password.value, }; axios .post("http://localhost:3000/user/login", loginInfo, { withCredentials: true, }) .then(() => $q.notify({ color: "green-4", textColor: "white", icon: "cloud_done", message: "帐户创建成功!", }) ) .catch(() => $q.notify({ color: "red-5", textColor: "white", icon: "warning", message: "电子邮件或用户名已被使用!", }) ); },
      Muat turun terkini
      Lagi>
      kesan web
      Kod sumber laman web
      Bahan laman web
      Templat hujung hadapan
      Tentang kita Penafian Sitemap
      Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!