Угловой запрос к Google oAuth не выполняется из-за политики CORS - PullRequest
Новая
       8

Угловой запрос к Google oAuth не выполняется из-за политики CORS

0 голосов
/ 30 августа 2018

Я настроил приложение angular / nodejs (express) с аутентификацией Google, но всякий раз, когда я запрашиваю google oauth через приложение angular, оно выдает ошибку cors, но если я запрашиваю напрямую из браузера, оно работает как должно.

Сервер работает на порту 3000, а Angular на 4200.

Я использую пакет cors, чтобы разрешить все запросы cors в server.js: 

app.use(passport.initialize());

// Passport Config
require('./config/passport')(passport);

// Allowing all cors requests
app.use(cors());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/users', usersRouter);
app.use('/auth', authRouter);

Конфигурация паспорта: 

passport.use(
    new GoogleStrategy(
        keys,
        (token, refreshToken, profile, done) => {
            process.nextTick(() => {
                User.findOne({ email: email })
                    .then(user => {
                        if (user) {
                            return done(null, user);
                        }
                    })
                    .catch(err => console.log(err));
            });
        }
    )
);

Это маршрут аутентификации Google: 

router.get('/google', passport.authenticate('google', {
        scope: ['profile', 'email'],
        session: false
    }),
    (req, res) => {
        // Create JWT payload
        const payload = {
            id: req.user.id,
            email: req.user.email
        };

        jwt.sign(payload, secret, expires, (err, token) => {
            res.json(token);
        });
    }
);

А вот угловой запрос: 

googleAuth() {
    return this.http.get<any>('http://localhost:3000/auth/google').pipe(
        map(user => {
            if (user) {
                localStorage.setItem(
                    'currentUser',
                    JSON.stringify(user)
                );
            }

            return user;
        })
    );
}

Ошибка в консоли Chrome: 

Failed to load "https://accounts.google.com/o/oauth2/v2/auth?response_type=code...": No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access

Я также авторизовал происхождение JavaScript в консоли разработчиков Google: происхождение

Я довольно плохо знаком с angular и nodejs, и я прочитал все подобные вопросы, но не смог найти обходной путь для этой проблемы.

1 Ответ

0 голосов
/ 31 августа 2018

Попробуйте этот метод прямого вызова URL: (Простите, если я что-то упустил синтаксически, но в основном это идея) 

googleAuth(){
 window.open('/google',"mywindow","location=1,status=1,scrollbars=1, width=800,height=800");
let listener = window.addEventListener('message', (message) => {
  //message will contain google user and details
});

}

и на сервере у вас есть набор стратегии паспорта, я полагаю, сейчас 

router.get('/google', passport.authenticate('google', {
        scope: ['profile', 'email'],
        session: false } ))

router.get('/google/callback',
    passport.authenticate('google', { failureRedirect: '/auth/fail' }),
function(req, res) {
    var responseHTML = '<html><head><title>Main</title></head><body></body><script>res = %value%; window.opener.postMessage(res, "*");window.close();</script></html>'
    responseHTML = responseHTML.replace('%value%', JSON.stringify({
        user: req.user
    }));
    res.status(200).send(responseHTML);


});
...