Login/Register
My processing.js sketch doesn't load. This shouldn't be too hard to answer
Asked Answered
Solved javascripthtmlprocessing.js
W

1

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: [email protected]> 
<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
Windhover answered 21/11, 2010 at 2:35 Comment(3)
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)... – Eulaliaeulaliah
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: 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. – Windhover
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. – Eulaliaeulaliah
I
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.

Iatrics answered 21/11, 2010 at 4:27 Comment(4)
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. ( earnestemporium.com excuse the free godaddy hosting) – Windhover
get something like wampserver.com/en and run that on your local machine, use Firefox Firebug to troubleshoot all javascript. – Iatrics
python -m SimpleHTTPServer is pretty useful for this. – Bandbox
node server works best for me: try sudo http-server [path] -p 80 --cors true – Tatting

© 2022 - 2024 — McMap. All rights reserved.