Video not playing on iOS from click on additional thumbnail

[rondog]

We have many sites that use a separate thumbnail to start the vimeo player. You click the thumbnail, we use some js to hide the image and call player.play(). That is no longer working on iOS. I noticed debugging in safari, we receive this error now

[Error] Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
(anonymous function) (vimeo.player.js:2:17316)
forEach
z (vimeo.player.js:2:17244)
(anonymous function) (vimeo.player.js:2:26205)

I mentioned to our devs we should avoid using separate thumbs to trigger a video play in the future, but for now I need to come up with a solution. Right now we just have the videos embedded using the iframe copied from vimeo and they aren't working by triggering player.play(). I attempted to put a random video in the iframe embed code and call player.loadVideo(myId) and then call player.play() but that didn't solve it either. My next attempt is going to be have the js api create the iframe.

If I add ?muted=1 to the iframe src it plays, but obviously that isn't going to work. I then created an on('play') function and inside that call player.setVolume(1). Doing that causes the player to pause itself. If I wrap that call in say a 3 second timeout, the video still pauses once setVolume is called