https://github.com/hunkim/wit-facebook
Wit-Faebook Messenger Example
https://github.com/hunkim/wit-facebook
Last synced: about 1 year ago
JSON representation
Wit-Faebook Messenger Example
- Host: GitHub
- URL: https://github.com/hunkim/wit-facebook
- Owner: hunkim
- Created: 2016-04-22T16:29:39.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2016-07-21T12:43:59.000Z (almost 10 years ago)
- Last Synced: 2025-04-09T20:08:21.005Z (about 1 year ago)
- Language: JavaScript
- Size: 31.3 KB
- Stars: 157
- Watchers: 20
- Forks: 257
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Wit-Facebook
[](https://travis-ci.org/hunkim/Wit-Facebook)
[](https://www.codacy.com/app/hunkim/Wit-Facebook)
Wit.ai and Facebook Messenger Integration Example
## Initial Installation
Fork this repository and clone.
```bash
git clone https://github.com/{forked}/Wit-Facebook.git
cd Wit-Facebook
npm install
```
## Configuration
### Wit Setting
Go to https://wit.ai/home and create a wit app for you. Read https://wit.ai/docs/quickstart and see a demo at: https://wit.ai/sungkim/weather/stories.
Then, go to the setting in your wit app and get the token id.

Test the bot.js with your WIT_TOKEN, and make sure the bot is working.
```bash
$WIT_TOKEN=insert_token_here node bot
```
You can type your text, and see bot's response.
```bash
Bot testing mode.
> What is the weather? # your msg
Executing merge action
Executing say with message: Where exactly?
Where exactly? # bot
> In Seoul? # your msg
Executing merge action
Executing action: fetch-weather
Executing say with message: I see it’s sunny in Seoul today!
I see it’s sunny in Seoul today! # bot
>
```
### Facebook Page Creation
First you need to make a Facebook Page at https://www.facebook.com/pages/create/?ref_type=pages_browser, since the messenger bot will be connected to your facebook page.
### Facebook App Creation
* Add a new app at https://developers.facebook.com/quickstarts/?platform=web. Name it and click "Create New Facebook App ID":

* Add email, select category, an add web site. (Any URL is OK):

### Facebook Messenger Setting
* From https://developers.facebook.com/apps/, select the created app:

* Select Messenger and get started:

* Select the page you have created and get the Page Access Token:

### Launch Server in Heroku
* Run heroku create and push to heroku:
```bash
cd Wit-Facebook
heroku create
git push heroku master
```
* Alternatively, click the button below:
[](https://heroku.com/deploy)
* You need to set WIT_TOKEN and FB_PAGE_TOKEN. You can set your FB_VERIFY_TOKEN which is a token used to verify the server. The default value is "just_do_it". Set the WIT_TOKEN, FB_PAGE_TOKEN, and FB_VERIFY_TOKEN config variables.

* Make sure "Deploy to Heroku" is green and click the "View" button:

* If it is set correctly, you will see something like this from https://{yourspecificedname}.herokuapp.com/:
"Only those who will risk going too far can possibly find out how far one can go." - T.S. Eliot"
### Facebook Webhooks Setting
* The final step is to put this server URL in the Facebook app setting. From https://developers.facebook.com/apps/, select your app and messenger. You will see Webhooks:

* Select "Setup Webhooks", and you will see callback URL and verify token. For the callback URL put your Hherokuapp URL + "/webhook". For example, my callback URL is https://fbwitbot.herokuapp.com/webhook.
* Type the Verify Token that you set in the Heruku app setting. If you haven't set, the default value is "just_do_it".
* Click all items in the Subscription Fields.

* Then, you will see the green complete!

* You may need to select the Facebook Page one more time and get the access token.

* You need to fire this command to activate your messanger.
```bash
curl -X POST "https://graph.facebook.com/v2.6/me/subscribed_apps?access_token="
```
* You may see:
```bash
{"success":true}
```
* Finally, go to the Facebook page you created/selected, and talk to your bot. Enjoy!


## Testing
### Jest
```bash
npm test
```
### Bot testing
```bash
$WIT_TOKEN=insert_token_here node bot
```
### Server testing
First, run the server
```bash
$WIT_TOKEN=insert_token_here node index
```
In other shell, fire this command:
```bash
$curl -X POST -H "Content-Type: application/json" -d @__tests__/msg.json http://localhost:8445/webhook
```
You will see something like this:
```
I'm wating for you @8445
Executing merge action
Executing action: fetch-weather
Executing say with message: I see it’s sunny in Hong Kong today!
I see it’s sunny in Hong Kong today!
Oops! An error occurred while forwarding the response to USER_ID : An active access token must be used to query information about the current user.
Waiting for futher messages.
```
The USER_ID error is OK, but make sure the bot says, "I see it’s sunny in Hong Kong today!".
## Credit
I reused soruce code and configuration from:
* https://github.com/wit-ai/node-wit
* https://github.com/jw84/messenger-bot-tutorial
* https://developers.facebook.com/docs/messenger-platform/quickstart
## Contribution
We welcome your comments and PRs!