Cross-Origin Request Blocked when sending HTTP request from a WP site to Gentle MacOS app running on localhost

[jimkleiber]

I'm trying to add a feature on my WordPress site where I can send an audio file and transcript to Gentle and have it return the aligned JSON to the WP site, yet I'm struggling.

I've got the audio in a blob and put the text in just a string all in FormData, yet when I make a js fetch request to http://localhost:8765/transcriptions, it gives me the following error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8765/transcriptions. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 302.

I tried to use ngrok to put the localhost:8765 to a public site and yet that was failing, too.

I wanted to test this first and if I got it working, then maybe install Gentle in Docker on a hosted server so that I don't have to access my computer, so that I didn't spend too much time on Docker if I didn't have to.

Any ideas what's happening and how I can fix it?

---

EDIT: maybe this was because I used http://localhost:8765/transcriptions...when I use http://localhost:8765/transcriptions?async=false, I don't automatically get the cross-origin request error.

However, I don't get any response. Perhaps my FormData is not correct.

I have the audio in a regular blob with audio as the key and the text just in a string with text as the key.

Any ideas?

---

EDIT 2: I converted the text to a blob and included it like that.

I got no response in the console for like 15 minutes but I could tell my computer was doing something as the fan turned on.

Then I got the same error as I put in the title here and also got:

Error uploading audio file: TypeError: NetworkError when attempting to fetch resource.

[ncioffi1]

Were you able to solve this & get a web version of requests working? Encountered similar issues, have tried pretty much all possibilities listed in the README of running gentle and no matter what I do, the request either gets denied by CORS, or perpetually hangs.

Would really love to know if someone got this working via sending a request with comparable times to running via the application.

[jimkleiber]

I haven't yet got the HTTP request to work using fetch on js, but I was thinking to do an ajax call to my php code and then do a curl from there to localhost:8765. Curls have worked from my local machine to localhost:8765, so I feel hopeful it should work that way.

Regarding similar timing, I did a curl request to localhost:8765 and did a command-line python3 align.py call and they took the same amount of time to align.