我有一个快速的API服务器和一个没有代理的create-react-app应用程序。我将passport.js用于OAuth,在MongoDB中查找以反序列化用户。
在后端,我设置了cors中间件,在前端,我使用服务器URL配置了axios基本URL。
在URL栏中使用邮递员/手动编写端点,我的API请求成功并找到了req.user。但是,如果我使用axios从前端发出API请求,则req.user未定义或为空字符串。
我无法弄清楚,请帮助我,伙计。
middlewares.js
app.use(cors())
app.use(cookieSession({
maxAge: 30 * 24 * 60 * 60 * 1000,
keys: [keys.cookieKey]
}))
app.use(compression())
if (process.env.NODE_ENV !== 'production') {
app.use(morgan('tiny'))
}
app.use(bodyParser.json())
app.use(helmet())
app.use(passport.initialize())
app.use(passport.session())
authRoutes.js
app.get(
'/auth/current_user',
(req, res) => {
res.send(req.user)
console.log(req.user) // UNDEFINED ONLY WITH AXIOS IN REACT APP
}
)
actions.js
axios.defaults.baseURL = process.env.REACT_APP_API_URL
export const fetchUser = () => async dispatch => {
const { data } = await axios.get('/auth/current_user')
console.log('USER DATA: ')
console.log(data === '') // TRUE
dispatch({
type: FETCH_USER,
payload: data
})
}
护照config.js
passport.serializeUser((user, done) => {
done(null, user.id)
})
passport.deserializeUser((id, done) => {
User.findById(id).then(user => {
done(null, user)
})
})
重现的步骤:
:npm run start-dev
当您使用google登录时,身份验证流程正确但是(正如您在"网络" chrome devtools标签中看到的那样)' / auth / current_user' api请求有response.data ===""
答案 0 :(得分:0)
我想我有一个解决方案。
<强>后端强>
首先,您必须安装cors npm install --save cors
,而不是粘贴此代码。
import cors from 'cors'
app.use(cors({
methods:['GET','POST'],
credentials: true
}))
<强>前端强>
使用带有凭据和标题选项的axios:
const config = {
withCredentials: true,
headers: {
'Content-Type': 'application/json',
},
};
axios.post('http://localhost:8000/routes/register', user, config);
我希望它会帮助你或其他人。