Objective: get a list of all the images in a Workspace. You will need the Workspace ID. This list will contain, for each image, details such as: image name, creation date, traits, comments, etc.
This page contains the implementation details for v3 REST APIs and for v3 GraphQL APIs. You can also see the example for v2 REST APIs.
Implementation using REST APIs
| Endpoint | /v3/workspaces/<workspaceId>/elements?type=Image |
|---|---|
| Method | GET |
| Comments | You need to know the workspace ID. |
Code sample
See below code samples in cURL, Node.js, and Python.
cURL
curl --location --request GET 'https://api.apps.us.bluescape.com/v3/workspaces/<workspaceId>/elements?type=Image' \ --header 'Authorization: Bearer <SET_TOKEN>'
Node.js
// Node.js Javascript
/*
How to run:
node this_script_name.js
Requires "axios" module (0.19.0), run:
npm install axios
website: https://github.com/axios/axios
*/
var axios = require('axios');
const token = '<SET_TOKEN>';
const portal = 'https://api.apps.us.bluescape.com';
const workspaceId = '<SET_WORKSPACE_ID>';
const api_version = 'v3';
const api_endpoint = '/workspaces/' + workspaceId + '/elements?type=Image';
var request_values = {
url: portal + '/' + api_version + api_endpoint,
method : 'GET' ,
headers : {
'Authorization': "Bearer " + token,
'Content-Type' : 'application/json'
}
};
axios(request_values)
.then(function (response) {
if (response.status == 200)
{
console.log("Success");
console.log(response.data);
}
})
.catch (function (error) {
console.log('Error: ' + error.message);
});
Python
# Python Code (python 3.5+)
import requests
import pprint
'''
Required modules:
requests 2.22.0
'''
token = '<SET_TOKEN>'
if __name__ == "__main__":
portal = "https://api.apps.us.bluescape.com"
workspaceId = '<SET_WORKSPACE_ID>'
API_version = 'v3'
# Get all the images from a workspace
API_endpoint = '/' + API_version + '/workspaces/' + workspaceId + '/elements?type=Image'
the_request = requests.get(
portal + API_endpoint,
headers={"Authorization": "Bearer " + token,
"Content-Type": "application/json"
}
)
json_response = the_request.json()
pprint.pprint(json_response)
You can modify this script to return a list of each specific object from the workspace by changing the last element in the API entrypoint: API_endpoint = '/v3/workspaces/' + workspaceId + '/elements?type=Image'. Here, replace the final 'Image' element with:
- “Document”
- “Note”
- “Image”
- “Text”
- “Canvas”
- “Browser”
- “Stroke”
- “Video”
- “Grid”
- “Shape”
- “Line”
OUTPUT
What you should get: JSON with the list of all images in the workspace
| Element | Json | Comments |
|---|---|---|
| Image ID | [‘data’][N][‘id’] | where N is the N-th image in the list. |
| Image Title | [‘data’][N][‘title’] | where N is the N-th image in the list. |
| Image URL | [‘data’][N][‘url’] | where N is the N-th image in the list. |
Output Json sample
{
"data": [
{
"id": "6024576d277cc809d1391072",
"zIndex": 6,
"transform": {
"x": -22552.69375,
"y": 16430.16964285714,
"scaleX": 1,
"scaleY": 1
},
"traits": null,
"pinned": false,
"attachments": [],
"width": 609,
"height": 606,
"title": "doge.png",
"filename": "doge.png",
"type": "Image",
"asset": {
"url": "https://s3bucket.s3.s3region.amazonaws.com/jb37zadzAvin16ti2A-9/6024576d277cc809d1391072.png?X-Amz-Algorithm=AWS4-ABCD-ABC123&X-Amz-Credential=AKIA26JKTHARMSCAX2M2%2F20210223%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20211243T213700Z&X-Amz-Expires=900&X-Amz-Signature=c523152d2d6f2zbd028d7e371259ee6489d45db0777e6d3403e0f4a413e1035f&X-Amz-SignedHeaders=host",
"imageFormat": "png"
}
}
]
}
Note that the url field under asset is the URL you can use to download that particular image or asset. This is a signed URL, with an expiration time.
Implementation using v3 GraphQL APIs
| Query | elements |
|---|---|
| Comments | You need to know the workspaceId |
Example Query:
query getImagesFromWorkspace($workspaceId: String!){
elements(workspaceId: $workspaceId, type: Image) {
__typename
id
}
}
with these variables:
{
"workspaceId": "<workspaceID>"
}
Code sample
See below for full code examples of this implementation in cURL, Node.js, and Python.
cURL
curl --location --request POST 'https://api.apps.us.bluescape.com/v3/graphql' \
--header 'Authorization: Bearer <SET_TOKEN>' \
--header 'Content-Type: application/json' \
--data-raw '{"query":"query getImagesFromWorkspace($workspaceId: String!){\n elements(workspaceId: $workspaceId, type: Image) {__typename id }\n}\n","variables":{"workspaceId":"<workspaceId>"}}'
Node.js
const axios = require('axios');
const url = "https://api.apps.us.bluescape.com/v3/graphql"
const token = "<SET_TOKEN>"
const query =
`query getImagesFromWorkspace($workspaceId: String!){
elements(workspaceId: $workspaceId, type: Image) {
__typename
id
}
} `
const variables = {
workspaceId: "<SET_WORKSPACEID>"
}
const getImagesInWorkspaces = async () => {
try {
const response = await axios.post(url,
{
query: query,
variables: variables
},
{headers: {"Authorization": "Bearer " + token}})
answerData = JSON.stringify(response.data);
console.log(answerData);
return response
}
catch(error) {
console.error(error)
}
}
getImagesInWorkspaces();
[details=“Python”]
import requests
import pprint
'''
Required modules:
requests 2.22.0
'''
url = "https://api.apps.us.bluescape.com/v3/graphql"
token = "<SET_TOKEN>"
query = """
query getImagesFromWorkspace($workspaceId: String!){
elements(workspaceId: $workspaceId, type: Image) {
__typename
id
}
}
"""
variables = {
"workspaceId": "<SET_WORKSPACEID>"
}
def makeQuery():
response = requests.post(url,
headers={"Authorization": "Bearer " + token
},
json={
'query': query,
'variables': variables
})
return response.json()
if __name__ == "__main__":
response = makeQuery()
pprint.pprint(response)
[/details]
Where to Next?
- Get all the images from a workspace for v2
- Bluescape API Guides
- Bluescape API Overview
- Latest Developer topics
Not what you were looking for? Reply below or Search the community and discover more Bluescape.