You can authenticate with GitHub to create your own instance of the GitHub element through the UI or through APIs. Once authenticated, you can use the element instance to access the different functionality offered by the GitHub platform.
Authenticate Through the UI
Use the UI to authenticate with GitHub and create an element instance. Because you authenticate with GitHub via OAuth 2.0, all you need to do is add a name for the instance and provide your organization, repository, API key, and API secret. After you create the instance, you'll log in to GitHub to authorize Cloud Elements access to your account. For more information about authenticating an element instance, see Authenticate an Element Instance (UI).
After successfully authenticating, we give you several options for next steps. Make requests using the API docs associated with the instance, map the instance to a virtual data resource, or use it in a formula template.
Authenticate Through API
Authenticating through API is similar to authenticating via the UI. Instead of clicking and typing through a series of buttons, text boxes, and menus, you will instead send a request to our /instances
endpoint. The end result is the same, though: an authenticated element instance with a token and id.
Authenticating through API follows a multi-step OAuth 2.0 process that involves:
- Getting a redirect URL. This URL sends users to the vendor to log in to their account.
- Authenticating users and receiving the authorization grant code. After the user logs in, the vendor makes a call back to the specified url with an authorization grant code.
- Authenticating the element instance. Using the authorization code from the vendor, authenticate with the vendor to create an element instance at Cloud Elements.
Getting a Redirect URL
Use the following API call to request a redirect URL where the user can authenticate with the service provider. Replace {keyOrId}
with the element key, github
.
curl -X GET /elements/{keyOrId}/oauth/url?apiKey=<GitHub Client ID>&apiSecret=<GitHub Client Secret> &callbackUrl=<GitHub Authorization callback URL>
Query Parameters
Query Parameter | Description |
---|---|
apiKey | The API key or client ID obtained from registering your app with the provider. This is the Client ID that you recorded in API Provider Setup. |
apiSecret | The client secret obtained from registering your app with the API provider. This is the Client Secret that you recorded in API Provider Setup. |
callbackUrl | The URL that the API provider returns a user to after they authorize access. This is the Authorization callback URL that you recorded in API Provider Setup. |
Example Request
curl -X GET \
'https://api.cloud-elements.com/elements/api-v2/elements/github/oauth/url?apiKey=Rand0MAP1-key&apiSecret=fak3AP1-s3Cr3t&callbackUrl=https:%3A%2F%2Fwww.mycoolapp.com%2auth' \
Example Response
Use the oauthUrl
in the response to allow users to authenticate with the vendor.
{
"oauthUrl": "https://github.com/login/oauth/authorize?scope=admin%3Aorg_hook+admin%3Arepo_hook+public_repo&response_type=code&redirect_uri=https%3A%2F%2Fhttpbin.org%2Fget&state=github&client_id=Rand0MAP1-key",
"element": "github"
}
Authenticating Users and Receiving the Authorization Grant Code
Provide the oauthUrl
in the response from the previous step to the users. After users authenticate, GitHub provides the following information in the response:
- code
- state
Response Parameter | Description |
---|---|
code | The authorization grant code returned from the API provider in an OAuth 2.0 authentication workflow. Cloud Elements uses the code to retrieve the OAuth access and refresh tokens from the endpoint. |
state | A customizable identifier, typically the element key (github ) . |
error
instead of the code
parameter. In this case, your application can handle the error gracefully.Authenticating the Element Instance
Use the code
from the previous step and the /instances
endpoint to authenticate with GitHub and create an element instance. If you are configuring events, see the Events section.
To authenticate an element instance:
Construct a JSON body as shown below (see Parameters):
{ "element": { "key": "github" }, "providerData": { "code": "<AUTHORIZATION_GRANT_CODE>" }, "configuration": { "oauth.api.key": "<GitHub app Client ID>", "oauth.api.secret": "<GitHub app Client Secret>", "oauth.callback.url": "<GitHub app Authorization callback URL >", "github.organization": "<github.organization>", "github.repository": "<github.repository>" }, "tags": [ "<Add_Your_Tag>" ], "name": "<INSTANCE_NAME>" }
Call the following, including the JSON body you constructed in the previous step:
POST /instances
Note: Make sure that you include the User and Organization keys in the header. See the Overview for details.Locate the
token
andid
in the response and save them for all future requests using the element instance.
Example Request
curl -X POST \
https://api.cloud-elements.com/elements/api-v2/instances \
-H 'authorization: User <USER_SECRET>, Organization <ORGANIZATION_SECRET>' \
-H 'content-type: application/json' \
-d '{
"element": {
"key": "github"
},
"providerData": {
"code": "xxxxxxxxxxxxxxxxxxxxxxx"
},
"configuration": {
"oauth.api.key": "Rand0MAP1-key",
"oauth.api.secret": "fak3AP1-s3Cr3t",
"oauth.callback.url": "https://mycoolapp.com",
"github.organization": "myOrg",
"github.repository": "myRepo"
},
"tags": [
"Docs"
],
"name": "API Instance"
}'
Authentication Parameters
API parameters in the UI are bold, while parameters available in the instances API are in code formatting
.
Parameter | Description | Data Type |
---|---|---|
key | The element key. github | string |
code | The authorization grant code returned from the API provider in an OAuth 2.0 authentication workflow. Cloud Elements uses the code to retrieve the OAuth access and refresh tokens from the endpoint. | string |
Namename | The name of the element instance created during authentication. | string |
oauth.api.key | The API key or client ID obtained from registering your app with the provider. This is the Client ID that you noted in API Provider Setup. | string |
oauth.api.secret | The client secret obtained from registering your app with the API provider. This is the Client Secret that you noted in API Provider Setup. | string |
oauth.callback.url | The URL that the API provider returns a user to after they authorize access. This is the Authorization callback URL that you noted in API Provider Setup. | string |
GitHub Organizationgithub.organization | The organization associated with the repository you're connecting to. | string |
GitHub Repositorygithub.repository | The name of the repository you're connecting to. | string |
Tagstags | Optional. User-defined tags to further identify the instance. | string |
Example Response for an Authenticated Element Instance
In this example, the instance ID is 12345
and the instance token starts with "ABC/D...". The actual values returned to you will be unique: make sure you save them for future requests to this new instance.
{
"id":12345,
"name":"API Instance",
"createdDate":"2018-05-25T21:14:59Z",
"token":"ABC/D...xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
"element":{
"id":6291,
"name":"GitHub",
"hookName":"GitHub",
"key":"github",
"description":"Build software better, together. Powerful collaboration, code review, and code management for open source and private projects.",
"image":"https://assets-cdn.github.com/images/modules/logos_page/GitHub-Mark.png",
"logo":"github",
"active":true,
"deleted":false,
"typeOauth":false,
"trialAccount":false,
"resources":[ ],
"transformationsEnabled":true,
"bulkDownloadEnabled":false,
"bulkUploadEnabled":false,
"cloneable":true,
"extendable":true,
"beta":false,
"authentication":{
"type":"oauth2"
},
"extended":false,
"useModelsForMetadata":true,
"hub":"general",
"protocolType":"http",
"parameters":[ ],
"private":false
},
"elementId":6291,
"tags":[
"Docs"
],
"provisionInteractions":[ ],
"valid":true,
"disabled":false,
"maxCacheSize":0,
"cacheTimeToLive":0,
"providerData":{
"code":"7ee8dc2384aae9116190"
},
"configuration":{ },
"eventsEnabled":false,
"traceLoggingEnabled":false,
"cachingEnabled":false,
"externalAuthentication":"none",
"user":{
"id":123456,
"emailAddress":"claude.elements@cloud-elements.com",
"firstName":"Claude",
"lastName":"Elements"
}
}```