System Information
- Strapi Version: 3.15
- Operating System: Windows
- Database: GRAPHQL/APOLLO 3
- Node Version: 14.16
- NPM Version:
- Yarn Version: 1.22.10
Hi I’ve been able to set up the registration through strapi using react native and apollo 3 client and the users are updated onto the website however once I try to log the user in I get a error 400 BAD REQUEST and I have no idea why I’ve went through my code so many times and everything looks fine and I thought it could be something to do with roles and permissions on the strapi server side of the project but I am really unsure what to do. I’ve added a number of screenshots of my code and the strapi server side options.
Login Code:
function LoginPage({navigation}) {
const { login } = React.useContext(AuthContext);
const [email, setEmail] = React.useState('');
const [password, setPassword] = React.useState('');
const [loading, setLoading] = React.useState(false);
return (
<ImageBackground style={styles.background}>
<View style={styles.email}>
<TextInput
placeholder="Enter Email Address"
placeholderTextColor="grey"
type={email}
onChangeText={setEmail}/>
</View>
<View style={styles.password}>
<TextInput secureTextEntry={true} style={styles.default}
autoCapitalize="none"
autoCorrect={false}
placeholder="Enter Password"
placeholderTextColor="grey"
type={password}
onChangeText={setPassword}/>
</View>
{/* Login and register buttons */}
<View style={styles.buttonContainer}>
<LoginButton text=' Register ' onPress={() => navigation.navigate("Register")}/>
<LoginButton text=' Login ' onPress={async () => {
try {
setLoading(true);
await login(email, password);
} catch (e) {
setLoading(false);
console.log(e);
}
} } />
</View>
Registration Code:
function RegistrationForm({navigation}) {
const { register } = React.useContext(AuthContext);
const [email, setEmail] = React.useState('');
const [password, setPassword] = React.useState('');
const [loading, setLoading] = React.useState(false);
return (
<ImageBackground style={styles.background}>
{/* Email and password entry boxes */}
<View style={styles.email}>
<TextInput
placeholder="Enter Email Address"
placeholderTextColor="grey"
type={email}
onChangeText={setEmail}/>
</View>
<View style={styles.password}>
<TextInput secureTextEntry={true} style={styles.default}
autoCapitalize="none"
autoCorrect={false}
placeholder="Enter Password"
placeholderTextColor="grey"
type={password}
onChangeText={setPassword}/>
</View>
<View style={styles.buttonContainer}>
<LoginButton style={styles.buttonContainer2} text=' Sign Up ' onPress={async () => {
try {
setLoading(true);
await register(email, password);
navigation.pop();
} catch (e) {
setLoading(false);
console.log(e);
}
} } />
App.js Code:
export default function App() {
console.log(useDimensions());
const[state, dispatch] = React.useReducer(
(state, action) => {
switch(action.type) {
case 'SET_USER':
return {
...state,
user: {...action.payload},
}
default:
return state;
}
},
{
user: undefined,
}
)
const auth = useMemo( () => ({
login: async (email, password) => {
const {data} = await axios.post('http://192.168.0.11:1337/auth/local', {
identifer: email,
password,
});
const user = {
email: data.user.email,
token: data.jwt,
};
dispatch(createAction('SET_USER', user ))
},
logout: async () => {
console.log('logout')
},
register: async (email, password) => {
await axios.post('http://192.168.0.11:1337/auth/local/register', {
username: email,
email,
password,
})
},
}),
[],
)
console.log(state.user)
return (
<AuthContext.Provider value={auth}>
<NavigationContainer>
<AuthNavigator/>
</NavigationContainer>
</AuthContext.Provider>
);
}
Strapi Options:
For strapi I have users being created into the users section and is showing username, email but not password for some reason? Only shows confirmed next to email.
My admin panel includes 1 super admin and the authenticated users has 2 users as I signed them up using the register form that is working.
Error: