# JavaScript on template fails to Fetch JSON
**URL:** https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392
**Category:** General
**Tags:** http-request
**Created:** [13 August 2022 12:46 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392 "2022-08-13T12:46:20Z")
**Posts on this page:** 17
**Page:** 1
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 12:46 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/1 "2022-08-13T12:46:20Z")
Hello, I am trying to Fetch a JSON from my API in Node-Red but fail to get the contents.
I have simulated my problem in the following image:
Time stamp will work locally but browsing "/test" will require a URL to get to /response
Please adjust URL at the /Get/Test side before testing
Assistance welcome.
The code follows below:
```auto
[
{
"id": "664244b99a502b3b",
"type": "tab",
"label": "Flow 1",
"disabled": false,
"info": "",
"env": []
},
{
"id": "1db96b05a975cce0",
"type": "http response",
"z": "664244b99a502b3b",
"name": "httpResponse",
"statusCode": "",
"headers": {
"Access-Control-Allow-Origin": "*"
},
"x": 720,
"y": 360,
"wires": []
},
{
"id": "dc5fed152c7ce697",
"type": "template",
"z": "664244b99a502b3b",
"name": "httpFormat",
"field": "payload",
"fieldType": "msg",
"format": "handlebars",
"syntax": "mustache",
"template": "{\n \"credits\": \"credits\",\n \"property\":\"property\",\n \"final\":\"final\",\n \"city\":\"city\",\n \"uf\":\"uf\",\n \"man\":\"man\",\n \"model\":\"model\",\n \"year\":\"year\",\n \"cor\":\"cor\",\n \"situation\":\"situation\" \n}",
"output": "json",
"x": 530,
"y": 340,
"wires": [
[
"1db96b05a975cce0",
"7025b429af244030"
]
]
},
{
"id": "7025b429af244030",
"type": "debug",
"z": "664244b99a502b3b",
"name": "",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 710,
"y": 320,
"wires": []
},
{
"id": "7ea5fdfeeff75920",
"type": "node-red-contrib-http-custom-port",
"z": "664244b99a502b3b",
"name": "",
"url": "/response",
"method": "get",
"upload": false,
"swaggerDoc": "",
"port": "3100",
"x": 300,
"y": 340,
"wires": [
[
"dc5fed152c7ce697"
]
]
},
{
"id": "ef49e23bb36ad416",
"type": "node-red-contrib-http-custom-port",
"z": "664244b99a502b3b",
"name": "",
"url": "/test",
"method": "get",
"upload": false,
"swaggerDoc": "",
"port": "3000",
"x": 300,
"y": 260,
"wires": [
[
"6ff4d35fb0e3aec6"
]
]
},
{
"id": "6ff4d35fb0e3aec6",
"type": "template",
"z": "664244b99a502b3b",
"name": "",
"field": "payload",
"fieldType": "msg",
"format": "handlebars",
"syntax": "mustache",
"template": "\n\n\n \n \n \n JSON Test\n\n\n \n \n\n",
"output": "str",
"x": 540,
"y": 240,
"wires": [
[
"806968dacc5db796"
]
]
},
{
"id": "806968dacc5db796",
"type": "http response",
"z": "664244b99a502b3b",
"name": "httpResponse",
"statusCode": "",
"headers": {
"Access-Control-Allow-Origin": "*"
},
"x": 720,
"y": 240,
"wires": []
},
{
"id": "088ffc4886be3459",
"type": "inject",
"z": "664244b99a502b3b",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "",
"payloadType": "date",
"x": 300,
"y": 200,
"wires": [
[
"6ff4d35fb0e3aec6"
]
]
}
]
```
---
### Author:  [@Andrei](https://discourse.nodered.org/u/Andrei)
#### Post date: [13 August 2022 12:54 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/2 "2022-08-13T12:54:20Z")
> [@pcborges](#):
>
> `"type": "node-red-contrib-http-custom-port",`
Many in the forum (including me) will not be able to help since you are using a contrib node that it not very common. Did you try your flow with the built-in http nodes ?
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 12:56 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/3 "2022-08-13T12:56:12Z")
Hi, port 80 is already in use so I had to find a way around and found this very useful node.
Hope my problem is not due to this.
I am using regular nodes at httResponse.
---
### Author:  [@Andrei](https://discourse.nodered.org/u/Andrei)
#### Post date: [13 August 2022 13:03 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/4 "2022-08-13T13:03:41Z")
> [@pcborges](#):
>
> node-red-contrib-http-custom-port
ok, in your environment port 80 is in use but for the purposes of getting support in the forum the flow you provide is not ideal. It would require us to install an additional contrib node.
---
### Author:  [@E1cid](https://discourse.nodered.org/u/E1cid)
#### Post date: [13 August 2022 13:04 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/5 "2022-08-13T13:04:16Z")
The template node does not use javascrpt, are you thinking of the ui-template node.
Or maybe use a http request node
e.g.
```auto
[{"id":"605c596d.54259","type":"http in","z":"664244b99a502b3b","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":270,"y":160,"wires":[["a309bbc2.b86bf8"]]},{"id":"a309bbc2.b86bf8","type":"http request","z":"664244b99a502b3b","name":"","method":"GET","ret":"txt","paytoqs":"ignore","url":"http://192.168.1.25:1880/response","tls":"","persist":false,"proxy":"","authType":"","x":560,"y":120,"wires":[["806968dacc5db796"]]},{"id":"088ffc4886be3459","type":"inject","z":"664244b99a502b3b","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":290,"y":200,"wires":[["a309bbc2.b86bf8"]]},{"id":"806968dacc5db796","type":"http response","z":"664244b99a502b3b","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":710,"y":240,"wires":[]},{"id":"fa8d6555.069f2","type":"http in","z":"664244b99a502b3b","name":"","url":"/response","method":"get","upload":false,"swaggerDoc":"","x":280,"y":340,"wires":[["dc5fed152c7ce697"]]},{"id":"dc5fed152c7ce697","type":"template","z":"664244b99a502b3b","name":"httpFormat","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\n \"credits\": \"credits\",\n \"property\":\"property\",\n \"final\":\"final\",\n \"city\":\"city\",\n \"uf\":\"uf\",\n \"man\":\"man\",\n \"model\":\"model\",\n \"year\":\"year\",\n \"cor\":\"cor\",\n \"situation\":\"situation\" \n}","output":"json","x":520,"y":340,"wires":[["1db96b05a975cce0","7025b429af244030"]]},{"id":"7025b429af244030","type":"debug","z":"664244b99a502b3b","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":700,"y":320,"wires":[]},{"id":"1db96b05a975cce0","type":"http response","z":"664244b99a502b3b","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":720,"y":360,"wires":[]},{"id":"6ff4d35fb0e3aec6","type":"template","z":"664244b99a502b3b","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"\n\n\n \n \n \n JSON Test\n\n\n \n \n\n","output":"str","x":570,"y":180,"wires":[[]]}]
```
add back your http port nodes, as i do not have them installed.
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 13:17 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/6 "2022-08-13T13:17:14Z")
> [@E1cid](#):
>
> The template node does not use javascrpt, are you thinking of the ui-template node.
Sure, the whole template content on the Get/test side is sent to the browser for execution, that part works.
The Browser then calls the Get/Response node asking for the JSON that is sent back to the browser.
The response part can be run alone as long as it has an URL. In my case if I use Chrome and call [http://URL:3100/Response](http://URL:3100/Response) I get the intended JSON returned to the browser. So the response side can be independently tested and it works.
The Get/test side does not do a lot as it only provides to the browser the code it has to run, from there is it a communication Browser X Get/Response
I don't see the "node-red-contrib-http-custom-port" as doing much but who knows...
---
### Author:  [@Andrei](https://discourse.nodered.org/u/Andrei)
#### Post date: [13 August 2022 13:17 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/7 "2022-08-13T13:17:24Z")
> [@pcborges](#):
>
> Hope my problem is not due to this.
What is the result if you replace the content in your template node by something plain simple, like below ?
```auto
Hello Forum
```
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 13:23 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/8 "2022-08-13T13:23:39Z")
Not sure what you mean, please check my last post.
It might well be a problem with the way Fetch is been implemented and the problem would be on the Browser side as it tries to execute what Get/Test sent to it.
Never used JavaScript/Fetch
---
### Author:  [@Andrei](https://discourse.nodered.org/u/Andrei)
#### Post date: [13 August 2022 13:38 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/9 "2022-08-13T13:38:40Z")
> [@pcborges](#):
>
> Never used JavaScript/Fetch
So, the flow and the picture you provided in the OP are only distraction for the real point to address that is the use of fetch. It would be better that you copy and paste in the post the JavaScript code that you want to debug.
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 13:45 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/10 "2022-08-13T13:45:52Z")
I have been trying several thing, both in browser alone and NodeRed.
I am working in both fronts. I have been trying with JavaScript forum for days and started to think it may be a problem with Node-Red so I decided to post it here as well because others may have encountered the same problem.
The Fetch syntax that I posted here is a result of days of tests and that in Browser X Apache works well but my API runs on Node-Red.
So, no distraction, I do not have any distraction for close to a week now trying to sort this problem out.
Ultimately I have to work on both fronts because I really don't know where the problem is.
On another front I am also trying to dish Fetch entirely and are also trying to work with Ajax...
Thanks
---
### Author:  [@zenofmud](https://discourse.nodered.org/u/zenofmud)
#### Post date: [13 August 2022 13:50 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/11 "2022-08-13T13:50:39Z")
Have you used develpoer tools in your browser to see if any messages are showing up in the console or error logs?
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 13:54 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/12 "2022-08-13T13:54:54Z")
Yes, on Microsoft Edge no messages at all.
On Chrome I get: autofill.js:10546 Uncaught TypeError: Cannot read properties of undefined (reading 'encrypt')
But it seems to come from some of their internal libraries.
The result on the browser is the same, nothing.
---
### Author:  [@E1cid](https://discourse.nodered.org/u/E1cid)
#### Post date: [13 August 2022 14:02 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/13 "2022-08-13T14:02:16Z")
OK i see now, this is working for me
```auto
[{"id":"605c596d.54259","type":"http in","z":"30af2d3e.d94ea2","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":210,"y":2940,"wires":[["6ff4d35fb0e3aec6"]]},{"id":"6ff4d35fb0e3aec6","type":"template","z":"30af2d3e.d94ea2","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"\n\n\n\n \n \n \n JSON Test\n\n\n test
\n \n\n","output":"str","x":510,"y":2960,"wires":[["806968dacc5db796","dc805192.256218"]]},{"id":"088ffc4886be3459","type":"inject","z":"30af2d3e.d94ea2","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":230,"y":2980,"wires":[["6ff4d35fb0e3aec6"]]},{"id":"806968dacc5db796","type":"http response","z":"30af2d3e.d94ea2","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":650,"y":3020,"wires":[]},{"id":"dc805192.256218","type":"debug","z":"30af2d3e.d94ea2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":720,"y":2900,"wires":[]},{"id":"fa8d6555.069f2","type":"http in","z":"30af2d3e.d94ea2","name":"","url":"/response","method":"get","upload":false,"swaggerDoc":"","x":220,"y":3120,"wires":[["dc5fed152c7ce697"]]},{"id":"dc5fed152c7ce697","type":"template","z":"30af2d3e.d94ea2","name":"httpFormat","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\n \"credits\": \"credits\",\n \"property\":\"property\",\n \"final\":\"final\",\n \"city\":\"city\",\n \"uf\":\"uf\",\n \"man\":\"man\",\n \"model\":\"model\",\n \"year\":\"year\",\n \"cor\":\"cor\",\n \"situation\":\"situation\" \n}","output":"json","x":460,"y":3120,"wires":[["1db96b05a975cce0","7025b429af244030"]]},{"id":"7025b429af244030","type":"debug","z":"30af2d3e.d94ea2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":640,"y":3100,"wires":[]},{"id":"1db96b05a975cce0","type":"http response","z":"30af2d3e.d94ea2","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":660,"y":3140,"wires":[]}]
```
I removed the loop as the returned data from /response is an object.
output in browser
```auto
test
Name: credits city
```
Add your fetch url back in script
[edit] re pasted flow.json just incase there was an error
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 14:08 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/14 "2022-08-13T14:08:34Z")
> [@E1cid](#):
>
> `[[{"id":"605c596d.54259","type":"http in","z":"30af2d3e.d94ea2","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":210,"y":2940,"wires":[["6ff4d35fb0e3aec6"]]},{"id":"6ff4d35fb0e3aec6","type":"template","z":"30af2d3e.d94ea2","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"\n\n\n\n \n \n \n JSON Test\n\n\n test
\n \n\n","output":"str","x":510,"y":2960,"wires":[["806968dacc5db796"]]},{"id":"088ffc4886be3459","type":"inject","z":"30af2d3e.d94ea2","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":230,"y":2980,"wires":[["6ff4d35fb0e3aec6"]]},{"id":"806968dacc5db796","type":"http response","z":"30af2d3e.d94ea2","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":650,"y":3020,"wires":[]},{"id":"fa8d6555.069f2","type":"http in","z":"30af2d3e.d94ea2","name":"","url":"/response","method":"get","upload":false,"swaggerDoc":"","x":220,"y":3120,"wires":[["dc5fed152c7ce697"]]},{"id":"dc5fed152c7ce697","type":"template","z":"30af2d3e.d94ea2","name":"httpFormat","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{\n \"credits\": \"credits\",\n \"property\":\"property\",\n \"final\":\"final\",\n \"city\":\"city\",\n \"uf\":\"uf\",\n \"man\":\"man\",\n \"model\":\"model\",\n \"year\":\"year\",\n \"cor\":\"cor\",\n \"situation\":\"situation\" \n}","output":"json","x":460,"y":3120,"wires":[["1db96b05a975cce0","7025b429af244030"]]},{"id":"7025b429af244030","type":"debug","z":"30af2d3e.d94ea2","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":640,"y":3100,"wires":[]},{"id":"1db96b05a975cce0","type":"http response","z":"30af2d3e.d94ea2","name":"httpResponse","statusCode":"","headers":{"Access-Control-Allow-Origin":"*"},"x":660,"y":3140,"wires":[]}]`
I am trying to run it right now, may be you pasted something missing.
I am getting: SyntaxError: Expected ',' or ']' after array element in JSON at position 3025
As I import the flow. Thanks
---
### Author:  [@E1cid](https://discourse.nodered.org/u/E1cid)
#### Post date: [13 August 2022 14:15 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/15 "2022-08-13T14:15:19Z")
Extra [ at start i pasted code again in above post.
---
### Author:  [@pcborges](https://discourse.nodered.org/u/pcborges)
#### Post date: [13 August 2022 14:26 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/16 "2022-08-13T14:26:37Z")
Dear E1cid, thanks very much for your effort, I got the return piece of my JSON as you shown.
I will now transport the concept back to my main API.
Thanks a lot
---
### Author:  [@system](https://discourse.nodered.org/u/system)
#### Post date: [27 August 2022 14:26 UTC](https://discourse.nodered.org/t/javascript-on-template-fails-to-fetch-json/66392/17 "2022-08-27T14:26:47Z")
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.