re-frame

https://github.com/Day8/re-frame/blob/master/docs/README.md https://github.com/Day8/re-frame/blob/master/docs/External-Resources.md
ruben.hamers 2021-01-23T07:53:16.021200Z

thx ;)

zendevil 2021-01-23T08:26:31.021400Z

I have converted it into a blob using js/fetch

zendevil 2021-01-23T08:27:40.021600Z

(reg-event-fx
 :upload-shot-video-server
 (fn [coeffects [_ blob]]
   (let [body (js/FormData.)]
     (.append body "video" blob)
     {:http-xhrio {:method :post
                   :uri (str "<http://d18a6571c2e5.ngrok.io>" "/api/upload-shot-video")
                   :body body
                   :on-success [:upload-success]
                   :on-failure [:upload-error]
                   :response-format (edn/edn-response-format)}}))
 )
(reg-event-fx
 :upload-shot-video
 (fn [coeffects _]
   (prn "uploading video")
   (let [response (js/fetch (-&gt; coeffects :db :shot-video-uri))]
     (try
       (go
         (let [blob (&lt;p! (. (&lt;p! response) blob))]
           (js/console.log "blob is " blob)
           (dispatch [:upload-shot-video-server blob])))
       (catch js/Error e (js/console.log "Error is " e)))
     {})))
And the handler is as follows:
(defn upload-shot-video [req]
  (prn "uploading video")
  (prn "video is! " (-&gt; req :params))
  (prn "video is " (-&gt; req :body))
  (<http://clojure.java.io/copy|clojure.java.io/copy> (-&gt; req :body) (<http://clojure.java.io/file|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 (-&gt; req :params :name)
                   :uri (str "<https://humboi-videos.s3-us-west-1.amazonaws.com/>" filename)}))
  (r/response {:res "okay!"}))

zendevil 2021-01-23T08:27:52.021800Z

But the saved file is still 0 bytes

p-himik 2021-01-23T11:11:57.022Z

One small issue - don't call dispatch in event handler. Use effect handlers for that. Move all promise machinery into an effect handler. But that's not what causing you problems. (js/console.log "blob is " blob) - does this print out a blob of the correct non-zero size?

zendevil 2021-01-23T12:17:19.022700Z

it prints ellipses for everything Blob related

zendevil 2021-01-23T12:19:06.022900Z

p-himik 2021-01-23T12:25:48.023300Z

Those ellipses are usually clickable.

zendevil 2021-01-23T12:28:19.023500Z

not in this case

zendevil 2021-01-23T12:29:39.023700Z

also how can the dispatch be in an effect handler if it has to be called in a go block?

zendevil 2021-01-23T12:30:35.023900Z

if it has to be called inside a go block, go returns nil, which means that the effect can’t be specified in the re-frame map

p-himik 2021-01-23T12:35:28.024100Z

Try logging (.-size blob) then. Move the whole go block into an effect handler.

zendevil 2021-01-23T12:40:08.024300Z

yes the size is showing as 4462885

zendevil 2021-01-23T12:40:22.024500Z

which means that the blob is correct

p-himik 2021-01-23T12:42:43.025500Z

In that case I have no idea, sorry. Maybe it's something about React Native, maybe I missed something, maybe you haven't shown something that's important. Or maybe it's something else altogether. The next step would be to confirm that the data is sent to the backend. The Network tab in the DevTools should help with that. If the data is not sent, then I have no clue what's going on. If the data is sent, then it's something on your backend.

zendevil 2021-01-23T12:50:04.025700Z

there are absolutely no new entries showing up in the network tab

zendevil 2021-01-23T12:50:13.025900Z

during the request

zendevil 2021-01-23T12:50:45.026200Z

what’s the best way to debug this?

p-himik 2021-01-23T12:51:14.026400Z

No idea. Especially given that you do receive the request on your backend.

zendevil 2021-01-23T13:03:46.026600Z

another strange thing that happens is that the (-> req :body) only contains a single input stream even when I add multiple key value pairs with (.append …)

zendevil 2021-01-23T13:04:32.026800Z

if the data is multipart, then why only a single input stream in body?

zendevil 2021-01-23T13:15:29.027Z

and why no data in (-> req :params) after adding the wrap-multipart-params middleware?

zendevil 2021-01-23T13:38:18.027200Z

after changing to

(.append body "video" blob "video.mov")
from
(.append body "video" blob)
I get the error:
unrecognized request format nil

zendevil 2021-01-23T13:38:58.027900Z

How to fix this?

zendevil 2021-01-23T13:51:31.028100Z

the server is definitely receiving the request. After adding the request format as (json-request-format), I am seeing the following on (-> req :params)

zendevil 2021-01-23T13:51:32.028300Z

{:parts [[“video” {:data {:collector nil, :offset 0, :name “D7A13384-801E-4D72-8912-9FA967BD61AB.mov”, :type “video/quicktime”, :size 1286383, :blobId “17FC5EC0-7B3E-4F9E-A666-0A46AD771FD2"}}]]}