Sending Data to n8n via WebHook

Questions:

  • Can we send PHP variable values to n8n?
  • Can we build a contact form with n8n on the static website?
  • Can we trigger a Workflow from outside of n8n?

Yes. It’s possible.

No matter you’re using PHP or JavaScript on your website. You can use this

<?php

$curl = curl_init();

curl_setopt_array($curl, [
  CURLOPT_URL => "YOUR n8n WEBHOOK URL here", //Your n8n webhook URL
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => "Name=Hello&Email=hello%40gmail.com", //Data you want to send
  CURLOPT_HTTPHEADER => [
    "Content-Type: application/x-www-form-urlencoded"
  ],
]);

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

JavaScript:

<script>
fetch("YOUR n8n WEBHOOK URL here", { //Replace with n8n URL
  "method": "POST",
  "headers": {
    "Content-Type": "application/x-www-form-urlencoded"
  },
  "body": {
    "Name": "Hello", // Data you wan't to send
    "Email": "[email protected]" // Data you wan't to send
  }
})
.then(response => {
  console.log(response);
})
.catch(err => {
  console.error(err);
});
</script>

Warning: Protect your Webhook URL with env to hide it from Public

NodeJS using Axios:

var axios = require("axios").default;

var options = {
  method: 'POST',
  url: 'YOUR n8n WEBHOOK URL here', //Replace with your URL
  headers: {'Content-Type': 'application/x-www-form-urlencoded'},
  data: {Name: 'Hello', Email: '[email protected]'} //Data you want to send
};

axios.request(options).then(function (response) {
  console.log(response.data);
}).catch(function (error) {
  console.error(error);
});

Python:

import requests

url = "YOUR n8n WEBHOOK URL here"

payload = "Name=Hello&Email=hello%40gmail.com"
headers = {"Content-Type": "application/x-www-form-urlencoded"}

response = requests.request("POST", url, data=payload, headers=headers)

print(response.text)

Using this script can start and send data to n8n.

You have to modify this in order to work as per your requirement.

Is this Great? Drop a :heart: Heart

10 Likes

This is f… awesome, I am making my WordPress and with n8n, this is a super gem. Thx.

2 Likes

Can you please explain this part: Warning: Protect your Webhook URL with env to hide it from Public
Do you mean using a CNAME or how would we be able to do this for a static site?

Are you using any Static Site generator frameworks?

SIMPLE HTML and also simply static for wordpress or wp2static