There is a fair amount of configuration needed to setup this experience. Please follow the guidance below to get started.
The .env
file contains all the secret bits needed for the service to talk to IFTTT and the Microsoft Graph.
Create a new file in the root of the project named .env
(the '.' prefix is required). Throughout the rest of this setup guide, you will be replacing "your-xxxx-here" items with data from following steps. Keep the document open to edit as you go.
Paste in the following:
# Environment Config
# store your secrets and config variables in here
# only invited collaborators will be able to see your .env values
# reference these in your code with process.env.SECRET
# note: .env is a shell file so there can't be spaces around =
PORT=8080
IFTTT_KEY="your-ifttt-key-here"
TENANT_ID="your-tenant-id-here"
CLIENT_ID="your-client-id-here"
CLIENT_SECRET="your-client-secret-here"
TEST_USER="your-test-email-here"
TEST_PWD="your-test-password-here"
The next step is to create and configure the service on the IFTTT Platform.
- To get started on the IFTTT Platform, navigate to https://platform.ifttt.com
- Create an account, sign in, and click
Add service
- Provide a Service name and ID, then click
Create
- Now that your service has been created, navigate to the
API
tab.
There are two important parts in the General
section:
**IFTTT API URL**
This is the hosted endpoint for your IFTTT service. For this sample we will be hosting locally and exposing the local endpoint via [ngrok](https://ngrok.com/)
We'll come back to this later.
**Service key**
The service key is needed to send requests and participate on the IFTTT platform.
Annotate the Service key in the `.env` file.
This sample requires an Azure Portal App Registration to configure the Graph authentication. Head over to the Azure portal to create a new App registration.
- From the Azure Portal App registration page, click
New registration
. - Input a display name for your service and select the last radio button:
Accounts in any organizational directory and personal Microsoft accounts
- Skip the Redirect URI for now and click
Register
. - You should now see the Overview page for your new app registration.
Take note of the Application (client) ID and Directory (tenant) ID and annotate them in the .env
file.
From your Azure Portal App registration:
-
Navigate to the
Authentication
tab. -
Create the following Redirect URIs:
http://localhost:8080
https://ifttt.com/channels/<IFTTT service ID>/authorize
- (optional)
https://<ngrok forwarding url>.ngrok.io
Note:
<IFTTT service ID>
can be found on the IFTTT Platform -> Service Tab -> General section.Note:
<ngrok forwarding url>
can be found in the ngrok console output in the last step. This last Redirect URI is optional and is only useful for interacting with the test page from the ngrok forwarding address. Otherwise, localhost is sufficient for any local testing purposes. -
Under
Implicit grant
, check both boxes (Access and ID tokens).
From your Azure Portal App registration:
- Navigate to the
Certificates & secrets
tab. - Click
New client secret
to generate a new secret value.
Annotate the new client secret value in the .env
file.
To enable IFTTT Platform to request Microsoft Graph data on behalf of our user, we must expose a scope for this activity.
From your Azure Portal App registration:
- Navigate to the
Expose an API
tab. - Click
Add a scope
, thenSave and continue
. - Fill in the various fields:
- Scope name:
ifttt
- Who can consent?
Admins and users
- Admin consent display name:
IFTTT Platform
- Admin consent description:
Enable interaction with the IFTTT Platform
- User consent display name
IFTTT Platform
- User consent description:
Enable interaction with the IFTTT Platform
- Scope name:
- Click
Add scope
.
IFTTT requires a test user to impersonate during endpoint tests. In the .env
file, provide credentials for a valid user in your tenant. Since we configured our service to support all user types, the test user can be any public MSA.
- Ngrok: https://ngrok.com/
- Node.js: https://nodejs.org/
A free ngrok account will be sufficient, however, beware that ngrok will return a randomized url each time, which must be updated in the IFTTT Platform config (API/General). If this becomes an issue, it may make development easier with a static url which is available with any paid ngrok subscription.
To setup the project, run the following commands:
npm i
npm run-script build
npm start
ngrok http 8080
- Copy ngrok url to IFTTT API URL config here:
https://platform.ifttt.com/services/<ifttt_service_name>/api
With the project setup and running, you can test the service itself by navigating to http://localhost:8080. From the test page you can sign in and manually invoke any of the Actions/Triggers.
To test integration with the IFTTT platform, navigate to each of the IFTTT Platform test pages and click Begin test
: