title: CORS issue when using OBJLoader in Three.js
body: <p>I'm trying to load an object from my system using OBJLoader but I'm always getting CORS error telling me this:</p>
  
  <p><code>Access to XMLHttpRequest at 'file:///Users/pranayankittiru/Desktop/tasks/resources/Pix.obj' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.</code></p>
  
  <p>Here is my code(task1.js):</p>
  
  <pre><code>var scene = new THREE.Scene();
  var camera = new THREE.PerspectiveCamera(
    75,
    window.innerWidth / window.innerHeight,
    0.1,
    1000
  );
  
  var renderer = new THREE.WebGLRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);
  
  // instantiate the loader
  var loader = new THREE.OBJLoader();
  
  loader.load(
    "resources/Pix.obj",
    function(object) {
      scene.add(object);
    },
    function(xhr) {
      console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
    },
    function(error) {
      console.log("An error has occured");
    }
  );
  </code></pre>
  
  <p>Here is my HTML file:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;title&gt;Task-1&lt;/title&gt;
          &lt;style&gt;
              body { margin: 0; }
              canvas { width: 100%; height: 100% }
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;script src="js/three.js"&gt;&lt;/script&gt;
          &lt;script src="js/loaders/ObjectLoader.js"&gt;&lt;/script&gt;
          &lt;script src="task1.js"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I'm using Three.js locally. I'm new to Three.js so I don't know where I'm going wrong. Please help me on this.</p>