Estoy trabajando en un proyecto express usando mecanografiado y necesitaba implementar cors. He agregado cors en proyectos express.js normales antes sin mecanografiado y pensé que debería funcionar igual ya que no recibo ninguna advertencia o error de mecanografiado. Cuando llamo al backend desde el frontend usando http://localhost:3000 , la solicitud funciona bien, pero cuando llamo al backend desde https://FRONTEND_URL la solicitud no se procesa y aparece este error:
Access to XMLHttpRequest at 'https://BACKEND_URL/member/auth/forgotPassword?email=example%40gmail.com' from origin 'https://FRONTEND_URL' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
¿Hay otro paso para implementar URL https?
Código =>
import express from "express"; import mongoose from "mongoose"; import bodyParser from "body-parser"; import cors from "cors"; import * as dotenv from "dotenv"; import member from "./routes/member"; dotenv.config(); const app = express(); app.use(express.json({ limit: '50mb' })); app.use(express.urlencoded({ limit: '50mb', extended: true })); const port = process.env.PORT || 8080; // Connect to the database mongoose .connect(process.env.MONGO_URI) .then(() => console.log(`Database connected successfully`)) .catch((err) => console.log(err)); // Since mongoose's Promise is deprecated, we override it with Node's Promise mongoose.Promise = global.Promise; //use cors middleware app.use( cors({ origin: ["https://FRONTEND_URL", "http://localhost:3000"], credentials: true })); app.use(bodyParser.json()); app.get("/", (_req: any, res) => { res.send("Hello World!"); }); app.use("/member", member); app.use((err: any, _req: any, _res: any, next: any) => { console.log(err); next(); }); app.listen(port, () => { console.log(`Server running on port ${port}`); });¡El problema estaba en mi servidor! Como estoy usando mecanografiado, tuve que configurar mi paquete.json de cierta manera para compilar heroku; Sin embargo, para fines de desarrollo, cambié mi función de servicio de "node dist/index.js" a "nodemon dist/index.js" y reconstruí el proyecto. Estoy usando firebase para algunas otras funciones similares a las de autenticación que están en la interfaz y pensé que por eso mi backend funcionaba bien, pero se bloqueó. Resulta que esto no fue un problema cors en absoluto.
// ./Package.json { "name": "server", "version": "1.0.0", "description": "", "main": "dist/index.js", "engines": { "node": "14.x" }, "scripts": { "build-ts": "tsc", "postinstall": "npm run build-ts", "start": "npm run serve", "serve": "node dist/index.js", "watch-node": "nodemon dist/index.js", "watch-ts": "tsc -w" }, "keywords": [], "author": "", "license": "ISC", "devDependencies": { "@types/connect-mongodb-session": "^2.4.2", "@types/cors": "^2.8.12", "@types/express": "^4.17.13", "@types/express-session": "^1.17.4", "@types/node": "^17.0.21", "nodemon": "^2.0.15", "typescript": "^4.6.2" }, "dependencies": { "connect-mongodb-session": "^3.1.1", "cors": "^2.8.5", "dotenv": "^16.0.0", "express": "^4.17.3", "express-session": "^1.17.2", "firebase-admin": "^10.0.2", "mongoose": "^6.2.4" } }Puede intentar incluir en la lista blanca usando la ip directamente, habilite CORS para todos los sitios web poniendo un comodín *
o eliminar el middleware y usar algo como
app.get('/blabla',(req,res)=>{ res.set('Access-Control-Allow-Origin', 'https://WEBSITE'); res.json('hi') })