lbrenman · October 31, 2017 15:37 · Oct 31, 2017 · Oct 31, 2017 · Oct 6, 2017
diff --git a/instructions.md b/instructions.md
@@ -0,0 +1,54 @@
+# Hello FB Chat Bot
+
+## Instructions:
+
+* Create a new API Builder Project
+* Disable Auth (set auth to none in default.js)
+* Run the Project (appc run)
+* Go to http://localhost:8080/console
+* Use ngrok so your API will be accessible by FB
+
+* Follow the FB Messenger Quick Start Guide here: [https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start](https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start)
+  * Create a new FB app [here](https://developers.facebook.com/apps) - DemoBot
+  * Create a new FB Page [here](https://www.facebook.com/pages/create) - Company, Organization or Institution, Engineering, DemoBot
+  * My page ended up [here](https://www.facebook.com/DemoBot-1437442156352884/)
+  * In the developer portal, go to the app page and add a product: messenger
+* Stop here since you will need API Builder APIs to enter in the Webhook section
+
+* Place fbwebhook.js and fbwebhookp.js in the /api folder
+* Run the Project (appc run)
+* Go to http://localhost:8080/console and show the two APIs (webhooks)
+
+* In the Webhooks section, click "Setup Webhooks"
+* Enter https://26bc6f28.ngrok.io/api/fbwebhook for the webhook URL
+* Enter a URL for a webhook, enter a Verify Token (XXX) and select messages and messaging_postbacks under Subscription Fields
+  * See the API Builder console log for
+  ```javascript
+  fbwebhook - fbwebhook API called (GET)
+  Validating webhook
+  ```
+* Since this worked properly, you should see a green check mark that the webhook is complete
+* Review the code for the fbwebhook GET and the validation and the token
+
+* In the Token Generation section, select your Page (created above)
+* Copy page token to clipboard
+* Paste the access token in the callSendAPI() method in the request options
+* Show how the code is mainly copy and pasted from the FB Messenger Quick Start Guide
+* Show how the response is just an echo of what was received
+* Restart the API Builder app
+
+* In the Webhooks section, you can subscribe the webhook for a specific page (Demobot) and click subscribe
+
+* Go to the FB Demobot home page (https://www.facebook.com/DemoBot-1437442156352884/)
+* In the lower right hand corner, bring up the chat window and search for Demobot and click on it
+* You should see a "Demobot is active now. Start a conversation"
+* Type "Hello Demobot"
+* Should see the response: "The API Builder Chatbot detected that you wrote: Hello Demobot"
+* See the console log for the following:
+```javascript
+Received message for user 1896462583703774 and page 1437442156352884 at 1507323189868 with message:
+{"mid":"mid.$cAAUbWLKh6iZlJLvibFe83aaLeYVd","seq":6143,"text":"Hi"}
+Successfully sent generic message with id mid.$cAAUbWLKh6iZlJLvlUle83adD5LKX to recipient 1896462583703774
+```
+
+TADA!
diff --git a/instructions.md b/instructions.md
@@ -1,54 +0,0 @@
-# Hello Axway Alexa Skill
-
-## Instructions:
-
-* Create a new API Builder Project
-* Disable Auth (set auth to none in default.js)
-* Run the Project (appc run)
-* Go to http://localhost:8080/console
-* Use ngrok so your API will be accessible by FB
-
-* Follow the FB Messenger Quick Start Guide here: [https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start](https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start)
-  * Create a new FB app [here](https://developers.facebook.com/apps) - DemoBot
-  * Create a new FB Page [here](https://www.facebook.com/pages/create) - Company, Organization or Institution, Engineering, DemoBot
-  * My page ended up [here](https://www.facebook.com/DemoBot-1437442156352884/)
-  * In the developer portal, go to the app page and add a product: messenger
-* Stop here since you will need API Builder APIs to enter in the Webhook section
-
-* Place fbwebhook.js and fbwebhookp.js in the /api folder
-* Run the Project (appc run)
-* Go to http://localhost:8080/console and show the two APIs (webhooks)
-
-* In the Webhooks section, click "Setup Webhooks"
-* Enter https://26bc6f28.ngrok.io/api/fbwebhook for the webhook URL
-* Enter a URL for a webhook, enter a Verify Token (XXX) and select messages and messaging_postbacks under Subscription Fields
-  * See the API Builder console log for
-  ```javascript
-  fbwebhook - fbwebhook API called (GET)
-  Validating webhook
-  ```
-* Since this worked properly, you should see a green check mark that the webhook is complete
-* Review the code for the fbwebhook GET and the validation and the token
-
-* In the Token Generation section, select your Page (created above)
-* Copy page token to clipboard
-* Paste the access token in the callSendAPI() method in the request options
-* Show how the code is mainly copy and pasted from the FB Messenger Quick Start Guide
-* Show how the response is just an echo of what was received
-* Restart the API Builder app
-
-* In the Webhooks section, you can subscribe the webhook for a specific page (Demobot) and click subscribe
-
-* Go to the FB Demobot home page (https://www.facebook.com/DemoBot-1437442156352884/)
-* In the lower right hand corner, bring up the chat window and search for Demobot and click on it
-* You should see a "Demobot is active now. Start a conversation"
-* Type "Hello Demobot"
-* Should see the response: "The API Builder Chatbot detected that you wrote: Hello Demobot"
-* See the console log for the following:
-```javascript
-Received message for user 1896462583703774 and page 1437442156352884 at 1507323189868 with message:
-{"mid":"mid.$cAAUbWLKh6iZlJLvibFe83aaLeYVd","seq":6143,"text":"Hi"}
-Successfully sent generic message with id mid.$cAAUbWLKh6iZlJLvlUle83adD5LKX to recipient 1896462583703774
-```
-
-TADA!

diff --git a/fbwebhook.js b/fbwebhook.js
@@ -0,0 +1,39 @@
+var Arrow = require('arrow');
+
+var fbwebhook = Arrow.API.extend({
+    group: 'webhooks',
+    path: '/api/fbwebhook',
+    method: 'GET',
+    description: 'this is an api that shows how to handle requests from the FB chatbot',
+    parameters: {
+        'hub.mode': {
+            description: 'hub.mode',
+            optional: true
+        },
+        'hub.challenge': {
+            description: 'hub.challenge',
+            optional: true
+        },
+        'hub.verify_token': {
+            description: 'hub.verify_token',
+            optional: true
+        }
+    },
+    action: function(req, resp, next) {
+        console.log('fbwebhook - fbwebhook API called (GET)');
+
+        if (req.query['hub.mode'] === 'subscribe' &&
+            req.query['hub.verify_token'] === 'XXX') {
+          console.log("Validating webhook");
+          // resp.status(200).send(req.query['hub.challenge']);
+          resp.response.status(200);
+          resp.send(req.query['hub.challenge']);
+        } else {
+          console.error("Failed validation. Make sure the validation tokens match.");
+          resp.response.status(403);
+        }
+        next();
+
+    }
+});
+module.exports = fbwebhook;
diff --git a/fbwebhookp.js b/fbwebhookp.js
@@ -0,0 +1,128 @@
+var Arrow = require('arrow');
+var request = require('request');
+
+function sendGenericMessage(recipientId, messageText) {
+  // To be expanded in later sections
+}
+
+function sendTextMessage(recipientId, messageText) {
+  var messageData = {
+    recipient: {
+      id: recipientId
+    },
+    message: {
+      text: messageText
+    }
+  };
+
+  callSendAPI(messageData);
+}
+
+function callSendAPI(messageData) {
+  request({
+    uri: 'https://graph.facebook.com/v2.6/me/messages',
+    qs: { access_token: 'EAAEtqD7zxecBAGngZBYRgetyohDU9ZBVfFyd1XzkFRzeZCnvy4ebNn41dUMNz0ZC5gbpOU8u23jMK0ZC7YDuFCF6I3VzYDG3fQTlSazH8ZBtvOHjeE0hA9dtZAFIqYDuwxdOflqZCfoJAT067bVOor12rDWjKGcte61RZB8jRM36cZAgZDZD' },
+    method: 'POST',
+    json: messageData
+
+  }, function (error, response, body) {
+    if (!error && response.statusCode == 200) {
+      var recipientId = body.recipient_id;
+      var messageId = body.message_id;
+
+      console.log("Successfully sent generic message with id %s to recipient %s",
+        messageId, recipientId);
+    } else {
+      console.error("Unable to send message.");
+      console.error(response);
+      console.error(error);
+    }
+  });
+}
+
+function receivedMessage(event) {
+  var senderID = event.sender.id;
+  var recipientID = event.recipient.id;
+  var timeOfMessage = event.timestamp;
+  var message = event.message;
+
+  console.log("Received message for user %d and page %d at %d with message:",
+    senderID, recipientID, timeOfMessage);
+  console.log(JSON.stringify(message));
+
+  var messageId = message.mid;
+
+  var messageText = message.text;
+  var messageAttachments = message.attachments;
+
+  if (messageText) {
+
+    // If we receive a text message, check to see if it matches a keyword
+    // and send back the example. Otherwise, just echo the text we received.
+    switch (messageText) {
+      case 'generic':
+        sendGenericMessage(senderID);
+        break;
+
+      default:
+        sendTextMessage(senderID, "The API Builder FB Chatbot detected that you wrote: "+messageText);
+    }
+  } else if (messageAttachments) {
+    sendTextMessage(senderID, "Message with attachment received");
+  }
+}
+
+var fbwebhookp = Arrow.API.extend({
+    group: 'webhooks',
+    path: '/api/fbwebhook',
+    method: 'POST',
+    description: 'this is an api that shows how to handle requests from the FB chatbot',
+    parameters: {
+        'object': {
+            description: 'object',
+            optional: true
+        },
+        'entry': {
+            description: 'entry',
+            optional: true
+        }
+    },
+    action: function(req, resp, next) {
+      console.log('fbwebhook - fbwebhook API called (POST)');
+
+
+      var data = req.body;
+
+      // Make sure this is a page subscription
+      if (data.object === 'page') {
+
+        // Iterate over each entry - there may be multiple if batched
+        data.entry.forEach(function(entry) {
+          var pageID = entry.id;
+          var timeOfEvent = entry.time;
+
+          // Iterate over each messaging event
+          entry.messaging.forEach(function(event) {
+            if (event.message) {
+              receivedMessage(event);
+            } else {
+              console.log("Webhook received unknown event: ", event);
+            }
+          });
+        });
+
+        // Assume all went well.
+        //
+        // You must send back a 200, within 20 seconds, to let us know
+        // you've successfully received the callback. Otherwise, the request
+        // will time out and we will keep trying to resend.
+        resp.response.status(200);
+        next();
+      } else {
+        resp.response.status(200);
+        next();
+      }
+
+    }
+});
+module.exports = fbwebhookp;
diff --git a/instructions.md b/instructions.md
@@ -0,0 +1,54 @@
+# Hello Axway Alexa Skill
+
+## Instructions:
+
+* Create a new API Builder Project
+* Disable Auth (set auth to none in default.js)
+* Run the Project (appc run)
+* Go to http://localhost:8080/console
+* Use ngrok so your API will be accessible by FB
+
+* Follow the FB Messenger Quick Start Guide here: [https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start](https://developers.facebook.com/docs/messenger-platform/getting-started/quick-start)
+  * Create a new FB app [here](https://developers.facebook.com/apps) - DemoBot
+  * Create a new FB Page [here](https://www.facebook.com/pages/create) - Company, Organization or Institution, Engineering, DemoBot
+  * My page ended up [here](https://www.facebook.com/DemoBot-1437442156352884/)
+  * In the developer portal, go to the app page and add a product: messenger
+* Stop here since you will need API Builder APIs to enter in the Webhook section
+
+* Place fbwebhook.js and fbwebhookp.js in the /api folder
+* Run the Project (appc run)
+* Go to http://localhost:8080/console and show the two APIs (webhooks)
+
+* In the Webhooks section, click "Setup Webhooks"
+* Enter https://26bc6f28.ngrok.io/api/fbwebhook for the webhook URL
+* Enter a URL for a webhook, enter a Verify Token (XXX) and select messages and messaging_postbacks under Subscription Fields
+  * See the API Builder console log for
+  ```javascript
+  fbwebhook - fbwebhook API called (GET)
+  Validating webhook
+  ```
+* Since this worked properly, you should see a green check mark that the webhook is complete
+* Review the code for the fbwebhook GET and the validation and the token
+
+* In the Token Generation section, select your Page (created above)
+* Copy page token to clipboard
+* Paste the access token in the callSendAPI() method in the request options
+* Show how the code is mainly copy and pasted from the FB Messenger Quick Start Guide
+* Show how the response is just an echo of what was received
+* Restart the API Builder app
+
+* In the Webhooks section, you can subscribe the webhook for a specific page (Demobot) and click subscribe
+
+* Go to the FB Demobot home page (https://www.facebook.com/DemoBot-1437442156352884/)
+* In the lower right hand corner, bring up the chat window and search for Demobot and click on it
+* You should see a "Demobot is active now. Start a conversation"
+* Type "Hello Demobot"
+* Should see the response: "The API Builder Chatbot detected that you wrote: Hello Demobot"
+* See the console log for the following:
+```javascript
+Received message for user 1896462583703774 and page 1437442156352884 at 1507323189868 with message:
+{"mid":"mid.$cAAUbWLKh6iZlJLvibFe83aaLeYVd","seq":6143,"text":"Hi"}
+Successfully sent generic message with id mid.$cAAUbWLKh6iZlJLvlUle83adD5LKX to recipient 1896462583703774
+```
+
+TADA!