xdevplatform/account-activity-dashboard

Sample web app and helper scripts to get started with the premium Account Activity API

account-activity-dashboard

Sample web app and helper scripts to get started with Twitter's premium Account Activity API (All Activities). Written in Node.js. Full documentation for this API can be found on the Account Activity API reference.

For the enterprise tier of the Account Activity API, please check out the Enterprise Account Activity Dashboard sample app.

Dependencies

• A Twitter app created on developer.twitter.com, enabled for access to the Account Activity API
• Node.js
• Heroku CLI or other webhost (optional)
• ngrok or other tunneling service (optional)

Create and configure a Twitter app

1. Create a Twitter app on Twitter Developer

2. On the Permissions tab ➡️ Edit ➡️ Access permission section ➡️ enable Read, Write and direct messages.

3. On the Keys and Tokens tab ➡️ Access token & access token secret section ➡️ click Create button.

4. On the Keys and Tokens tab, take note of the consumer API key, consumer API secret, access token and access token secret.

Setup & run the Node.js web app

1. Clone this repository:

   git clone https://github.com/twitterdev/account-activity-dashboard.git

2. Install Node.js dependencies:

   npm install

3. Pass your Twitter keys, tokens and webhook environment name as environment variables. Twitter keys and access tokens are found on your app page on your App Dashboard. The basic auth properties can be anything you want, and are used for simple password protection to access the configuration UI. As an alternative, instead of setting up env variables, you can copy the env.template file into a file named .env and and add these details there.

   TWITTER_CONSUMER_KEY= # your consumer key
   TWITTER_CONSUMER_SECRET= # your consimer secret
   TWITTER_ACCESS_TOKEN= # your access token
   TWITTER_ACCESS_TOKEN_SECRET= # your access token secret
   TWITTER_WEBHOOK_ENV= # the name of your environment as specified in your App environment on Twitter Developer
   BASIC_AUTH_USER= # your basic auth user
   BASIC_AUTH_PASSWORD= # your basic auth password

4. Run locally:

   npm start

5. Deploy app or setup a tunnel to localhost. To deploy to Heroku see "Deploy to Heroku" instructions below. To setup a tunnel use something like ngrok.

   Take note of your webhook URL. For example:

   https://your.app.domain/webhook/twitter
   

6. Take note of the deployed URL, revisit your developer.twitter.com Apps Settings page, and add the following URL values as whitelisted Callback URLs:

   http(s)://your.app.domain/callbacks/addsub
   http(s)://your.app.domain/callbacks/removesub
   

Configure webhook to receive events

To configure your webhook you can use this apps' web UI, or use the example scripts from the command line.

Using the web UI

Load the web app in your browser and follow the instructions below.

1. Setup webhook config. Navigate to the "manage webhook" view. Enter your webhook URL noted earlier and click "Create/Update."

2. Add a user subscription. Navigate to the "manage subscriptions" view. Click "add" and proceed with Twitter sign-in. Once complete your webhook will start to receive account activity events for the user.

Using the command line example scripts

These scripts should be executed from root of the project folder. Your environment, url or webhook ID should be passed in as command line arguments.

1. Create webhook config.

   node example_scripts/webhook_management/create-webhook-config.js -e <environment> -u <url>

2. Add a user subscription for the user that owns the app.

   node example_scripts/subscription_management/add-subscription-app-owner.js -e <environment>

3. To add a user subscription for another user using PIN-based Twitter sign-in.

   node example_scripts/subscription_management/add-subscription-other-user.js -e <environment>

Note: More example scripts can be found in the example_scripts directory to:

• Create, delete, retrieve and validate webhook configs.
• Add, remove, retrieve, count and list user subscriptions.

Deploy to Heroku (optional)

1. Init Heroku app.

   heroku create

2. Run locally.

   heroku local
   

3. Configure environment variables for each See Heroku documentation on Configuration and Config Vars.

4. Deploy to Heroku.

   git push heroku master

Note: The free tier of Heroku will put your app to sleep after 30 minutes. On cold start, you app will have very high latency which may result in a CRC failure that deactivates your webhook. To trigger a challenge response request and re-validate, run the following script.

node example_scripts/webhook_management/validate-webhook-config.js -e <environment> -i <webhook_id>

Production considerations

This app is for demonstration purposes only, and should not be used in production without further modifcations. Dependencies on databases, and other types of services are intentionally not within the scope of this sample app. Some considerations below:

• With this basic application, user information is stored in server side sessions. This may not provide the best user experience or be the best solution for your use case, especially if you are adding more functionality.
• The application can handle light usage, but you may experience API rate limit issues under heavier load. Consider storing data locally in a secure database, or caching requests.
• To support multiple users (admins, team members, customers, etc), consider implementing a form of Access Control List for better security.

account-activity-dashboard's Issues

Adding deployment support for GitPod

Hi Twitter Devs,

I have a suggestion as I am using GitPod. Should do you have any plans in adding GitPod deployment support? Any other thoughts?

Verified

Add instructions on whitelisting callback URL for sign-in

Per the latest updates, developers will need to whitelist the callback URL

Details:
https://twittercommunity.com/t/sign-in-with-twitter-users-must-whitelist-callback-urls/105342

URL to whitelist:
http(s)://host/callbacks/addsub
http(s)://host/callbacks/removesub

Can't add user subscription for the user that owns the app.

I can add a users' subscription as long as it's not the owner of the app... (?)
(app deployed on Heroku)

Got the following error when trying to add the owner of the app:

{"errors":[{"code":348,"message":"Client application is not permitted to access this user\'s webhook subscriptions."}]}' } }

Unable to add new subscription.

I think after latest changes from twitter, add subscription if throwing error. Please help.

Error: Callback URL not approved for this client application. Approved callback URLs can be adjusted in your application settings
at Strategy.parseErrorResponse (d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\passport-twitter\lib\strategy.js:206:12)
at Strategy.OAuthStrategy._createOAuthError (d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\passport-oauth1\lib\strategy.js:393:16)
at d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\passport-oauth1\lib\strategy.js:244:41
at d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\oauth\lib\oauth.js:543:17
at passBackControl (d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\oauth\lib\oauth.js:397:13)
at IncomingMessage. (d:\VSCodeWorkSapce\account-activity-dashboard-master\node_modules\oauth\lib\oauth.js:409:9)
at emitNone (events.js:111:20)
at IncomingMessage.emit (events.js:208:7)
at endReadableNT (_stream_readable.js:1064:12)
at _combinedTickCallback (internal/process/next_tick.js:138:11)
at process._tickCallback (internal/process/next_tick.js:180:9)

Unable to get push notification on register webhook for user events

Hello Team ,

I am trying to debug Activity Api for subscribed user for my registered application using webhook events mentioned in documentation but couldn’t get activity log in registerd webhook.

Ref App : https://github.com/twitterdev/account-activity-dashboard
I used one of node application above that twitter recommadate for debug purpose wherein also am not able to log any of event for register webhook user (currently have 2 active registered user for premium activity api ) over https enabled server having read/write and DM permission from twitter for current appilication
.

This repository contains code for the account activity API dashboard sample app. What issue are you reporting?

This repository contains code for the account activity API dashboard sample app. What issue are you reporting?

Originally posted by @andypiper in https://github.com/twitterdev/account-activity-dashboard/issues/30#issuecomment-1007809485

NFT marketing

https://discord.gg/9rsdzCh44H

Adding webhook with ngrok works fine but receives CRC error for node api hosted on AWS

I built a full-fledged application using webhook ui using ngrok. Now I deployed my Node JS API to aws on a custom domain and tried adding the same URL for the webhook and it throws Non-200 response code during CRC GET request (i.e. 404, 500, etc).
Any help will be appreciated.
P.S- I did add all the new URLs to the developer portal.

Callback URL only uses http

Not 100% sure this is a issue specific to this project exactly but I am opening a PR to reference to if I submit a change to the README.md file.

/**
 * Starts Twitter sign-in process for adding a user subscription
 **/
app.get('/subscriptions/add', passport.authenticate('twitter', {
  callbackURL: '/callbacks/addsub'
}));

/**
 * Starts Twitter sign-in process for removing a user subscription
 **/
app.get('/subscriptions/remove', passport.authenticate('twitter', {
  callbackURL: '/callbacks/removesub'
}));

I deployed a forked unchanged version of this project pretty easily to heroku.
For argument's sake the url is https://webhook-manager.herokuapp.com

For some reason the callback url submitted in the code above doesn't specify https. So you have to add http://webhook-manager.herokuapp.com/callbacks/addsub (http) to your callback url set for everything to work (same with /removesub)

I'm happy to add this to the README.md unless I am missing something?

Ceo

The fact is I have a problem I don't like to see it on twitter and I'm just

I try and add a webhook using the gui, but get an error response for CRC, need help

I get this error => Non-200 response code during CRC GET request (i.e. 404, 500, etc). I want to know how can i get the crc token and then register my webhook

Error Webhook config unable to be retrieved

Error Webhook config unable to be retrieved

Getting an error as outlined above when i click on Manage Webhooks. i am not sure what that implies. Permission of the config. json file set to 777 error still persists. How can i solve ths issue.
The json respone seen in the cli indicates Error: Code 32 Message: Could not authenticate you. I am sure the Apps Access permission and Keys, secret keys and access tokens are right and properly set in the config.json aswell as the TWITTER_WEBHOOK_ENV and Callback URLs.

Do those different Error messages point to the same Problem?

How do i start solving this facer? Where should i start what should i do next?

Any help appreciated. Many thanks in advance.

PS: i feel like it is unsettling that the "Dev environment label" in the documentation is referred to as "envoirment name". Maybe that should be changed for a clearer naming consistency.

H

Add support for Enterprise AA API

Currently this only works with premium Account Activity API. We should look into adding options to customise it to support Enterprise environments.

Documentation incorrect

Hi, I'm wondering why is documentation totally different than this example? I mean creating webhook in that case - https://developer.twitter.com/en/docs/accounts-and-users/subscribe-account-activity/api-reference/aaa-premium#post-account-activity-all-env-name-webhooks ?

Or am I missing something?

Error in documentation, config.json not used in example_scripts

example_scripts/README.md says "Your app keys and tokens should be defined in a config.json file at the root of this project folder." Isn't that incorrect? I don't see config.json getting used instead app keys and tokens are read from .env.

Can't create webhook

Hi. I've been trying to run this example but I can't create an webhook. I added Account Activity to my app permissions and changed the webhook_env to dev. I'm using ngrok. Let's say I have the following webhook url: https://213a8156.ngrok.io and I added the two following callbacks url on settings: https://213a8156.ngrok.io/callbacks/addsub https://213a8156.ngrok.io/callbacks/removesub. (I don't know the parenthesis in http(s) mean)

When I run: node example_scripts/webhook_management/create-webhook-config.js -e dev -u https://213a8156.ngrok.io all I get back is a Forbidden message with code 200. The web UI says 'Webhook config unable to be retrieved'.

Anyone knows what I'm doing wrong?

Update dependencies

socket.io is at 2.1.1 - should review others for currency.

Live Activity is not showing anything

Any particular reason why the Live Activity tap shows only a message saying Waiting for activity and not showing anything else?

I had to apply path #6 to be able to use it with ngrok, then the web page asked me to authorize authorized the app, and I did so, I not sure why is that even needed if I've already put the account's TWITTER_ACCESS_TOKEN and TWITTER_ACCESS_TOKEN_SECRET in the configuration file.

By the way, the TWITTER_ACCESS_TOKEN and TWITTER_ACCESS_TOKEN_SECRET I'm using are not those for the twitter developer account but those for the Twitter account that I want to see the live activity, is that correct?