title: CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource
body: <p>I keep getting the following error for my AngularJS application hosted on Heroku:</p>
  
  <blockquote>
    <p>Access to Image at
    '<a href="https://d15790c7fypqrz.cloudfront.net/attachments/product_template_pictures/images/000/490/265/grid/832816_122.png" rel="nofollow noreferrer">https://d15790c7fypqrz.cloudfront.net/attachments/product_template_pictures/images/000/490/265/grid/832816_122.png</a>'
    from origin 'http://<em>.herokuapp.com' has been blocked by
    CORS policy: No 'Access-Control-Allow-Origin' header is present on the
    requested resource. Origin 'http://</em>.herokuapp.com' is therefore not
    allowed access.</p>
  </blockquote>
  
  <p>How do I resolve it? This is the code which does the base64 conversion:</p>
  
  <pre><code>function createBase64Property(product, callback, outputFormat) {
    var img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function() {
      var canvas = document.createElement('CANVAS');
      var ctx = canvas.getContext('2d');
      var dataURL;
      canvas.height = this.height;
      canvas.width = this.width;
      ctx.drawImage(this, 0, 0);
      dataURL = canvas.toDataURL(outputFormat);
      callback(product, dataURL);
    };
    img.src = product.imageUrl;
    if (img.complete || img.complete === undefined) {
      img.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==';
      img.src = product.imageUrl;
    }
  }
  </code></pre>
  
  <p>My web.js configuration is as follows:</p>
  
  <pre><code>var gzippo = require('gzippo');
  var express = require('express');
  var morgan = require('morgan');
  var cors = require('cors')
  
  var app = express();
  
  app.use(morgan('dev'));
  app.use(gzippo.staticGzip(__dirname));
  app.use(cors({credentials: true, origin: true}));
  app.all('*', function(req, res, next) {
     res.header("Access-Control-Allow-Origin", "*");
     res.header("Access-Control-Allow-Headers", "X-Requested-With");
     res.header('Access-Control-Allow-Headers', 'Content-Type');
     next();
  });
  app.listen(process.env.PORT || 5000);
  </code></pre>