У меня проблемы с аутентификацией пользователей с помощью passport-google на внешнем интерфейсе.
В настоящее время у меня есть приложение, которое позволяет вам зарегистрироваться и войти в систему локально, после этого токен отправляется, и этот токен передается в реакции.Если установлен токен, то приложение аутентифицируется во внешнем интерфейсе, если нет токена пользователя, передний конец (сторона реакции) не аутентифицирован.
Как я могу использовать эту логику с passport-google ?
На данный момент эта логика выдает ошибку cors.И у меня включены cors и прочее, и мой сервер прореактивного порта принимается как источник cors.Express работает на 3000, а реакция на 3001.
Доступ к XMLHttpRequest по адресу https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A3000%2Fauth%2Fgoogle%2Fcallback&scope=profile&client_id=414221829387-squf9po9h437tjkknkc0c4foq6734fo7.apps.googleusercontent.com' (перенаправлен из 'http://localhost:3000/users/auth/google') из источника' null 'имеетбыл заблокирован политикой CORS: на запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin».
У Axios базовый URL-адрес установлен на localhost: 3000
Как я звоню в паспорт Google на стороне клиента.
render(){
const googleLogin = response => {
let googleData;
googleData = {
googleID: response.profileObj.googleId,
email: response.profileObj.email,
password: "",
};
this.props.googleLogin(googleData);
};
return(
........
<form onSubmit={this.handleSubmit}>
....
</form>
<div>
<GoogleLogin
clientId={'******'}
render={renderProps => (
<GoogleLoginButton
className="googleBtn"
alt="googleLogo"
onClick={renderProps.onClick}
align={"center"}
>
</GoogleLoginButton>
)}
buttonText="Login with Google"
onSuccess={googleLogin}
onFailure={googleLogin}
className="googleComponentBtn"
theme="dark"
/>
</div>
</div>
)
}
Вот моя попытка,
App.js (здесь выбирали токен)
// JWT TOKEN
if (sessionStorage.jwtToken) {
// Set auth token header auth
setAuthToken(sessionStorage.jwtToken);
// Decode token and get user info and exp
const decoded = jwt_decode(sessionStorage.jwtToken);
// Set user and isAuthenticated
store.dispatch(setCurrentUser(decoded));
// Check for expired token
const currentTime = Date.now() / 1000;
if (decoded.exp < currentTime) {
// Logout user
store.dispatch(logoutUser());
// Redirect to login
window.location.href = "/login";
}
}
class App extends Component {
render(){
return (
<Provider store={store}>
<Navbar/>
</Provider>
);
}
}
export default App;
authActions.js
// how the local login works to get an idea
export const loginUser = userData => dispatch => {
Axios.post('/users/login', userData)
.then( res => {
// retrieve token from the response
const token = res.data.token;
console.log(token);
// pass the token in session
sessionStorage.setItem("jwtToken", token);
// set the auth token
setAuthToken(token);
// decode the auth token
const decoded = jwt_decode(token);
// pass the decoded token
dispatch(setCurrentUser(decoded))
})
.catch(err => {
if(err.response.data){
console.log(err.response)
dispatch({
type: GET_ERRORS,
payload: err.response.data
})
}
})
}
// attempt to login with google, and recieve a token from routes.
export const googleLogin = () => dispatch => {
Axios
.get('/users/auth/google', userData)
.then(res => {
const { token } = res.data;
// Set token to ls
sessionStorage.setItem("jwtToken", token);
// Set token to Auth header
setAuthToken(token);
// Decode token to get user data
const decoded = jwt_decode(token);
// Set current user
dispatch(setCurrentUser(decoded));
})
.catch(err => console.log(err));
};
// set logged in user
export const setCurrentUser = (decoded, dispatch) => {
return{
type:SET_CURRENT_USER,
payload:decoded
}
}
маршруты / пользователи Попытка передать токен для реакции
router.get('/auth/google',
passport.authenticate('google', { scope: 'profile'}), (req, res, next) => {
console.log(profile);
jwt.sign(process.env.JWT_SECRET,{expiresIn: 4800}, (err, token) => {
res.json({
success:true,
token: token
})
});
});
router.get('/auth/google/callback',
passport.authenticate('google', { failureRedirect: '/login' }),
(req, res) => {
res.redirect('/');
});
passport.js
passport.use(
new GoogleStrategy(
{
clientID: process.env.clientID,
clientSecret: process.env.secret,
callbackURL: 'http://localhost:3000/auth/google/callback',
// proxy: true
}, (token, tokenSecret, profile, done) => {
// console.log(profile);
User.forge({ googleId: profile.id}).fetch()
.then( (err, user) => {
if(!user){
const googleUser = new User({
googleId: profile.id,
email:profile.emails[0].value
});
googleUser.save().then( user => done(null, user))
}else{
done(null, user)
console.log(user);
}
})
}
))
passport.serializeUser(function(user, done) {
done(null, user.id);
});
passport.deserializeUser(function(user, done) {
User
.forge({id: user})
.fetch()
.then((usr) => {
done(null, usr);
})
.catch((err) => {
done(err);
});
});