Riot API With React Im not geting any json back

Question

Can anyone help me what am I doing wrong I can't get objects from this (API key is not in the code). Some Suggestions for how to learn API would be nice. I want to at least console.log() the JSON and go from there.

import React, { Component } from 'react';
import './App.css';


class App extends Component {
  constructor(props){
    super(props);
    this.state ={
      error: null,
      isLoaded: false,
      items: []
    };
  }

  componentDidMount() {
    fetch("https://eun1.api.riotgames.com/lol/summoner/v3/summoners/by-name/EvilDex?api_key=", {mode: "no-cors"})
      .then(res => res.json())
      .then(
        (result) => {
          this.setState({
            isLoaded: true,
            items: result.items
          })
        },
        (error) =>{
          this.setState({
            isLoaded: true,
            error
          })
        }
      )
    
  }

@Pavlin, if you add `.then(res => { console.log('is ok: ' + res.ok); return res; })` between `fetch()` and `.then(res => res.json())` , what do you see logged in the console? — Dacre Denny, Sep 27 '18 at 20:49

score 0 · Answer 1 · answered Sep 27 '18 at 21:05

You can't make calls to the API using client-side Javascript. The API doesn't allow it and it also exposes your API key to anyone who inspects your code from the browser.

The process should go like this: React Client requests server for data -> server makes request to Riot API for data -> Riot API responds with data -> Server processes the data (format/sort/filter or whatever you want to do with it) -> Responds to React client with data -> React renders the data in JSX.

Riot API With React Im not geting any json back

1 Answers1