I hope you may help a laravel and vue.js newby. I am writing a little application where I need to call the weather api by darksky.net.
Via php it works well. Now I want it more dynamically with vue.js. But if I make an api call via axios, I get the following message:
Failed to load > https://api.darksky.net/forecast/myDarkSkyKey/37.8267,-122.4233: Response > to preflight request doesn’t pass access control check: No ‘Access-Control-> Allow-Origin’ header is present on the requested resource. Origin > ‘http://localhost:5757‘ is therefore not allowed access.
I red a lot stuff about cors and tried to include the headers with middleware as explained here, and I even tried the “laravel-cors” package by berryvhd, but I am running against that “No ‘Access-Control-> Allow-Origin’ header is present” wall again and again.
Do you have any advises or a clue what I am doing wrong? I tried that much, even including these
header(‘Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS’);
directly into public/index.php
I know its not the fine way, but I wanted to figure out whats working. But nothing helps.
I am working with the latest laravel master and vue.js 2, MAMP and CodeKit.
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Thanks for your thoughts!
I found a solution working for me: proxy servers i.e. https://cors-anywhere.herokuapp.com/
so I can do my request to darksky as follows:
That will work for me. Only one bad taste -> what if the herokuapp server is down!?