Webhooks上的一个简单方法：恐吓现在停止

Webhook.

Webhook。

It sounds like what happens when you cross a spider and a pirate. In the world of the internet though, webhooks are something completely different. Webhooks help connect services together.

听起来就像当您越过蜘蛛和海盗时会发生什么。但是，在互联网世界中，网络钩子是完全不同的东西。 Webhooks帮助将服务连接在一起。

Let me explain.

让我解释。

Say we have two hypothetical services. One is a service that generates data, and the other that gathers and organizes that data.

说我们有两个假设的服务。一个是生成数据的服务，另一个是收集和组织数据的服务。

The developers of the first service thought, “Man, our platform is only so useful. Let’s give the users the ability to forward real-time data to other services.”

第一项服务的开发人员认为：“伙计，我们的平台是如此有用。让我们为用户提供将实时数据转发到其他服务的能力。”

The developers of the second service thought. “Gee willikers, it would be great if our users could import data easier.” So, they added webhooks to receive data in real time from a service like the first service.

第二种服务的开发者认为。 “ Gee willikers，如果我们的用户可以更轻松地导入数据，那就太好了。” 因此，他们添加了Webhook，以从诸如第一个服务之类的服务实时接收数据。

Now as a user, you happen to use both services. You now have the power in your hands to connect them together.

现在，作为用户，您碰巧同时使用了这两种服务。现在，您可以将它们连接在一起。

The best way to explain it is with a real-world example.

解释它的最好方法是使用一个实际示例。

真实的例子 (Real World Example)

On a recent project, I connected an IoT sensor to a Google Docs Sheet. It took me only about 10 minutes. I’m going to show you the same right now.

在最近的项目中，我将IoT传感器连接到Google文档表。我只花了大约10分钟。我现在将向您展示相同的内容。

首先让我们开始设置Google表格。 (Let’s first start by setting up the Google Sheet.)

Create a new sheet建立新工作表

Once you’re there, go to Tools and click Script editor

到那里后，转到“ 工具” ，然后单击“ 脚本编辑器”

It should open up a new window which looks something like this:它应该打开一个新窗口，看起来像这样：

Copy and paste this code. I’ll explain it after we do that.复制并粘贴此代码。这样做之后，我会解释。

//this is a function that fires when the webapp receives a POST requestfunction doPost(e) {    //Return if null  if( e == undefined ) {    console.log("no data");    return HtmlService.createHtmlOutput("need data");   }    //Parse the JSON data  var event = JSON.parse(e.postData.contents);  var data = event.data;

//Get the last row without data  var sheet = SpreadsheetApp.getActiveSheet();  var lastRow = Math.max(sheet.getLastRow(),1);  sheet.insertRowAfter(lastRow);    //Get current timestamp  var timestamp = new Date();    //Insert the data into the sheet  sheet.getRange(lastRow + 1, 1).setValue(event.published_at);  sheet.getRange(lastRow + 1, 2).setValue(data.temperature);  sheet.getRange(lastRow + 1, 3).setValue(data.humidity);  sheet.getRange(lastRow + 1, 4).setValue(data.pm10);  sheet.getRange(lastRow + 1, 5).setValue(data.pm25);  sheet.getRange(lastRow + 1, 6).setValue(data.tvoc);  sheet.getRange(lastRow + 1, 7).setValue(data.c02);    SpreadsheetApp.flush();  return HtmlService.createHtmlOutput("post request received");}

Now, let’s understand everything.

现在，让我们了解所有内容。

function doPost(e) {

Is the function that gets called on a POST event. Consider this script as a web server. We’re sending it data at a specific address (that we’ll have in a hot minute)

是在POST事件上调用的函数。将此脚本视为Web服务器。我们正在将数据发送到一个特定的地址(我们将在一分钟之内收到)

e is the object of the HTTP call. It will have the data that we’re sending it. So it’s a good idea to check if it’s NULL. If it is, then there’s no need to run the script.

e是HTTP调用的对象。它将包含我们正在发送的数据。因此，最好检查它是否为NULL。 如果是这样，则无需运行脚本。

If we do have valid data, let’s change it from a string into useable JSON. You can use everyone’s favorite functionJSON.parse to do so.

如果我们确实有有效的数据，让我们将其从字符串更改为可用的JSON。您可以使用每个人喜欢的功能JSON.parse来执行此操作。

var event = JSON.parse(e.postData.contents);

Remember, the structure of the data will determine how you process it! You may have to run JSON.parse several times depending on how nested your data is and what format it’s in.

请记住，数据的结构将决定您如何处理它！您可能必须多次运行JSON.parse ，这取决于您的数据嵌套的方式和格式。

After you have your data, it’s time to put it in the right place!

拥有数据之后，就该将其放置在正确的位置了！

//Get the last row without datavar sheet = SpreadsheetApp.getActiveSheet();var lastRow = Math.max(sheet.getLastRow(),1);sheet.insertRowAfter(lastRow);

These three calls will get you to the first available row starting at row 1 (leaving row 0 for the column labels).

这三个调用将带您到第1行开始的第一个可用行(列标签保留第0行)。

Then, finally, we put the data in the row it belongs:

然后，最后，我们将数据放在它所属的行中：

sheet.getRange(lastRow + 1, 1).setValue(event.published_at);

Where the first parameter of sheet.getRange is the row and the second is the column. You can use the setValue function to set what you want in that particular cell.

其中sheet.getRange的第一个参数是行，第二个参数是列。您可以使用setValue函数来设置所需的特定单元格。

By the way, the inspiration for this code came from this post.

顺便说一句，这段代码的灵感来自于这篇文章。

Cool. So we have a script. How do we call it?

凉。所以我们有一个脚本。我们怎么称呼它？

Hit that Publish button

点击那个发布按钮

Click Deploy as a web app

点击Deploy as a web app

Change the settings to match the screenshot below. Then click Deploy

更改设置以匹配下面的屏幕截图。然后点击Deploy

You may get a screen asking you to update your permissions. Click Review Permissions

您可能会看到一个屏幕，要求您更新权限。单击Review Permissions

Click the Advanced and then click Go to <Your File Name> in the bottom left.

单击Advanced ，然后单击左下方的Go to <Your File Na >。

Finally, click Allow

最后，点击Allow

In the last screen, copy your Webhook URL!在最后一个屏幕中，复制您的Webhook URL！

测试一下 (Test it)

Now we can test if everything works by using Postman. If you haven’t played with Postman yet, it’s a great graphical user interface for curl.

现在，我们可以使用Postman测试一切是否正常。如果您还没有玩过Postman，那将是curl的绝佳图形用户界面。

Install Postman. You may need an account to go further.

安装邮递员。您可能需要一个帐户才能继续使用。
Once inside, create a new request. Name it so you know it belongs to this Google Docs webhook进入内部后，创建一个新请求。为其命名，以确保它属于此Google Docs Webhook

Click body and enter the following test code:

单击body然后输入以下测试代码：

{    "event": "gdxg",    "data": {        "temperature": 21    },    "coreid": "zczxvz",    "published_at": "zcvzxcvx"}

Finally, click that blue Send button.

最后，单击该蓝色的“ Send按钮。

Go back to your excel sheet and see the magic!返回您的Excel工作表并查看魔术！

Now we’re cooking with gas!

现在我们正在用煤气做饭！

结论 (Conclusion)

I hope you’ve gotten the above example to work. Luckily for you, there’s a lot less to worry about once you get this part up and running!

希望您能使用上面的示例。幸运的是，一旦您完成了这部分的准备工作，就不必担心了！

To recap, we’ve talked about webhooks and why they’re used. You should be feeling confident at this point to go and set up some of your own. If you’re still feeling intimidated, I recommend using services like Zapier or IFTTT. (They’re shiny front ends for APIS and Webhooks already available.)

回顾一下，我们讨论了Webhook及其使用原因。在这一点上，您应该有信心自己建立一些。如果您仍然感到害怕，建议您使用Zapier或IFTTT之类的服务。 (它们是已经可用的APIS和Webhooks的闪亮前端。)

Last but not least check out the full post where I integrate hardware and web in one awesome project.

最后但并非最不重要的一点是，查看完整的文章，其中我将硬件和Web集成到一个了不起的项目中。

Happy webhooking!

祝您网络愉快！

翻译自: https://www.freecodecamp.org/news/a-simple-how-to-on-webhooks-the-intimidation-stops-now-9671e8c94c76/