реакция-ошибка загрузки нескольких изображений/файлов django

#react-native #file-upload #django-rest-framework

Вопрос:

У меня есть собственное приложение react с Django на стороне сервера, у которого возникли некоторые проблемы с загрузкой изображений(нескольких) на сервер Django.

вот мой код: react-родной:

   import DocumentPicker from 'react-native-document-picker';
 
     let formData = new FormData();
    formData.append('title', postTitle);
    formData.append('description', postDescription);
    formData.append('created_by', uuid);
    formData.append('images', images);
    
    fetch(url, {
      method: 'POST',
      body: JSON.stringify(formData),
      headers: {
        //Header
        'Content-Type': 'multipart/form-data',
        'Authorization': 'Token '  token
      },
    })
...
 

Джанго:

 class NewsFeedView(APIView):
    """
    An API endpoint for user registration.
    POST must contain 'username', 'email', 'first_name', 'last_name' and 'password' fields.
    """
    permission_classes = (IsAuthenticated, )
    authentication_classes = (TokenAuthentication, )
    parser_classes = (MultiPartParser, FormParser)


    def post(self, request):

        # newsfeed_obj = NewsFeed(title=request.data['title'], 
        description=request.data['description'], is_active=True, created_by=user)
        # newsfeed_obj_dict = newsfeed_obj.__dict__

        print (request)


        images_data = request.data.pop('images')
        print (images_data)
...
 

сервер форм сообщений об ошибках:

 {detail: "Multipart form parse error - Invalid boundary in multipart: None"}
<rest_framework.request.Request: POST '/spnewsfeed/create/'>
Bad Request: /spnewsfeed/create/
 

когда я ставлю multipart/form-data; boundary=<calculated when request is sent> вместе с заголовком,
получаю следующую ошибку:

 <QueryDict: {}>
Internal Server Error: /spnewsfeed/create/
Traceback (most recent call last):
  File "/home/user/.local/lib/python3.6/site-packages/django/core/handlers/exception.py", line 47, in inner
    response = get_response(request)
  File "/home/user/.local/lib/python3.6/site-packages/django/core/handlers/base.py", line 181, in _get_response
    response = wrapped_callback(request, *callback_args, **callback_kwargs)
  File "/home/user/.local/lib/python3.6/site-packages/django/views/decorators/csrf.py", line 54, in wrapped_view
    return view_func(*args, **kwargs)
  File "/home/user/.local/lib/python3.6/site-packages/django/views/generic/base.py", line 70, in view
    return self.dispatch(request, *args, **kwargs)
  File "/home/user/.local/lib/python3.6/site-packages/rest_framework/views.py", line 509, in dispatch
    response = self.handle_exception(exc)
  File "/home/user/.local/lib/python3.6/site-packages/rest_framework/views.py", line 469, in handle_exception
    self.raise_uncaught_exception(exc)
  File "/home/user/.local/lib/python3.6/site-packages/rest_framework/views.py", line 480, in raise_uncaught_exception
    raise exc
  File "/home/user/.local/lib/python3.6/site-packages/rest_framework/views.py", line 506, in dispatch
    response = handler(request, *args, **kwargs)
  File "/home/user/Documents/react-native-works/schoolpathram/schoolpathram/spserver/spnewsfeed/views.py", line 43, in post
    images_data = request.data.pop('images')
  File "/home/user/.local/lib/python3.6/site-packages/django/http/request.py", line 552, in pop
    self._assert_mutable()
  File "/home/user/.local/lib/python3.6/site-packages/django/http/request.py", line 510, in _assert_mutable
    raise AttributeError("This QueryDict instance is immutable")
AttributeError: This QueryDict instance is immutable
 

request.data не придавая никакого значения.

Может кто-нибудь помочь. Заранее благодарен за помощь. Спасибо

Обновление 1: через почтальона мне удалось успешно загрузить несколько файлов изображений: введите описание изображения здесь

Ответ №1:

работал после некоторых сбоев, как показано ниже:

добавлен анализатор файлов:

     parser_class = (FileUploadParser,)
 
 onst formData = new FormData();

    images.forEach(image => {
      formData.append('file', image);

    });

    formData.append('title', postTitle);
    formData.append('description', postDescription);
    formData.append('created_by', uuid);
 
   fetch(url, {
      method: 'POST',
      body: formData,
      headers: {
        //Header
        'Authorization': 'Token '  token
      },
    })
 

вывод почтальона после сохранения