title: ReactJS localhost Ajax call: No 'Access-Control-Allow-Origin' header
body: <p>Working on the ReactJS tutorial I spinned up a local server with </p>
  
  <pre><code>&gt;npm install -g http-server
  
  &gt;http-server -c-1
  </code></pre>
  
  <p>And got local server working fine located at <a href="http://localhost:8080" rel="nofollow">http://localhost:8080</a> </p>
  
  <p>Though, when I attempted to use an AJAX call within one of my components, I got the following error in my chrome console:</p>
  
  <pre><code>  XMLHttpRequest cannot load http://localhost:8080/comment.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 405.
  </code></pre>
  
  <p>This is the ajax call snippet:</p>
  
  <pre><code>var CommentBox = React.createClass({
                      loadCommentsFromServer: function(){
                          $.ajax({
                              url: this.props.url,
                              dataType: 'json',
                              cashe: false,
                              crossDomain:true,
                              headers: {'Access-Control-Allow-Origin': '*'},
                              success: function(data){
                                  this.setState({data: data});
                              }.bind(this),
                              error: function(xhr, status, err){
                                  console.error(this.props.url, status, err.toString());
                              }.bind(this)
                          });
                      },
  </code></pre>
  
  <p>this.props.url is coming from here:</p>
  
  <pre><code>React.render(&lt;CommentBox url="http://localhost:8080/comment.json" pollInterval={2000} /&gt;, document.getElementById('content'));
  </code></pre>