fix: add crossOrigin configuration to video examples to prevent WebGL SecurityError #406
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Background
When video assets are served from a different origin, the examples may load successfully and play audio, but the video image fails to render in WebGL. Browsers then raise a
SecurityErrorsimilar to:This occurs because WebGL cannot upload video frames as textures unless the video element is initialized with a
crossOriginattribute and the resource is CORS-enabled.Purpose of This Change
Adding
this.load.setCORS('anonymous')ensures that the video element is created with the correct cross-origin configuration. This prevents the WebGLSecurityErrorand allows video frames to render correctly when assets are hosted on different origins (local development, CDN setups, etc.).Impact
If further changes or adjustments are preferred, I can update the PR accordingly.
Note
Adds
this.load.setCORS('anonymous')to video example preloaders so cross-origin videos render correctly in WebGL.public/3.86/src/game objects/video/*:this.load.setCORS('anonymous')inpreload()across examples (change video source,get first video frame,loop video,multiple video instances,multiple videos,on complete event,play video,stream video from webcam,transparent video,video as shader texture,video controls,video set current time,video snapshot area,video snapshot,video to sprites,video transition).public/3.55/src/game objects/video/play video.js:this.load.setCORS('anonymous')before settingBaseURL.Written by Cursor Bugbot for commit 9b6ead7. This will update automatically on new commits. Configure here.