Trouble sending an ajax request to Riot API

Question

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <title>Sample Page</title>
  <script>
      var summonername = "TraversTT"
      var api_key1= "******"
      var headers1 = {
          'Access-Control-Allow-Origin': '*',
          'Origin': "https://developer.riotgames.com",
          'Accept-Charset': "application/x-www-form-urlencoded; charset=UTF-8",
          'X-Riot-Token': "*****",
          'Accept-Language': "en-US,en;q=0.9",
          'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36',
      }
      var settings = {
       "async": true,
       "type": "POST",
       "url": "https://na1.api.riotgames.com/lol/summoner/v4/summoners/by-name/"+summonername+"?api_key="+api_key1,
       "headers": headers1,
       "dataType": 'json',
       "data": 'dataTest',
     };
  $.ajax(settings).done(function (response) {
       console.log(response);
     });

I am getting constant errors connecting to this API and getting a response other than:

jquery.min.js:4 Refused to set unsafe header "Origin" send @ jquery.min.js:4 ajax @ jquery.min.js:4 (anonymous) @ Riot dDragon access sample2.html:26 jquery.min.js:4 Refused to set unsafe header "Accept-Charset" send @ jquery.min.js:4 ajax @ jquery.min.js:4 (anonymous) @ Riot dDragon access sample2.html:26 jquery.min.js:4 Refused to set unsafe header "User-Agent" send @ jquery.min.js:4 ajax @ jquery.min.js:4 (anonymous) @ Riot dDragon access sample2.html:26 2jquery.min.js:4 OPTIONS https://na1.api.riotgames.com/lol/summoner/v4/summoners/by- name/TraversTT?api_key=RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b 405 (Method Not Allowed) send @ jquery.min.js:4 ajax @ jquery.min.js:4 (anonymous) @ Riot dDragon access sample2.html:26 Riot dDragon access sample2.html:1 Access to XMLHttpRequest at 'https://na1.api.riotgames.com/lol/summoner/v4/summoners/by-name/TraversTT? api_key=RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.`

I've been playing with different ways of doing this today for like 6 hours so any help available would be amazing.

could you link to the documentation for the api. the one i found, it seems like there is no post endpoint: https://developer.riotgames.com/apis#summoner-v4. It also looks like you're wrongly setting some headers. — C.OG, Nov 29 '19 at 01:03
@c_ogoo Im unsure what other documentation you are looking for so far what you posted is all I have been using for myself: If I run that using my ID I get: https://justpaste.it/2v8x2 — TraversTT, Nov 29 '19 at 01:15

score 0 · Answer 1 · answered Nov 29 '19 at 02:06

According to the api docs, your code should be something like this:

<script>
  var summonername = "TraversTT";
  var api_key1= "RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b";
  var headers1 = {
    'X-Riot-Token': "RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b",
  }
  var settings = {
    "async": true,
    "type": "GET",
    "url": "https://na1.api.riotgames.com/lol/summoner/v4/summoners/by-name/"+summonername+"?api_key="+api_key1,
    "headers": headers1,
  };
  $.ajax(settings).done(function (response) {
    console.log(response);
  });
</script>

There are different types of HTTP requests; GET, POST, PUT, etc... You were using POST but that endpoint only supports GET and you were setting some headers that are typically response headers.

Unfortunately there is a CORS issue on this endpoint, so your browser will not be able to access it via your browser.

You can try this cUrl in your terminal to see the response (copy and paste this into your terminal):

curl 'https://na1.api.riotgames.com/lol/summoner/v4/summoners/by-name/TraversTT?api_key=RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b' -X OPTIONS -H 'Access-Control-Request-Method: GET' -H 'Origin: https://js-9vpefs.stackblitz.io' -H 'Referer: https://js-9vpefs.stackblitz.io/' -H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36' -H 'DNT: 1' -H 'Access-Control-Request-Headers: x-riot-token' --compressed

Note

I will suggest never to post your API key ('X-Riot-Token': "RGAPI-1ed86c58-2eee-4e6c-85d4-3bead97e4d3b") on a public forum.

Ah thank you so much, so basically I cant run this in a browser is what your saying? Also about the code: thank you, i was watching it for mis-use and have already changed it! — TraversTT, Nov 29 '19 at 02:18
yes, though you may be able to after you do this: https://developer.riotgames.com/docs/portal — C.OG, Nov 29 '19 at 02:19

Trouble sending an ajax request to Riot API

1 Answers1