Axios - No 'Access-Control-Allow-Origin' header is present
<p>I'm missing something here. I was struggling to get the API call to work.
Then I split the url up like below and it works -literally once. After that it fails to work again. I swear I did not change something.</p>

<p>How do you go about it in AXIOS?</p>

<p>Error message is:</p>

<blockquote>
  <p>XMLHttpRequest cannot load
  <a href="http://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228" rel="nofollow noreferrer">http://magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/?spot_id=228</a>.
  No 'Access-Control-Allow-Origin' header is present on the requested
  resource. Origin '<a href="http://localhost:8080" rel="nofollow noreferrer">http://localhost:8080</a>' is therefore not allowed
  access.</p>
</blockquote>

<pre><code>import axios from 'axios';

const ROOT_URL = `magicseaweed.com/api/W2Z26fXscpELi7nPB0svfqcGj9FtGO9e/forecast/`;

export const FETCH_WEATHER = 'FETCH_WEATHER';

export function fetchWeather() {
    const url = `http://${ROOT_URL}?spot_id=228`;
    const request = axios.get(url);

    return {
        type: FETCH_WEATHER,
        payload: request
    };
}
</code></pre>

<p><em>I tried with this modified GET aswell, but to no avail</em></p>

<pre><code>axios({
  url: url ,
  headers: {"Access-Control-Allow-Origin": "*"},
});
</code></pre>