JavaScript [RESOLVED] Can't load image
CodeGuru Home VC++ / MFC / C++ .NET / C# Visual Basic VB Forums Developer.com
Results 1 to 4 of 4

Thread: [RESOLVED] Can't load image

  1. #1
    Join Date
    Sep 2012
    Posts
    2

    [RESOLVED] Can't load image

    Hi.

    I'm just getting started with php, so I've installed apache, changed the owner of the "/var/www" folder to me, and inserted my files within this folder. In the folder I currently have:

    "index.js"
    "index.php"
    "map.jpg"
    "style.css"

    I've run everything in html perfect from my desktop, and it's time to start doing some server side programming, so I changed index.html to index.php and shoved it in my web root ( /var/www/ ).

    The only problem is, the image doesn't load. Whether the image is set to draw on the canvas as it used to, or on the background via css, the image won't load.

    From the index.js file:
    Code:
    function canvasOnLoad()
    {
        
        var canvas = document.getElementById("clientArea");
        canvas.width = document.documentElement.clientWidth;
        canvas.height = document.documentElement.clientHeight;
    
        var c2d = canvas.getContext("2d");
    
        var img = new Image();
        img.src = "/var/www/map.jpg"; // this was simply "map.jpg", both paths don't work.
    
        img.onload = function ()  
        {   
            alert("loaded!"); 
            c2d.drawImage(img, 0, 0, canvas.width, canvas.height); 
        }   
    
        img.onerror = function() { alert("error loading image!"); }
    
    }
    the img.onerror alert keeps getting called.

    and from the index.php:
    Code:
    <!DOCTYPE html>
    <html >
        <head>
            <link rel="stylesheet" type="text/css" href="style.css"></link>
            <script type="text/javascript" src="index.js"></script>
        </head>
    
        <body>
            <canvas id="clientArea">NotSupported.</canvas>
            <script>canvasOnLoad();</script>
        </body>
    </html>
    Like I said, the code used to work fine on the desktop (and still does).
    I've tried changing the file to an html rather than php, no luck.

    I have a feeling it has to do with permissions and that apache2 isn't able to send the client the image. I've done no configuring of apache2, it's standard with ubuntu... maybe this is really the source of error?

  2. #2
    PeejAvery's Avatar
    PeejAvery is online now Super Moderator Power Poster
    Join Date
    May 2002
    Posts
    10,869

    Re: Can't load image

    First off, this has nothing to do with PHP. You are using 100% JavaScript. So I moved it to the client-side forum.

    Second, if the image is in the same folder as the client-side script, then the image source is completely wrong. It should just be "map.jpg" without any folder listing.
    If the post was helpful...Rate it! Remember to use [code] or [php] tags.

  3. #3
    PeejAvery's Avatar
    PeejAvery is online now Super Moderator Power Poster
    Join Date
    May 2002
    Posts
    10,869

    Re: Can't load image

    [ moved thread ]
    If the post was helpful...Rate it! Remember to use [code] or [php] tags.

  4. #4
    Join Date
    Sep 2012
    Posts
    2

    Re: Can't load image

    Thanks PeejAvery for the response.

    The reason I posted it in PHP is because all the JS was working fine until I moved it to the localhost root (/var/www/).

    Also, I had the image as "map.jpg" as noted in the comment. I was merely trying "/var/www/map.jpg" to see if that was a problem (but you're absolutly right, that makes 0 sense to a client which has no idea they are in my "/var/www" folder).

    I actually figured out the problem with a little bit of messing around and reading.

    "map.jpg" permissions were set as:
    -rw------- (observed using "ls -l" in terminal)
    This means that only I can read and write to the image file, no one in my group or on the computer can do anything but me (excluding root of course).

    I modified the permissions on the file to:
    -rw-rw-r--
    using "chmod g+rw map.jpg"
    and "chmod a+r map.jpg"
    which lets my group read and write and everyone (all) read, respectively.

    That solved the problem. Before when I tried to view "localhost/map.jpg" I got a "403 access denied" error. Now I can see the image fine as a client. This was infact not a JS or a PHP problem, but merely a unix file-permission problem.

    Thanks for the response again PeejAvery. I'm learning something new about computers every day

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  


Azure Activities Information Page

Windows Mobile Development Center


Click Here to Expand Forum to Full Width

This is a CodeGuru survey question.


Featured


HTML5 Development Center