Unable to upload a video to the server in react-native app

[Prikshet Sharma]

Hi all,

I'm trying to upload a video from the local storage of my device in a cljs react native app to the server. However, uploading the video isn't successful because I don't know how to extract the actual data of the file from the request map.

Here's my code for making the requests:

```

(reg-event-fx

 :upload-shot-video-server

 (fn [coeffects [_ blob]]

   (let [body (js/FormData.)]

     (.append body "video" blob  "video.mov")

     (.append body "key" "VAL")

     {:http-xhrio {:method :post

                   :uri (str "http://d18a6571c2e5.ngrok.io" "/api/upload-shot-video")

                   :body body

                   :on-success [:upload-success]

                   :on-failure [:upload-error]

                   :format (json-request-format)

                   :response-format (raw-response-format) #_(edn/edn-response-format)}}))

 )

(reg-event-fx

 :upload-shot-video

 (fn [coeffects _]

   (prn "uploading video")

   (let [response (js/fetch (-> coeffects :db :shot-video-uri))]

     (try

       (go

         (let [blob (<p! (. (<p! response) blob))]

           (js/console.log "blob is " blob)

           (js/console.log "size of blob is " (.-size blob))

           (dispatch [:upload-shot-video-server blob])))

       (catch js/Error e (js/console.log "Error is " e)))

     {})))

```

These calls apparently aren't multipart params as mentioned in the following post:

https://github.com/ring-clojure/ring/issues/429

Here's the handler of the request in the server, in which I'm trying to copy the body to the video file, but this is unfortunately uploading the map of the request and not the data of the request:

```

{"_parts":[["video",{"_data":{"size":2971246,"blobId":"D002459C-47C5-4403-ABC6-A2DE6A46230A","offset":0,"type":"video/quicktime","name":"DCDE604A-954F-4B49-A1F9-1BCC2C2F37BC.mov","__collector":null}}],["key","VAL"]]}

```

Here's the handler itself:

```

(defn upload-shot-video [req]

  (prn "uploading video")

  (prn "video is! " (-> req :multipart-params))

  (prn "video is " (-> req :params))

  (prn "video before is " (slurp (-> req :body)))

  (.reset (-> req :body))

  (prn "req full" (-> req))

  (prn "video after is " (-> req :body))

  (prn "video is! " (-> req :multipart-params))

  (clojure.java.io/copy (-> req :body) (clojure.java.io/file "./resources/public/video.mov"))

  (let [filename (str (rand-str 100) ".mov")]

    (s3/put-object

     :bucket-name "humboi-videos"

     :key filename

     :file "./resources/public/video.mov"

     :access-control-list {:grant-permission ["AllUsers" "Read"]})

    (db/add-video {:name (-> req :params :name)

                   :uri (str "https://humboi-videos.s3-us-west-1.amazonaws.com/" filename)}))

  (r/response {:res "okay!"}))

```

What I want is to have the data of the video file stored in a file on the server and not the map of the request as I currently am. 

Furthermore, since this is not a multipart request, the :multipart-params key is empty. And in the :params key of the request, there's no :tempfile key, a key which one gets when the wrapping with wrap-multipart-params, which I have done. 

How can I either convert the request to multipart so that it I see the keys in multipart params or able to extract the data from the params map that I have already?