title: React - ajax GET request with headers still returns 401 (Unauthorized)
body: <p>I'm trying to obtain data from my schools API with Ajax GET request with an API key, but I still get the 401 error message. I have included the API key in the header but it seems to not work.</p>
  
  <p>Here's my code so far;</p>
  
  <pre><code>class App extends Component {
    constructor(){
      super();
      this.state = {
        todos:[]
      }
    }
  
    getTodos(){
      $.ajax({
        type: "GET",
        url: 'https://opendata.seamk.fi/r1/reservation/building/2',
        dataType:'json',
        headers: {
          Authorization: "API_KEY"
        },
        cache: false,
        success: function(data){
          this.setState({todos: data}, function(){
            console.log(this.state);
          });
        }.bind(this),
        error: function(xhr, status, err){
          console.log(err);
        }
      });
    }
  
    componentWillMount(){
      this.getTodos();
    }
    componentDidMount(){
      this.getTodos();
    }
  
  
    render() {
      return (
          &lt;Titles /&gt;
          &lt;Todos todos={this.state.todos}/&gt;
  
      );
    }
  }
  
  export default App;
  </code></pre>
  
  <p>Console message;</p>
  
  <p><a href="https://i.stack.imgur.com/3bi8v.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3bi8v.png" alt="enter image description here"></a></p>