TheWidlarzGroup / react-native-video

A <Video /> component for react-native
https://thewidlarzgroup.github.io/react-native-video/
MIT License
7.19k stars 2.89k forks source link

IOS Not playing url Video : code: -11850, localizedFailureReason: "The server is not correctly configured.", domain: "AVFoundationErrorDomain", localizedDescription: "Operation Stopped" #2859

Closed AhmedTouti closed 2 years ago

AhmedTouti commented 2 years ago

Current behavior

Platform

Which player are you experiencing the problem on:

Video sample

https://api.yuskan.flexi-apps.com/api/v1/videos/view/6321ae475254855f91907506.mp4

please can some one help me what to do in this case ,thanks in advance

freeboub commented 2 years ago

I just had a quick try, on my really first try, I was not able to seek in the content, It can be the root cause of your issue... Do you have the issue on android ? Which version react-native-video package ?

AhmedTouti commented 2 years ago

thank you bro @freeboub, react-native-video package version is : 5.2.0 the issue is on ios ,the android work just fine.

sspact commented 2 years ago

We are having the same issue here using 6.0.0-alpha.3 , I am trying to play an FLV file and android works but not IOS hope someone can help to resolve this issue for us as well.

freeboub commented 2 years ago

I advise you to take a Network traffic record with Charles proxy, in order to see if server report an error durring playback request...

AhmedTouti commented 2 years ago

thanks a gain @freeboub , i think that is a header problem of my endpoint , what header config do you advice

freeboub commented 2 years ago

@AhmedTouti I cannot advise anything... It is your server requirement ! :)

sspact commented 2 years ago

@AhmedTouti do share with us what is your finding after your trial and error with your header

AhmedTouti commented 2 years ago

hi @freeboub ,i suspect that my header config is not right configured ,but there is no header err the only err is in the app (IOS) wish is : {localizedRecoverySuggestion: "", code: -11850, localizedFailureReason: "The server is not correctly configured.", domain: "AVFoundationErrorDomain", localizedDescription: "Operation Stopped"} ,NOTE : IT WOCK FINE IN ANDROID : )

evoactivity commented 2 years ago

@AhmedTouti Your server does not honor range requests, which is causing the issue. AVPlayer first sends a range request of 0-1, if the server does not send 1 byte of data AVPlayer will error, your server responds with the full video and disregards the range request.

You can use curl to see the server that does work responds with accept-ranges: bytes,

curl -i https://freetestdata.com/wp-content/uploads/2022/02/Free_Test_Data_1MB_MP4.mp4

HTTP/2 200
date: Mon, 26 Sep 2022 23:30:01 GMT
content-type: video/mp4
content-length: 1053887
cache-control: public, max-age=31536000
expires: Tue, 26 Sep 2023 23:23:18 GMT
last-modified: Fri, 18 Feb 2022 14:02:30 GMT
etag: "1014bf-620fa6f6-0;;;"
referrer-policy: no-referrer-when-downgrade
x-turbo-charged-by: LiteSpeed
cf-cache-status: HIT
age: 403
accept-ranges: bytes
report-to: {"endpoints":[{"url":"https:\/\/a.nel.cloudflare.com\/report\/v3?s=uq7JRU15ygpXQX%2Bx%2FhNcQMLiKniCO46AmegIwDRnuobhf2CjjM8HSFH6fwbzgaL0aQVsfx7jd8PrYo1YOtnjwVBOS9cNCk%2FXKSrdZGBC63aywsme100QCjf0HlGYa95IO%2B11"}],"group":"cf-nel","max_age":604800}
nel: {"success_fraction":0,"report_to":"cf-nel","max_age":604800}
server: cloudflare
cf-ray: 750fc8f8d9afd214-MAN
alt-svc: h3=":443"; ma=86400, h3-29=":443"; ma=86400

and your api server does not

curl -i https://api.yuskan.flexi-apps.com/api/v1/videos/view/6321ae475254855f91907506.mp4

HTTP/1.1 200 OK
Server: nginx
Date: Mon, 26 Sep 2022 23:43:54 GMT
Content-Type: video/mp4
Content-Length: 1053887
Connection: keep-alive
vary: Accept-Encoding
Access-Control-Allow-Credentials: true
Content-Language: fr
age: 0
alt-svc: h3=":443"; ma=86400, h3-29=":443"; ma=86400
cache-control: public, max-age=31557600
cf-cache-status: HIT
cf-ray: 74b4718b1dd7da6a-LIS
Content-Range: bytes 0-1053886/1053887
etag: "1014bf-620fa6f6-0;;;"
expires: Wed Sep 27 2023 00:43:54 GMT+0100 (GMT+01:00)
last-modified: Wed Sep 14 2022 11:34:47 GMT+0100 (GMT+01:00)
nel: {"success_fraction":0,"report_to":"cf-nel","max_age":604800}
referrer-policy: no-referrer-when-downgrade
report-to: {"endpoints":[{"url":"https://.inextra.flexi-apps.com"}],"group":"cf-nel","max_age":604800}
x-turbo-charged-by: LiteSpeed
Set-Cookie: sessionId=s%3AWVa9K2XF3vGhG9y1cqOsbW3UAmerNL5_.I8SLmhnoaAJzlgImKOJ5PVPUsMYD48NbwbJuGNC18Oc; Path=/
Strict-Transport-Security: max-age=31536000;
X-Frame-Options: sameorigin
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block

When trying to send a range request

curl -r 0-1 -i https://api.yuskan.flexi-apps.com/api/v1/videos/view/6321ae475254855f91907506.mp4

Content-Range: bytes 0-1053886/1053887
curl -r 0-1 -i https://freetestdata.com/wp-content/uploads/2022/02/Free_Test_Data_1MB_MP4.mp4

content-range: bytes 0-1/1053887

This is a server side problem that cannot be fixed through this library. This is an AVPlayer requirement when streaming video.

AhmedTouti commented 2 years ago

thank you very much @evoactivity

jdurham85 commented 1 year ago

thanks a lot, it was the backend of my server that I had resolve @evoactivity

VooduVibe commented 1 year ago

@AhmedTouti, thank you for raising this issue. I have a feeling that you have figured this problem out. I tried your backend link: https://api.yuskan.flexi-apps.com/api/v1/videos/view/6321ae475254855f91907506.mp4 and it seems to be streaming fine on my end. Was it a backend issue, and can you kindly share what you did to resolve it?

jdurham85 commented 1 year ago

@VooduVibe VooduVibe I think I may have solve the issue, if you are using nginx make sure NGINX Caching is turned off, I don't the reason why when the NGINX Caching is on the video stream works fine on android but on ios it doesn't but after turn it off it now the video stream work on ios. Also make sure (im using php) as @AhmedTouti mentioned make sure the required header set on your server accept-ranges: bytes. One more thing make sure when requesting the file that it has a file name ex. video.mp4.

Mohamed-akmal0 commented 7 months ago

http://localhost:8080/campaign/media/videos/testingPromoVideo_1709731367414.mp4 this is the url that im testing in ios , when i checked the headers i got this => HTTP/1.1 206 Partial Content X-Powered-By: Express Access-Control-Allow-Origin: * Accept-Ranges: bytes Content-Range: bytes 0-1/1053887 Content-Type: video/mp4 Date: Wed, 13 Mar 2024 09:13:07 GMT Connection: keep-alive Keep-Alive: timeout=5 Transfer-Encoding: chunked

but im stil getting this issue => {"code": -11850, "domain": "AVFoundationErrorDomain", "localizedDescription": "Operation Stopped", "localizedFailureReason": "The server is not correctly configured.", "localizedRecoverySuggestion": ""}

im uring bare react native cli => "react-native": "^0.71.7", "react-native-video": "^6.0.0-alpha.11",

djguruwap commented 1 week ago

I have fixed this by adding -

accpet bytes and content range.