Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feature] Support SSR Rendring #14

Closed
snelsi opened this issue Aug 30, 2022 · 6 comments
Closed

[Feature] Support SSR Rendring #14

snelsi opened this issue Aug 30, 2022 · 6 comments
Labels
enhancement New feature or request triaged

Comments

@snelsi
Copy link

snelsi commented Aug 30, 2022

JWPlayer fails to render on Server Side.
Tested in the Next.js application.

The JWPlayer component tries to access window property, which doesn't exist on the server, resulting in the following error:

window is not defined
ReferenceError: window is not defined
    at /sandbox/node_modules/@jwplayer/jwplayer-react/lib/jwplayer-react.js:2:9899
    ...

Checkout this sandbox:
https://codesandbox.io/s/next-js-forked-yl5wme?file=/pages/index.js

Expected result:
JWPlayer component should skip Server Side rendering, or defer the usage of the window to prevent the error

@jasonlav
Copy link

Issue can be resolved by hiding the player on SSR render and then rendering it on the frontend. I am unfamiliar with Next.js, but with Gatsby it can be done using the following:

const [showPlayer, setShowPlayer] = useState(false);

useEffect(() => {
    setShowPlayer(true);
}, []);

return (
    {showPlayer && <JWPlayer>}
);

@snelsi
Copy link
Author

snelsi commented Aug 31, 2022

@jasonlav
Yes, you can manually hide this error by skiping server side rendering of the component.
But this logic should be included in the library out of the box, since most of the modern web-applications are rendered on the Server Side

@mdaoust-sidlee
Copy link

mdaoust-sidlee commented Dec 2, 2022

Any official update on this issue?
Even with the suggested recommentation from @jasonlav I have the following error (which might be related to #12 and #13) :

image

@kenchambers
Copy link

bump. we'd like to see out of the box SSR support as well (planning on scaling this package)

@jdunningjwp
Copy link
Contributor

@snelsi @jasonlav @kenchambers @mdaoust-sidlee We have made an update to support server side rendering on branch improvement/add-support-for-SSR. Please test this new feature out and let us know if you have any feedback.

@jwbrandon
Copy link

If you see any other issues with this feel free to open another issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request triaged
Projects
None yet
Development

No branches or pull requests

7 participants