Demo to preview the settings
Introduction
Sign up and log in users with their Strava credentials and retrieve athletes' route & activity data.
Prerequisites
- You must have the Strava account.
How to set up
Register your App
Follow this link to create an API application with your Strava account.
When asked for the app's Authorization Callback Domain, this is the root domain of your application without slashes or https. For example:
- For apps not yet on a custom domain, this will be app-id.bubbleapps.io
- For apps on a custom domain, this will be the domain itself like "myapp.com"
Gather your Client ID and Secret
Looking at the screenshot below, copy your Client ID and reveal the Client Secret. These two values will be placed into your plugin settings.
Client ID from Strave goes into the App ID/API Key input
Client Secret from Strava goes into the App Secret input
That's it! You're now ready to use the plugin.
Authenticate User
Signup/login with Strava
In order for the plugin to retrieve data from the user's Strava account, they'll need to authenticate that access. The user should trigger a workflow that runs the action: signup/login with a social network:
That workflow will temporarily redirect the user to a Strava login screen. Once the user has logged into their Strava account, they'll see a permission screen like this with your app information configured in the developer account:
Once they authorize, Strava will redirect the user back to your app and you'll be able to trigger the rest of the data calls to access their information.
Get Current User's Stats
Strava documentation: https://developers.strava.com/docs/reference/#api-Athletes-getStats
Set up the datasource
We're using a group in our example. Make sure whatever element you use has the correct type of content set (Get Totals & Stat (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display Data action to send the results of this API call to the group we've set up.
Available Path (* indicates a required value)
athelete_id* - The ID of the athlete you're looking up.
Get Current Athlete
Strava documentation: https://developers.strava.com/docs/reference/#api-Athletes
Set up the datasource
We're using a group in our example. Make sure whatever element you use has the correct type of content set (Get Current Athlete (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display Data action to send the results of this API call to the group we've set up.
That's it! Refer to the documentation link above for a detailed list of additional attributes you can display.
List Routes
Strava documentation: https://developers.strava.com/docs/reference/#api-Routes-getRoutesByAthleteId
Set up the datasource
We're using a repeating group in our example. Make sure whatever element you use has the correct type of content set (List Route (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display List action to send the results of this API call to the repeating group we've set up.
Since this call requires the ID of the Athlete to return routes for, we'll supply this from an input on the page, but you can also use Strava ID from the "Get Current Athlete" call. You'll also be presented with the option to add page and per_page parameters to your call as well.
That's it! Refer to the documentation link above for a detailed list of additional attributes you can display.
Available Path (* indicates a required value)
athlete_id* - The ID of the athlete you're looking up.
Available Parameters (* indicates a required value)
page - The number of pages to return from the API call.
per_page - The number of results to return from each page from the API call.
Retrieve Route
Strava documentation: https://developers.strava.com/docs/reference/#api-Routes-getRouteById
Set up the datasource
We're using a group in our example. Make sure whatever element you use has the correct type of content set (Retrieve Route (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display Data action to send the results of this API call to the group we've set up.
Since this call requires the ID of the Route we'll supply this from an input on the page, but you can also reference the "List Routes" call to find IDs.
That's it! Refer to the documentation link above for a detailed list of additional attributes you can display.
Available Path (* indicates a required value)
route_id* - The ID of the route you're looking up.
Retrieve Activity
Strava documentation: https://developers.strava.com/docs/reference/#api-Activities-getActivityById
Set up the datasource
We're using a group in our example. Make sure whatever element you use has the correct type of content set (Retrieve Activity (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display Data action to send the results of this API call to the group we've set up.
Since this call requires the ID of the Route we'll supply this from an input on the page, but you can also reference the "List Activities" call to find IDs.
That's it! Refer to the documentation link above for a detailed list of additional attributes you can display.
Available Path (* indicates a required value)
activity_id* - The ID of the activity you're looking up.
List of Activities
Set up the datasource
We're using a repeating group in our example. Make sure whatever element you use has the correct type of content set (List of Activities (Strava)):
Set up the API call
Using the blue button from the screenshot above, we'll use a Display List action to send the results of this API call to the repeating group we've set up.
You'll also be presented with several parameters to fill in:
- before: this filters for activities that happened before a date/time. The format is UNIX, which is a number of milliseconds. Strava needs the UNIX in seconds though, so extract the UNIX value from a date/time and divide by 1000.
- after: this filters for activities that happened after a date/time. The format is UNIX, which is a number of milliseconds. Strava needs the UNIX in seconds though, so extract the UNIX value from a date/time and divide by 1000.
- page: this is a number and, by default, Strava returns 30 activities per page. Use this to change pages and move to the next set of activities. It's recommended to start with page 1.
- per_page: this is a number to change how many items are returned per page. The default is 30.
Note: It's best if you always have values for these parameters to avoid errors.
That's it! Unlike the List Routes call, this one does not require the ID of an Athlete and will return the activities of the currently authenticated User.
Refer to the documentation link above for a detailed list of additional attributes you can display.
Available Parameters (* indicates a required value)
page - The number of pages to return from the API call. Defaults to 1.
per_page - The number of results to return from each page from the API call. Defaults to 30.
before - Only show activities before this UNIX-formatted date converted to seconds.
after - Only show activities after this UNIX-formatted date converted to seconds.
