5

I wanted to run a test of a sketch I just made ported to processing.js. When I load the webpage, I get the following errors from the javascript console in Chrome:

XMLHttpRequest cannot load file:///Users/aoeuaoeu/Desktop/projects/local%20site%20files/_/ee.pde. Origin null is not allowed by Access-Control-Allow-Origin. processing.js:27Uncaught Error: NETWORK_ERR: XMLHttpRequest Exception 101

Here's the source of the page I'm loading:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Earnest Emporium</title>
<!--Contact: earnestemporium@gmail.com--> 
<script src="processing.js"></script>   
<canvas data-processing-sources="ee.pde"></canvas>  
</head>
<body>
</body>
</html>

ee.pde and processing.js are in the same directory as the html file, so I'm not really sure what's going on. I should also point out that I'm testing this locally, and I get a different error when I load the page once uploaded onto my ftp server. (Maybe it's chrome? I get a black box which doesn't show up on chrome on firefox once it's uploaded to the ftp server. It works fine on firefox locally)

 /processing.js:17946Uncaught SyntaxError: Unexpected token <
Processing.Sketch.attach/processing.js:17946
Processing.Processing.executeSketch/processing.js:16209
Processing/processing.js:16237
init/processing.js:17991
window.addEventListener.i
user229044
  • 232,980
  • 40
  • 330
  • 338
Mike
  • 963
  • 4
  • 16
  • 38
  • Did you check your syntax? It gives you the exact line numbers. I get the same error with Chrome, as it doesn't like when I call files externally from local JS files. I think this is to prevent XSS, but it could also be a "feature" (think in terms of IE)... – Blender Nov 21 '10 at 02:39
  • Wouldn't the error be in processing.js? If that's the case, I'm not really sure what to do about it. I'm following the instructions here: http://processingjs.org/learning, and both methods seem to be producing a blank screen. There aren't any errors in my actual processing file, I ran it before on the desktop processing and the web ide and it works fine. In fact, the examples that came with processing don't work in chrome either. Oddly enough, all of the examples render perfectly on the website. – Mike Nov 21 '10 at 03:03
  • I was meaning that Chrome (and any other decent browser) is preventing you from making requests via *any* JavaScript to access local files. You wouldn't like a site looking through your pictures while you visit it, now would you? Upload your stuff to a web server or start a local web server and try it from there. That should fix your problem. – Blender Nov 23 '10 at 04:38

1 Answers1

7

I just noticed this:

file:///Users/aoeuaoeu/Desktop/projects/local%20site%20files/_/ee.pde.

Are you running this on your desktop? If I recall correctly AJAX does NOT run from your desktop, you need a native web server setup, and running it by calling your localhost.

Jakub
  • 20,418
  • 8
  • 65
  • 92
  • I was running it locally, could you tell me how would I call my localhost? Also, it doesn't seem to load once uploaded on my actual website, so I don't know if it would make a difference. ( http://www.earnestemporium.com excuse the free godaddy hosting) – Mike Nov 21 '10 at 04:37
  • get something like http://www.wampserver.com/en/ and run that on your local machine, use Firefox Firebug to troubleshoot all javascript. – Jakub Nov 21 '10 at 04:41
  • 2
    `python -m SimpleHTTPServer` is pretty useful for this. – Jason Sundram Dec 16 '11 at 02:41
  • node server works best for me: try `sudo http-server [path] -p 80 --cors true` – 8-Bit Borges Sep 11 '15 at 04:16