Tengo un sitio que usa Passport Steam Strategy. Mi servidor (Nodo con Express) se está ejecutando actualmente en localhost: 3000 mientras que mi front-end se está ejecutando en localhost: 8080. Sigo encontrándome con un problema de origen cruzado, solo cuando intento autorizar a través de Steam. Mis solicitudes se realizan a través de Axios y estoy usando CORS. He pasado horas buscando en Google y probando varias cosas, pero parece que no puedo hacer que funcione.

Este es el error que obtengo:

XMLHttpRequest no se puede cargarhttps://steamcommunity.com/openid/login?openid.mode=checkid_setup&openid.ns… 3000% 2Fsteam% 2Fauth% 2Freturn & openid.realm = http% 3A% 2F% 2Flocalhost% 3A3000% 2F. No hay encabezado 'Access-Control-Allow-Origin' presente en el recurso solicitado. Por lo tanto, el origen 'nulo' no tiene acceso permitido.

Aquí es donde se llama la ruta desde el extremo frontal:

    linkSteam(){
        api('http://localhost:3000/steam/auth')
            .then(res => {
                console.log(res);
                state.user = res.data.user;
            })
    }

Y aquí está mi configuración de axios en la parte delantera.

let api = axios.create({
  baseURL: 'http://localhost:3000/api/',
  timeout: 3000,
  withCredentials: true
})

Mi CORS está configurado de la siguiente manera

var whitelist = ['http://localhost:8080', 'https://steamcommunity.com', 'http://localhost:3000', 'null'];
// I added null here as someone said that it worked as their origin displayed null like mine does
var corsOptions = {
  origin: function (origin, callback) {
    var originIsWhitelisted = whitelist.indexOf(origin) !== -1;
    callback(null, originIsWhitelisted);
  },
  credentials: true
};

Luego importo mi CORS en mi archivo principal y lo uso de la siguiente manera

app.use(cors(corsOptions))
app.use('*', cors(corsOptions))

Seguí viendo que puedes configurar tus credenciales de control de acceso, permitir, etc. y lo hice

app.use(function (req, res, next) {
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8080');
  res.setHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept');
  if ('OPTIONS' == req.method) {
     res.send(200);
   } else {
     next();
   }
});

Esto no ayudó. Intenté desglosar mi función original donde se llama / steam / auth y ejecuta un console.log (req.headers.origin) y escupe mi URL correcta, pero el error aún informa que el Origen es nulo. Si configuro mi Access-Control-Allow-Origin 'en' * ', obtengo un error ligeramente diferente que debo proporcionar credenciales, y que el Origen' localhost: 8080 'no está permitido.

Aquí está mi ruta / steam / auth.

router.get('/steam/auth',
  passport.authenticate('steam', {
    failureRedirect: '/'
  }),
  function (req, res) {
    res.redirect('/');
  });

Y esto funciona si hago clic en la URL que no se puede cargar y luego inicio sesión en Steam. Luego me redirigirá a mi sitio con la información de mi perfil de Steam intacta. El error está en intentar recuperar la redirección inicial a Steam para iniciar sesión. También he intentado hacer esto en un res.redirect a su URL directa y obtengo el mismo error.

¡Gracias de antemano por cualquier ayuda! Y avíseme si me falta información vital. He tratado de incluir todo, pero no me sorprendería si me perdiera algo.