Playing media from GCS?

Google Cloud Compute Infrastructure
,
1

We are monitoring media files (.wav) sent to GCS, and I want a link so that a person can check the file. I first get a signed URL via StorageClient, and then I add a media player with that URL. The page loads, but after a few seconds the play option disappears (Files are big, about 2 hours long)

I can copy the URL and enter it in a browser. Same thing happens, player opens but is unable to play the file. I can download the file using the same URL. It is either an issue with the HTML5 media player, or due to time taken to get some content maybe?

Here is the PHP code:

        // Define the path to your key file
        $keyFilePath = __DIR__ . '/../config/my-json-key-file.json';  // Path to your Service Account JSON file

        $projectId = _GOOGLE_PROJECT_ID_;
        $bucketName = _GOOGLE_BUCKET_;
        $objectName = $files_hash . "." . $files_extension;      // Path to your WAV file in GCS
        // echo "File: $objectName <br>";

        $storage = new StorageClient([
            'projectId' => $projectId,
            // Provide the path to the credentials file
            'keyFilePath' => $keyFilePath,
        ]);

        $bucket = $storage->bucket($bucketName);
        $object = $bucket->object($objectName);

        // Generate a signed URL that expires in 15 minutes
        // $signedUrl = $object->signedUrl(new \DateTime('+15 minutes'));
        $signedUrl = $object->signedUrl(
          new \DateTime('+15 minutes'),
          [
            'responseDisposition' => 'inline', // Important: tells the browser to display it
            'responseType' => 'audio/wav',    // Explicitly set the MIME type
          ]
        );
        // echo "Signed URL: <a href='" . $signedUrl . "'>" . $signedUrl . "</a><br>";

I then use the following HTML code to display it:

          <tr>
            <td>&nbsp;</td>
            <td colspan="2">
              <audio controls id="audioPlayer">
                <source src="<?php echo $signedUrl; ?>" type="audio/wav">
                Your browser does not support the audio element.
              </audio>
            </td>
            <td>&nbsp;</td>
          </tr>

Has anyone got it right to play media files from the cloud? I do not want to make the bucket public. The bucket has Environment and Storage Object Viewer, Storage Object Creator, and Storage Object User roles assigned.

Any idea what I might have missed?

2

An issue might be that the media player does not use the parameters of the URL, while GCS needs these parameters to service the file.

HTML5 Audio: These parameters are not directly interpreted by the HTML5 audio player…

Any ideas how to get past this?