title: Ionic view - Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header
body: <p>I have seen this question being asked before but the answers haven't helped me.</p>
  
  <p>I have ionic mobile app that makes use of a Rails 5.2 api that i built myself.
  I'm having trouble geting a PUT request to go thru. 
  I'm hitting this error.</p>
  
  <pre><code>Failed to load https://votingapi.herokuapp.com/api/v1/something: 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:8100' is therefore not allowed access.
  </code></pre>
  
  <p>I have made GET request to the API and no problems with that. 
  Managed to fix the problem in ionic serve --lab by enabling <code>Allow-Control-Allow-Origin: *</code>  plugin to chrome but the problem is still in the Ionic view.</p>
  
  <p>Any thoughts? </p>
  
  <p>Gemfile </p>
  
  <pre><code>gem 'rack-cors', require: 'rack/cors'
  </code></pre>
  
  <p>application.rb</p>
  
  <pre><code>config.middleware.insert_before 0, Rack::Cors do
        allow do
          origins '*'
          resource '*',
                   headers: :any,
                   methods: %w[:get :post :put :delete],
                   expose: %w[access-token expiry token-type uid client],
                   max_age: 0
        end
  </code></pre>
  
  <p>Request on ionic </p>
  
  <pre><code>update(id, result){
      let headers = new Headers();
      let body = JSON.stringify({vote: result})
      headers.append("Accept" , 'application/json');
      headers.append('Content-Type', 'application/json');
      let options = new RequestOptions({ headers: headers });
      return this.http.put(`${this.apiUrl}/${id}`, body, options)
    }
  </code></pre>