bitmovin / bitmovin-player-ui

The Bitmovin Adaptive Streaming Player UI
MIT License
126 stars 87 forks source link

window is not defined #283

Closed justinmoon closed 5 years ago

justinmoon commented 5 years ago

I'm trying to use bitmovin-player in a next.js (server-side rendered react.js) project.

When I attempt to import the Player and run it, I get a window is not defined error. Here is a minimal reproduction of this bug.

I borrowed the main react.js component in this demo directly from your react.js example. And I'm importing Player exactly as is done in your webpack example ...

justinmoon commented 5 years ago

It seems like this PR was made to help support server-side rendering, but I'm not sure exactly how I'd utilize those utilitites ...

LudoMichaud commented 5 years ago

Hi, Thanks for reaching out and for sharing your sample project. Our player needs to be instantiated on the client side, and the window object is required.

You could for instance use RequireJS, as shown in one of our sample projects

Let us know in case you have any questions.

LudoMichaud commented 5 years ago

https://github.com/bitmovin/bitmovin-player-ui/issues/283#issuecomment-555214407

This PR only concerns the UI (not the Player Web SDK itself) and might only affect cases where the UI is used with our Native SDKs

justinmoon commented 5 years ago

Thanks @LudoMichaud.

In case any next.js developers stumble upon this issue in the future, this is what I needed to do to prevent the video player from running on the server and only running it on the client where window exists.