I've created a canvas via jQuery and need to save it back to the public file directory as an image, so I can access it like any other image.

I can create the file and save it, into the same file location as my save.php script, but unable to save it to the public file directory...

    var canvas = document.getElementById('myCanvas');
    var dataURL = canvas.toDataURL("image/png");
    
    $.ajax({
      type: "POST",
      url:  Drupal.settings.basePath + "mypath/save.php",
      data: { 
         imgBase64: dataURL
      }
    })

Then the following php as called in save.php:

    $img = $_POST['imgBase64'];
    $img = str_replace('data:image/png;base64,', '', $img);
    $img = str_replace(' ', '+', $img);
    $fileData = base64_decode($img);
    $fileName = 'public://' . uniqid() . 'myCanvas.png';
    file_put_contents($fileName, $fileData);

excluding `'public://' .` will happily save to the location specified in `Drupal.settings.basePath + "mypath/..."`, but I'm unable to tell it to save to the public directory or even any directory structure...