Ошибка при попытке соединить Django с ReactNative
Я создаю приложение React Native с Django в качестве бэкенда. Я настроил экран входа в React Native и настроил JWT-аутентификацию с помощью rest_framework_simplejwt в Django. Однако при попытке войти в систему я сталкиваюсь с ошибкой.
На экране входа в систему:
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const [error, setError] = useState("");
const handleSubmission = async () => {
try {
const response = await axios.post("http://127.0.0.1:8080/api/token/", {
username,
password,
});
if (!response || !response.data) {
throw new Error("Invalid server response");
}
await AsyncStorage.setItem("accessToken", response.data.access);
await AsyncStorage.setItem("refreshToken", response.data.refresh);
navigation.navigate("Tab");
} catch (error) {
console.error("error", error);
const errorMessage = error.response && error.response.data && error.response.data.message
? error.response.data.message
: "Whoops! Log In Failed, please try again later 😅.";
setError(errorMessage);
}
};
В Django представления:
@api_view(['POST'])
@permission_classes([IsAuthenticated])
def create_user(request):
serializer = CreateUserSerializer(data=request.data)
if serializer.is_valid():
serializer.save()
return Response(serializer.data, status=status.HTTP_201_CREATED)
return Response({'message': "Whoops! error while creating user 🫣", 'error': serializer.errors}, status=status.HTTP_400_BAD_REQUEST)
Сериализаторы:
class CreateUserSerializer(serializers.ModelSerializer):
class Meta:
model = User
fields = ['username', 'password']
def create(self, validated_data):
validated_data['password'] = make_password(validated_data.get('password'))
return super(CreateUserSerializer, self).create(validated_data)
и я настроил cors в settings.py, чтобы я мог делать API-запросы на своей машине:
INSTALLED_APPS = [
'corsheaders', # DEV ONLY
...
]
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware', # DEV ONLY
...
]
CORS_ALLOW_ALL_ORIGINS = True # DEV ONLY
Ошибка, которую я получаю: LOG error [TypeError: Cannot read property 'status' of undefined]
Что я пробовал:
- Убедитесь, что corsheaders установлен и правильно настроен.
- Убедитесь, что конечная точка бэкенда http://127.0.0.1:8080/api/token/ корректна и достижима.
- Записал полный объект ошибки.
Как устранить ошибку TypeError: Cannot read property 'status' of undefined error и гарантировать, что моя функциональность входа в систему работает правильно?
Чтобы подключить react native к серверу django, запустите сервер на вашем ip вместо localhost. Предполагается, что ваш ip равен 10.0.0.49
python manage.py runserver 10.0.0.49:8000
Затем измените запрос фронтенда на
const response = await axios.post("http://10.0.0.49:8080/api/token/", {
username,
password,
});
У меня тоже была такая проблема с моим проектом django rn некоторое время назад, очень расстраивало