Created
September 28, 2018 06:23
-
-
Save Wolfr/19d719ff0cbb044063ce3ac60bc26395 to your computer and use it in GitHub Desktop.
About the shortest code I could write to render an image out from the Figma API and make it clear whether it is loading/has loaded.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// About the shortest code I could write to render an image out from the Figma API and make it clear whether it is loading/has loaded. | |
// https://github.com/wolfr | |
// If you use this code please change to your own access token | |
const PERSONAL_ACCESS_TOKEN = ''; // Your personal access token here | |
function apiRequest(endpoint) { | |
return fetch('https://api.figma.com/v1' + endpoint, { | |
method: 'GET', | |
headers: { "x-figma-token": PERSONAL_ACCESS_TOKEN } | |
}).then(function(response) { | |
return response.json(); | |
}).catch(function (error) { | |
return { err: error }; | |
}); | |
} | |
const fileKey = ''; // Your file key here | |
const nodeId = '7%3A42' // Your node id here, example provided because the semicolon is encoded | |
apiRequest('/images/' + fileKey + '?ids=' + nodeId + '&scale=2&quality=jpg') | |
.then(function (apiResponse) { | |
var imgUrl = Object.entries(apiResponse.images)[0][1]; | |
// Create image and set its URL | |
var img = document.createElement('img'); | |
img.setAttribute("src", imgUrl); | |
document.body.appendChild(img); | |
// Display a success message | |
var p = document.createElement('p'); | |
p.innerHTML = 'Image loading OK'; | |
document.body.appendChild(p); | |
document.querySelector('p:first-child').remove(); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment