Hi.
I have finished my Random Quote Machine and I’m quite happy with it.
I copied all the files and stored them locally on my computer (I added all links to bootstrap, jquery, fonts… )
When I run it it’s OK until I click the button to reload a new quote. Then appears alert window with the message: "Ajax error!"
In the console there’s a familiar error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1&callback=&_=1501417181969. (Reason: CORS header 'Access-Control-Allow-Origin' does not match 'http://null').
When first time I got it (on Codepen) I just added s to http in the address and it solved the problem. I don’t know what to do now?
Any ideas?
And if yoou want to look at the code: my Codepen pen
Are you running it on a local server, not just from a static file on your computer? If it’s the latter, cors request will generally fail, needs to be http:// not file://
Thanks @DanCouper!
I run it form file:// , so if that’s the reason I’m happy. I don’t have an idea how to check it outside of Codepen (just in case).
Thanks a lot!
The flat-out simplest way to serve the page (rather than opening a file) is, using the command line, to run a server in the folder with your files.
Lots of languages come with servers in their standard library. Python is common: if you have a Mac, or a Hewlett-Packard Windows machine, or you’re running Linux, you should already have Python. Needs to be downloaded and installed otherwise (download for your system here).
Once you have Python installed, open a terminal program on your computer. If you haven’t used the command line before, you’re looking for a program called Terminal if you’re on a Mac, on Windows a program called Command Prompt (If you have used the comand line, you’re probably not using either of those programs and you know what you’re doing already). Anyway:
First, check Python is installed - type this command:
python --version
And hit enter. It should return a single line with the current version of Python installed - mine says Python 2.7.10.
Then, using the command line, navigate to the directory with your files. To do this, you use cd (change directory) followed by the path to the folder (note you can check where you currently are by typing pwd on Mac/Linux, or echo %cd% on Windows).
cd path/to/my/project
When you hit enter there, you’re in the project directory. Type
python -m SimpleHTTPServer
It should hang for a second or two, then give you the message Serving HTTP on 0.0.0.0 port 8000 ....
Open http://127.0.0.1:8000 in the browser. If there is an index.html, that will be the default file served, otherwise you should get a directory listing of all the available files being served.
Note this works in a number of other languages/environments: see https://gist.github.com/willurd/5720255
You’re my HERO! Thank you very much for such detailed info, brilliant job.
To be honest my Python skills are A LOT! better then HTML, CSS and JS altogether 
But you just proved that as a Pythonista I’m not so good 
I’ve been using Python everyday for nearly a year now 
and I didn’t know about the trick. I did use Flask so I could run it with a simple python script, but I hoped there’s an even easier way. And IT IS!
Thanks for your help and for the link! Be well! 