Skip to content

Commit bd8196d

Browse files
knollearyknolleary
committed
More http recipes
1 parent b1f25ef commit bd8196d

13 files changed

+251
-23
lines changed

‎_layouts/default.html

+9-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,15 @@
11
{% include header.html %}
22
<style>
3-
.docs-content pre {
3+
div.flow pre {
44
max-height: 100px;
5-
overflow-y: auto;
5+
overflow-y: scroll;
6+
}
7+
div.shell pre {
8+
background: #333;
9+
}
10+
div.shell pre code {
11+
background: none;
12+
color: #ccc;
613
}
714
code.node {
815
border-radius: 6px;

‎http/access-http-request-headers.md

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
---
2+
layout: default
3+
title: Access HTTP request headers
4+
---
5+
6+
### Problem
7+
8+
You want to access the HTTP headers sent in a request.
9+
10+
### Solution
11+
12+
Use the `req.headers` property of the message sent by the <code class="node">HTTP In</code>
13+
node to access the headers.
14+
15+
#### Example
16+
17+
![](/images/http/http-flow-004.png)
18+
19+
~~~json
20+
[{"id":"c1460268.3eba","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-headers","method":"get","swaggerDoc":"","x":130,"y":380,"wires":[["24199456.dbe66c"]]},{"id":"24199456.dbe66c","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>User agent: {{req.headers.user-agent}}</h1>\n </body>\n</html>","x":310,"y":380,"wires":[["b3531892.4cace8"]]},{"id":"b3531892.4cace8","type":"http response","z":"3045204d.cfbae","name":"","x":450,"y":380,"wires":[]}]
21+
~~~
22+
{: .flow}
23+
24+
~~~text
25+
[~]$ curl http://localhost:1880/hello-headers
26+
<html>
27+
<head></head>
28+
<body>
29+
<h1>User agent: curl&#x2F;7.49.1</h1>
30+
</body>
31+
</html>
32+
~~~
33+
{: .shell}
34+
35+
### Discussion
36+
37+
The `msg.headers` property is an object of key/value pairs for each request header.
38+
The header names are all lower-cased regardless of how they appear in the request.

‎http/create-an-http-endpoint.md

+17-1
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,25 @@ Use the <code class="node">HTTP In</code> node to listen for requests, a
1414
<code class="node">Template</code> node to include the static content, and an
1515
<code class="node">HTTP Response</code> node to reply to the request.
1616

17+
#### Example
18+
1719
![](/images/http/http-flow-001.png)
1820

19-
[{"id":"59ff2a1.fa600d4","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello","method":"get","swaggerDoc":"","x":100,"y":80,"wires":[["54c1e70d.ab3e18"]]},{"id":"54c1e70d.ab3e18","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello World!</h1>\n </body>\n</html>","x":250,"y":80,"wires":[["266c286f.d993d8"]]},{"id":"266c286f.d993d8","type":"http response","z":"3045204d.cfbae","name":"","x":390,"y":80,"wires":[]}]
21+
~~~json
22+
[{"id":"59ff2a1.fa600d4","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello","method":"get","swaggerDoc":"","x":100,"y":80,"wires":[["54c1e70d.ab3e18"]]},{"id":"54c1e70d.ab3e18","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello World!</h1>\n </body>\n</html>","x":250,"y":80,"wires":[["266c286f.d993d8"]]},{"id":"266c286f.d993d8","type":"http response","z":"3045204d.cfbae","name":"","x":390,"y":80,"wires":[]}]
23+
~~~
24+
{: .flow}
25+
26+
~~~text
27+
[~]$ curl http://localhost:1880/hello
28+
<html>
29+
<head></head>
30+
<body>
31+
<h1>Hello World!</h1>
32+
</body>
33+
</html>
34+
~~~
35+
{: .shell}
2036

2137
### Discussion
2238

‎http/handle-query-parameters.md

+28-8
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,25 @@ You want to access the query parameters passed to an HTTP endpoint, such as:
1414
Use the `req.query` property of the message sent by the <code class="node">HTTP In</code>
1515
node to access the parameters.
1616

17+
#### Example
18+
1719
![](/images/http/http-flow-002.png)
1820

19-
[{"id":"b34dd1af.4cb23","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello {{req.query.name}}!</h1>\n </body>\n</html>","x":290,"y":180,"wires":[["b828f6a6.47d708"]]},{"id":"1052941d.efad6c","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-query","method":"get","swaggerDoc":"","x":120,"y":180,"wires":[["b34dd1af.4cb23"]]},{"id":"b828f6a6.47d708","type":"http response","z":"3045204d.cfbae","name":"","x":430,"y":180,"wires":[]}]
21+
~~~json
22+
[{"id":"b34dd1af.4cb23","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello {{req.query.name}}!</h1>\n </body>\n</html>","x":290,"y":180,"wires":[["b828f6a6.47d708"]]},{"id":"1052941d.efad6c","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-query","method":"get","swaggerDoc":"","x":120,"y":180,"wires":[["b34dd1af.4cb23"]]},{"id":"b828f6a6.47d708","type":"http response","z":"3045204d.cfbae","name":"","x":430,"y":180,"wires":[]}]
23+
~~~
24+
{: .flow}
25+
26+
~~~text
27+
[~]$ curl http://localhost:1880/hello-query?name=Nick
28+
<html>
29+
<head></head>
30+
<body>
31+
<h1>Hello Nick!</h1>
32+
</body>
33+
</html>
34+
~~~
35+
{: .shell}
2036

2137
### Discussion
2238

@@ -25,14 +41,18 @@ The `req.query` property is an object of key/value pairs for each query paramete
2541
In the above example, a request to `/hello-query?name=Nick&colour=blue` results in the property
2642
containing:
2743

28-
{
29-
name: "Nick",
30-
colour: "blue"
31-
}
44+
~~~json
45+
{
46+
"name": "Nick",
47+
"colour": "blue"
48+
}
49+
~~~
3250

3351
If there are multiple query parameters with the same name, they will be provided
3452
as an array. For example, `/hello-query?colour=blue&colour=red`:
3553

36-
{
37-
colour: ['blue','red']
38-
}
54+
~~~json
55+
{
56+
"colour": ["blue","red"]
57+
}
58+
~~~

‎http/handle-url-parameters.md

+27-8
Original file line numberDiff line numberDiff line change
@@ -16,24 +16,43 @@ For example, a single endpoint that can handle requests to both:
1616

1717
### Solution
1818

19-
Use named path parameters in your <code class="node">HTTP In</code> node's `path`
19+
Use named path parameters in your <code class="node">HTTP In</code> node's `URL`
2020
property and then access the specific value provided in a request using the
2121
`req.params` property of the message.
2222

23+
#### Flow
24+
2325
![](/images/http/http-flow-003.png)
2426

25-
[{"id":"ce53954b.31ac68","type":"http response","z":"3045204d.cfbae","name":"","x":490,"y":280,"wires":[]},{"id":"288a7c0.fd77584","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello {{req.params.name}}!</h1>\n </body>\n</html>","x":350,"y":280,"wires":[["ce53954b.31ac68"]]},{"id":"7665c67d.899a38","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-param/:name","method":"get","swaggerDoc":"","x":150,"y":280,"wires":[["288a7c0.fd77584"]]}]
27+
~~~json
28+
[{"id":"ce53954b.31ac68","type":"http response","z":"3045204d.cfbae","name":"","x":490,"y":280,"wires":[]},{"id":"288a7c0.fd77584","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Hello {{req.params.name}}!</h1>\n </body>\n</html>","x":350,"y":280,"wires":[["ce53954b.31ac68"]]},{"id":"7665c67d.899a38","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-param/:name","method":"get","swaggerDoc":"","x":150,"y":280,"wires":[["288a7c0.fd77584"]]}]
29+
~~~
30+
{: .flow}
31+
32+
#### Example
33+
~~~text
34+
[~]$ curl http://localhost:1880/hello-param/Nick
35+
<html>
36+
<head></head>
37+
<body>
38+
<h1>Hello Nick!</h1>
39+
</body>
40+
</html>
41+
~~~
42+
{: .shell}
2643

2744
### Discussion
2845

29-
Named path parameters in the `path` property can be used to identify parts of the path
30-
that can vary between requests.
46+
Named path parameters in the `URL` property can be used to identify parts of the
47+
path that can vary between requests.
3148

3249
The `msg.req.params` property is an object of key/value pairs for each path parameter.
3350

34-
In the above example, the node is configured with a path of `/hello-params/:name`,
51+
In the above example, the node is configured with a URL of `/hello-params/:name`,
3552
so a request to `/hello-param/Nick` results in the message property containing:
3653

37-
{
38-
name: "Nick"
39-
}
54+
~~~json
55+
{
56+
"name": "Nick"
57+
}
58+
~~~

‎http/include-data-from-another-flow.md

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
---
2+
layout: default
3+
title: Include data captured in another flow
4+
---
5+
6+
### Problem
7+
8+
You want to respond to an HTTP request using data captured by another flow.
9+
10+
### Solution
11+
12+
Store data using `flow context` so that it can be retrieved within the HTTP flow.
13+
14+
#### Example
15+
16+
![](/images/http/http-flow-005.png)
17+
18+
~~~json
19+
[{"id":"92eaf6c0.6d1508","type":"inject","z":"3045204d.cfbae","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"x":100,"y":480,"wires":[["8055b557.7faa48"]]},{"id":"8055b557.7faa48","type":"change","z":"3045204d.cfbae","name":"Store time","rules":[{"t":"set","p":"timestamp","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":270,"y":480,"wires":[[]]},{"id":"93bf2335.6c40e","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-data","method":"get","swaggerDoc":"","x":120,"y":520,"wires":[["9e3aa25e.61c56"]]},{"id":"9e3aa25e.61c56","type":"change","z":"3045204d.cfbae","name":"Copy time","rules":[{"t":"set","p":"timestamp","pt":"msg","to":"timestamp","tot":"flow"}],"action":"","property":"","from":"","to":"","reg":false,"x":310,"y":520,"wires":[["f2c385a.f0d3c78"]]},{"id":"f2c385a.f0d3c78","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <head></head>\n <body>\n <h1>Time: {{ timestamp }}</h1>\n </body>\n</html>","x":470,"y":520,"wires":[["def756a1.2108a8"]]},{"id":"def756a1.2108a8","type":"http response","z":"3045204d.cfbae","name":"","x":610,"y":520,"wires":[]}]
20+
~~~
21+
{: .flow}
22+
23+
~~~text
24+
[~]$ curl http://localhost:1880/hello-data
25+
<html>
26+
<head></head>
27+
<body>
28+
<h1>Time: 1480201022517</h1>
29+
</body>
30+
</html>
31+
~~~
32+
{: .shell}
33+
34+
### Discussion
35+
36+
There are many different ways data can be stored and retrieved within a flow. For
37+
example, using an external database.
38+
39+
Node-RED provides the `flow context` as a simple key/value store that is accessible
40+
to all nodes on the same tab.
41+
42+
The example above stores a timestamp generated by an <code class="node">Inject</code>
43+
node into `flow context` using a <code class="node">Change</code> node. The flow
44+
that handles the HTTP request then uses another <code class="node">Change</code> node
45+
to retrieve the value, attaching it to the message which is then passed to a
46+
<code class="node">Template</code> node to generate the response.

‎http/index.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@ title: HTTP Recipes
66
- [Create an HTTP Endpoint](create-an-http-endpoint.html)
77
- [Handle query parameters passed to an HTTP endpoint](handle-query-parameters.html)
88
- [Handle url parameters in an HTTP endpoint](handle-url-parameters.html)
9-
- Access HTTP request headers
10-
- Include data captured in another flow
11-
- Serve JSON content
12-
- Serve a local file
9+
- [Access HTTP request headers](access-http-request-headers.html)
10+
- [Include data captured in another flow](include-data-from-another-flow.html)
11+
- [Serve JSON content](serve-json-content.html)
12+
- [Serve a local file](serve-a-local-file.html)
1313
- Post form/JSON data
1414
- Post raw data
1515
- Work with cookies

‎http/serve-a-local-file.md

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
---
2+
layout: default
3+
title: Serve a local file
4+
---
5+
6+
### Problem
7+
8+
You want to create an HTTP endpoint that responds to GET requests with content
9+
from a local file, such an png image.
10+
11+
### Solution
12+
13+
Use the <code class="node">File In</code> node to load the required content and
14+
set the `Content-Type` to the appropriate value for the file type being returned.
15+
16+
#### Example
17+
18+
![](/images/http/http-flow-007.png)
19+
20+
~~~json
21+
[{"id":"c7e341a0.381cc","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-file","method":"get","swaggerDoc":"","x":110,"y":720,"wires":[["2fb1c354.d04e3c"]]},{"id":"2fb1c354.d04e3c","type":"file in","z":"3045204d.cfbae","name":"","filename":"/tmp/node-red.png","format":"","x":290,"y":720,"wires":[["c9e28681.361d78"]]},{"id":"c9e28681.361d78","type":"change","z":"3045204d.cfbae","name":"Set Headers","rules":[{"t":"set","p":"headers","pt":"msg","to":"{}","tot":"json"},{"t":"set","p":"headers.content-type","pt":"msg","to":"image/png","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":470,"y":720,"wires":[["88974243.7768c"]]},{"id":"88974243.7768c","type":"http response","z":"3045204d.cfbae","name":"","x":610,"y":720,"wires":[]}]
22+
~~~
23+
{: .flow}
24+
25+
~~~text
26+
[~]$ curl http://localhost:1880/hello-file > file.png
27+
~~~
28+
{: .shell}
29+
30+
### Discussion
31+
32+
When loading a non-text file such as an image, the <code class="node">File In</code>
33+
node must be configured to return a `Buffer` object.
34+
35+
So that the receiver knows how to handle the file, the `Content-Type` header must
36+
be set to the appropriate mime type. The example above, which returns a `.png` file
37+
sets the `Content-Type` header to `image/png`.

‎http/serve-json-content.md

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
---
2+
layout: default
3+
title: Serve JSON content
4+
---
5+
6+
### Problem
7+
8+
You want to respond to an HTTP request with JSON data.
9+
10+
### Solution
11+
12+
Set the `content-type` of the response to `application/json` using the `msg.headers`
13+
object.
14+
15+
#### Example
16+
17+
![](/images/http/http-flow-006.png)
18+
19+
~~~json
20+
[{"id":"c8107088.37ef9","type":"http in","z":"3045204d.cfbae","name":"","url":"/hello-json","method":"get","swaggerDoc":"","x":120,"y":620,"wires":[["4e8237da.b17dc8"]]},{"id":"4e8237da.b17dc8","type":"template","z":"3045204d.cfbae","name":"page","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"{ \"Hello\": \"World\" }","x":290,"y":620,"wires":[["65401623.9abfe8"]]},{"id":"65401623.9abfe8","type":"change","z":"3045204d.cfbae","name":"Set Headers","rules":[{"t":"set","p":"headers","pt":"msg","to":"{}","tot":"json"},{"t":"set","p":"headers.content-type","pt":"msg","to":"application/json","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":450,"y":620,"wires":[["f7d3e35a.082c2"]]},{"id":"f7d3e35a.082c2","type":"http response","z":"3045204d.cfbae","name":"","x":610,"y":620,"wires":[]}]
21+
~~~
22+
{: .flow}
23+
24+
~~~text
25+
[~]$ curl -i http://localhost:1880/hello-json
26+
HTTP/1.1 200 OK
27+
X-Powered-By: Express
28+
Access-Control-Allow-Origin: *
29+
Content-Type: application/json; charset=utf-8
30+
Content-Length: 20
31+
ETag: W/"14-jgfjeX8FTECC4q5nXp6n5g"
32+
Date: Sat, 26 Nov 2016 23:07:50 GMT
33+
Connection: keep-alive
34+
35+
{ "Hello": "World" }
36+
~~~
37+
{: .shell}
38+
39+
### Discussion
40+
41+
The HTTP headers returned in the response can be set using the `msg.headers`
42+
property. It should be an object of key/value pairs for each header.
43+
44+
To return well-formed JSON, the `Content-Type` header should be set to
45+
`application/json` so the receiver knows to handle it as JSON data.

‎images/http/http-flow-004.png

8.68 KB
Loading

‎images/http/http-flow-005.png

19.2 KB
Loading

‎images/http/http-flow-006.png

11.9 KB
Loading

‎images/http/http-flow-007.png

13.3 KB
Loading

0 commit comments

Comments
 (0)