title: Angular2 Headers
body: <p>When I call server without headers its working and server returns json:</p>
  
  <pre><code>this.http.get(url)
  </code></pre>
  
  <p>but when I add header:</p>
  
  <pre><code>var headers = new Headers({'x-id': '1'});
  this.http.get(url, {'headers': headers})
  </code></pre>
  
  <p>browser returns error:</p>
  
  <pre><code>XMLHttpRequest cannot load http://domain/api/v1/. 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:3000' is therefore not allowed access.
  </code></pre>
  
  <p>I also tried add <code>Origin</code> header - browser error: <code>Refused to set unsafe header "Origin"</code></p>
  
  <p>And <code>Access-Control-Allow-Origin</code> header - no effect</p>
  
  <hr>
  
  <p>On server (Laravel) I created middleware <code>Cors.php</code>:</p>
  
  <pre><code>&lt;?php
  
  namespace App\Http\Middleware;
  
  use Closure;
  
  class Cors {
      public function handle($request, Closure $next)
      {
          return $next($request)
              -&gt;header('Access-Control-Allow-Origin', 'http://localhost:3000')
              -&gt;header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
              -&gt;header('Access-Control-Allow-Headers', 'x-id');
      }
  }
  </code></pre>
  
  <hr>
  
  <p>Im new to angular2 and CORS requests, dont know what to do.</p>
  
  <ul>
  <li>Angular: 2.0.0-beta.0 </li>
  <li>Laravel: 5.0 </li>
  <li>Browser: Google Chrome</li>
  </ul>