# JavaScript column Function Error Type Error: Failed to Fetch **URL:** \ **Category:** Ask for Help\ **Created:** [May 9, 2024, 9:21pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231 "2024-05-09T21:21:54Z")\ **Posts on this page:** 13\ **Page:** 1
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 9, 2024, 9:21pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/1 "2024-05-09T21:21:54Z")
Hello Gliders, In my app I need just a single POST request and created a js fetch column. While my request works well in several other test tools - for some reason my column is empty and when I double click on it I am getting the above described error. When I inspect network trafic in the browser I see : ERR\_BLOCKED\_BY\_CLIENT. Any idea? Here is my js fetch column: ```auto var data = { "PRIORITETI": [ { "id" : "10" , "name" : "Obezbedi da svaki igrač igra minimalno jedan meč", "priority" : "1" }, { "id" : "20" , "name" : "Maksimizuj broj mečeva", "priority" : "2" }, { "id" : "30" , "name" : "Prioritizuj jutarnje termine", "priority" : "3" }, { "id" : "40" , "name" : "Prioritizuj igrače koji imaju najviše preostalih mečeva", "priority" : "4" }, { "id" : "50" , "name" : "Prioritizuj igrače koji su prijavili najviše termina", "priority" : "5" } ] , "TERMINI_KLUBA": [ { "dan" : "1" , "sat" : "8", "teren" : "vIMfQHxSaJFU8ogpAr0v" }, { "dan" : "1" , "sat" : "8", "teren" : "BG4G07LVpEvs5c9Bc3SI" }, { "dan" : "1" , "sat" : "8", "teren" : "Zk6uhkn9YXzh123c7Pra" }, { "dan" : "2" , "sat" : "8", "teren" : "Zk6uhkn9YXzh123c7Pra" }, { "dan" : "2" , "sat" : "8", "teren" : "vIMfQHxSaJFU8ogpAr0v" }, { "dan" : "3" , "sat" : "8", "teren" : "Zk6uhkn9YXzh123c7Pra" }, { "dan" : "3" , "sat" : "8", "teren" : "vIMfQHxSaJFU8ogpAr0v" } ] , "IGRACI": [ { "PLAYER_ID" : "dnDEeNNPQNyEhCGpaAyBhQ", "PLAYER_NAME" : "Goran Vukojičić ", "ZELI_IGRATI_MECEVA" : "2", "PREOSTALO_MECEVA" : "7", "TERMINI_IGRACA": [ { "dan" : "2" , "sat" : "8" } ], "POTENCIJALNI_PROTIVNICI" :[ "tHGxFNjDQl2YkPd0ga2ZYQ","Od9fmlcnSvWKXjhr9WrJpQ" ] }, { "PLAYER_ID" : "LDY-2YUXQj2feUUgE57xQw", "PLAYER_NAME" : "Nenad Roknic", "ZELI_IGRATI_MECEVA" : "1", "PREOSTALO_MECEVA" : "9", "TERMINI_IGRACA": [ { "dan" : "1" , "sat" : "8" } ], "POTENCIJALNI_PROTIVNICI" :[ "tHGxFNjDQl2YkPd0ga2ZYQ" ] }, { "PLAYER_ID" : "Od9fmlcnSvWKXjhr9WrJpQ", "PLAYER_NAME" : "Nikola Obradovic", "ZELI_IGRATI_MECEVA" : "2", "PREOSTALO_MECEVA" : "9", "TERMINI_IGRACA": [ { "dan" : "2" , "sat" : "8" }, { "dan" : "3" , "sat" : "8" } ], "POTENCIJALNI_PROTIVNICI" :[ "tHGxFNjDQl2YkPd0ga2ZYQ","dnDEeNNPQNyEhCGpaAyBhQ" ] }, { "PLAYER_ID" : "tHGxFNjDQl2YkPd0ga2ZYQ", "PLAYER_NAME" : "Vladislav Groshkov", "ZELI_IGRATI_MECEVA" : "2", "PREOSTALO_MECEVA" : "7", "TERMINI_IGRACA": [ { "dan" : "1" , "sat" : "8" }, { "dan" : "2" , "sat" : "8" }, { "dan" : "3" , "sat" : "8" } ], "POTENCIJALNI_PROTIVNICI" :[ "LDY-2YUXQj2feUUgE57xQw","Od9fmlcnSvWKXjhr9WrJpQ","dnDEeNNPQNyEhCGpaAyBhQ" ] } ] }; var response = await fetch('https://liga.bogdandjukic.com', { method: 'POST', headers: { Accept: 'application/json', 'Content-Type': 'application/json' }, body: JSON.stringify(data) }); const result= await response.text(); return result; ``` ---
**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\ **Post date:** [May 10, 2024, 12:12am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/2 "2024-05-10T00:12:45Z")
This might be related to CORS. If it’s indeed the case, in the past I use services like this to bypass it. [https://corsproxy.github.io/](https://corsproxy.github.io/) > **[GitHub - Rob--W/cors-anywhere: CORS Anywhere is a NodeJS reverse proxy which...](https://github.com/Rob--W/cors-anywhere/)** > > CORS Anywhere is a NodeJS reverse proxy which adds CORS headers to the proxied request. - Rob--W/cors-anywhere Basically prepend a link to your main URL and try to call it again, but these proxies have their own limits and can’t be relied on for production use. Do you have access to the Call API action? ---
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 10, 2024, 4:44am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/3 "2024-05-10T04:44:31Z")
unfortunately no access to Call API. I am on maker app, developing a tennis league app that is not commercial, rather a hobby for myself and friends… ---
**Author:** ![raajkumars](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/raajkumars/32/74046_2.png) [@raajkumars](https://community.glideapps.com/u/raajkumars)\ **Post date:** [May 10, 2024, 5:17am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/4 "2024-05-10T05:17:16Z")
Perhaps you can host this script on GitHub Pages, which is free and then invoke it using the column type `Computed -> Experimental -> Code -> Experimental Code`. Agreed, it is a bit of work to host the code on Gitub Page, but worth the shot. ---
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 10, 2024, 5:40am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/5 "2024-05-10T05:40:27Z")
hi thanks. I wasn’t aware of expertimental code columns. If I understood correctly, this will eliminate CORS issue as entire computation is done on the client, not on the server. ---
**Author:** ![raajkumars](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/raajkumars/32/74046_2.png) [@raajkumars](https://community.glideapps.com/u/raajkumars)\ **Post date:** [May 10, 2024, 5:59am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/6 "2024-05-10T05:59:47Z")
Hmm, I am not sure honestly speaking. Now that I think about this more, even when the function is hosted on a GitHub page, all it does most likely is to serve the javascript to the frontend UI and code will still run on the browser/WebClient. Since I already have Github pages setup, let me give this shot to save you from the trouble for setting up one. ---
**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\ **Post date:** [May 10, 2024, 6:01am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/7 "2024-05-10T06:01:26Z")
> [@raajkumars](#): > > all it does most likely is to serve the javascript to the frontend UI and code will still run on the browser/WebClient. That is correct. ---
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 10, 2024, 8:25am UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/8 "2024-05-10T08:25:20Z")
Is there any hello world example that works with Github pages so I can follow the example to build the column? ---
**Author:** ![raajkumars](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/raajkumars/32/74046_2.png) [@raajkumars](https://community.glideapps.com/u/raajkumars)\ **Post date:** [May 10, 2024, 2:35pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/9 "2024-05-10T14:35:22Z")
Here are the related links: - [Experimental Code](https://www.glideapps.com/docs/experimental-code-column) - [Link to the starter app](https://replit.com/@MarkProbst/glide-experimental-code-substring#README.md) However, even when hosted, the JavaScript code will execute on the client device, not the server, leading to the same CORS issue. The best way to handle this is for the server (e.g., [https://liga.bogdandjukic.com](https://liga.bogdandjukic.com/)) to return a JSONP response. For more information, see [Understanding JSON, JSONP, CORS, and bypassing CORS with JSONP](https://medium.com/developers-arena/understanding-json-jsonp-cors-and-bypassing-cors-with-jsonp-fa5f0cc4edd4). I also missed an important point earlier. Any hosted code must be **idempotent** , meaning it should always return the same result for the same inputs. Your code, which calls another service and likely returns different data each time, may not meet this criterion. While Glide isn’t strictly enforcing this yet, it’s important to consider. Ensure that your approach doesn’t circumvent Glide’s pricing structure by performing actions not supported by your plan. ---
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 10, 2024, 4:31pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/10 "2024-05-10T16:31:48Z")
thanks for the help, but actually I am even more confused. How come that experimental code can cause CORS when there are no any http requests involved? Glide experimental column calls github pages, retrieves the code, executes it locally, it is pure algorithm computation, not http calls. yeah, it is idempotent, as it my app generates input and for the same input, it should return the same result. As far as I know, having one experimental code in the whole app doesn’t affect Glide pricing structure. ---
**Author:** ![raajkumars](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/raajkumars/32/74046_2.png) [@raajkumars](https://community.glideapps.com/u/raajkumars)\ **Post date:** [May 10, 2024, 5:41pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/11 "2024-05-10T17:41:13Z")
Will the code returned from GitHub page include logic to make a HTTP request to fetch the data from your server? If so that request will trigger a CORS exception on the client. But if you’re going to have a server side code that makes the HTTP request on the server and then return only the data, then there shouldn’t be any problem. By the way, I am just an enthusiastic user like you. I don’t work for Glide. My point about Glide plan is just an fyi. ---
**Author:** ![Darko\_Vukoje](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darko_vukoje/32/73227_2.png) [@Darko\_Vukoje](https://community.glideapps.com/u/Darko_Vukoje)\ **Post date:** [May 10, 2024, 6:52pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/12 "2024-05-10T18:52:25Z")
The code returned from github will not make any http request, just local computation. The same here - enthusiasist 😂 ---
**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\ **Post date:** [May 10, 2024, 11:46pm UTC](https://community.glideapps.com/t/javascript-column-function-error-type-error-failed-to-fetch/73231/13 "2024-05-10T23:46:56Z")
> [@Darko\_Vukoje](#): > > unfortunately no access to Call API. I am on maker app, developing a tennis league app that is not commercial, rather a hobby for myself and friends… The solution means you’ll still do a fetch, but instead of fetching from `https://liga.bogdandjukic.com`, you fetch from `https://crossorigin.me/https://liga.bogdandjukic.com`. That’s just an example though. I just realised crossorigin doesn’t support POST requests. > **[Playground - cors.sh playground](https://cors.sh/playground)** > > Test your blocked api here, cors freely. This seems to be another option, where you have a playground.