xhook | Easily intercept and modify XHR request and response | REST library
kandi X-RAY | xhook Summary
kandi X-RAY | xhook Summary
Easily intercept and modify XHR request and response
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of xhook
xhook Key Features
xhook Examples and Code Snippets
Community Discussions
Trending Discussions on xhook
QUESTION
I am trying to load some video content from Microsoft Azure, using Video.js, and I need to add some headers for SharedKey authorization. I have been trying various methods and doing research for several days, but I am hitting brick walls and could really use some assistance.
Important to note that this is for a mobile app written using Angular / Cordova.
This is how Azure suggests that we do it:
https://docs.microsoft.com/en-us/azure/media-services/latest/player-how-to-video-js-player
Basically, by attaching a function to videojs.Hls.xhr.beforeRequest.
Unfortunately, there are several problems with this approach. Here is a ticket in the videojs issue tracker trying to look for a solution to these issues:
https://github.com/videojs/video.js/issues/7207
In summary:
1- We are not using HLS/DASH. We are loading mp4 files from blob storage. And videojs "hands that off directly to the browser, and it handles all loading of things while not providing this extra set of functionality."
2- Even if we were to convert the media and use HLS, "this method won't be available because native playback is used for Safari with HLS.". (So do we need to use DASH? Or does that not work on Safari either?)
3- There is still no way to add headers for Subtitle tracks, whether we use native subtitles, or add them through videojs.players.video.addRemoteTextTrack.
I have also tried other alternative methods like
1- Trying to use xhook to intercept it.
2- Trying to use @angular/common/http/HttpInterceptor.
Neither method worked.
So, my questions would be:
1- Is there a method I'm overlooking that would allow me to add / inject headers to requests being made natively by the browser?
2- Could it perhaps be done with an authorization cookie? I have seen this mentioned in some other questions, but I couldn't find any concrete examples, and I'm not sure how it would work with Azure.
3- If all else fails, is there another video player I could use that does provide better support in regards to authorization options?
Any other suggestions would be also be appreciated. Thank you.
...ANSWER
Answered 2021-Apr-27 at 09:38Considering you're serving a video file stored as a blob in Azure Storage directly, you can make use of Shared Access Signature (SAS)
. A SAS provides a time-limited, permission-bound access to a blob.
The way it would work is when a user requests a video to be played, you will need to send a request to your backend service. Your backend service will create a SAS token for the blob with Read
permission (only this permission is required to play the video) and some expiry date (depending on the length of the video). Your backend service will return the SAS URL for the blob (which would be something like blob-url?sas-token
) which will be used by the video player to play the video.
You can find more information about Shared Access Signature here: https://docs.microsoft.com/en-us/rest/api/storageservices/delegate-access-with-shared-access-signature. You will need to create a Service SAS
for your blob.
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install xhook
Development xhook.js 14KB
Production xhook.min.js 6KB
CDN (Use latest or lock to one of the available versions) <script src="//unpkg.com/xhook@latest/dist/xhook.min.js"></script>
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page