Riot API How to get summoner profile icon image

Question

I found out i can get Summoner Icon image using this url:

https://ddragon.leagueoflegends.com/cdn/11.14.1/img/profileicon/934.png

The basic form of this is:

https://ddragon.leagueoflegends.com/cdn/{version}/img/profileicon/{profileIconId}.png

i know i can get the second value of {profileIconId} through Riot API but how do i know when i should update the version value? I don't want my app to crash when the version should be changed.

score 3 · Answer 1 · answered Jul 15 '21 at 17:09

You should not be referencing ddragon for displaying icons or images. In fact, DataDragon specifically requests that you download the archive (.tgz) for each patch/version and host the assets locally or on your own CDN.

Websites like op.gg do this for all of the assets and host the images on their own CDN. They have to update their CDN every patch. You can automate updating the CDN using scripts, but for most small projects the work to automate this process may not be worth it.

Generally, it is considered rude to piggyback off of someone else's CDN without explicit permission to do so. Riot goes a step further and explicitly asks that you do not do this.

Do you have any source? I can't find anything about Riot not allowing people to use the Data Dragon CDN for images etc. — Mikael Dúi Bolinder, Mar 18 '22 at 23:42

score 2 · Accepted Answer · edited Jan 30 '22 at 14:42

2

If someone is using the data dragon (ddragon) cdn, you can know the latest version looking at this json that they provide:

https://ddragon.leagueoflegends.com/api/versions.json

Just take the first element of the array and you are good to go without any scripting.

edited Jan 30 '22 at 14:42

ouflak

2,458
10
44
49

answered Jan 30 '22 at 07:35

ignacio

46
5

Jan_Heye · Answer 3 · 2023-05-07T16:26:13.150

I have written a script you can use to download all images from the riot cdn. It saves all images locally with a delay of 500ms per image. It also skips those where the current number is not an image. Just add the script to a html page and open it in the browser :)

const url = "https://ddragon.leagueoflegends.com/cdn/13.9.1/img/profileicon/";
const ext = ".png";

for (let i = 0; i < 6000; i++) {
    setTimeout(function() {
        const img = new Image();
        img.crossOrigin = 'Anonymous';
        img.src = url + i + ext;

        img.onload = function() {
            const canvas = document.createElement('canvas');
            canvas.width = this.naturalWidth;
            canvas.height = this.naturalHeight;

            const ctx = canvas.getContext('2d');
            ctx.drawImage(this, 0, 0);

            canvas.toBlob(function(blob) {
                saveAs(blob, 'image' + i + ext);
            })
        }

        img.onerror = function() {
            console.log('Image not found: ' + this.src);
        };
    }, i * 500);
}

You could also add some more logic to get the most current api version. You get it from this url: https://ddragon.leagueoflegends.com/api/versions.json

And receive a json width a "data" array that on [0] has the newest api version.

Hi, thanks for sharing your code. Unfortunately, your code is a bit ineffective as it throws a lot of 404s as the ids could 1. expand 6000 and 2. have empty ids in between. Using http://ddragon.leagueoflegends.com/cdn/{version}/data/en_US/profileicon.json would reduce these missing images issues by a lot — DarkIntaqt, May 12 '23 at 22:02

Riot API How to get summoner profile icon image

3 Answers3