AgoraIO / Basic-Video-Broadcasting

Sample app to join/leave a channel, set the role as a host/audience, mute/unmute, switch between front/rear cameras, and set the video parameters.
MIT License
269 stars 287 forks source link

Live Streaming not working from Chrom and Safari browse of Mac browser as Host and as Audience both #98

Closed shubhra-ahead closed 3 years ago

shubhra-ahead commented 4 years ago

In the demo and your sdk code, https://webdemo.agora.io/agora-web-showcase/examples/OpenLive-Web/#/ below issues are coming in Mac System (both Video Codecs):

When I am Host from Mac Safari and Chrome browser

  1. When I host a live streaming, then my hosted video is shown blank to the audience on all the devices and browsers.

image

When I am Audience on Mac Safari and Chrome browser

  1. When I am an audience of live streaming from the other devices and browsers, then I see blank screen at my end.

This is very severe issue as Mac system and apple devices like iPhone and iPad are very much used in almost all parts of the world.

plutoless commented 4 years ago

@shubhra-ahead sorry i can't reproduce the issue. the demo is working fine for me. what is the problem you are having?

Vaibhav-Agarwal06 commented 4 years ago

Problem is that when we go live from windows chrome browser that we are not able to join it from safari browser from mac. It is showing black screen only not the streaming video. Also same issue is coming on iPhone safari and chrome browser. Is video broadcasting working on all browsers in all OS?

plutoless commented 4 years ago

sorry we just confirmed this demo is working on PC only. on iphone you will need to turn off dual stream feature otherwise it will block you from using it properly. anyway webrtc is not working on all browsers in all OS, you may check the complete compatibility here https://caniuse.com/#search=webrtc, the support is not so good on mobile browsers.

shubhra-ahead commented 4 years ago

We are not testing on Mobile Browsers. I have mentioned the issue in Mac system only.

If I host a live streaming from Mac system (laptop and PC) browser, then the stream is coming blank to audience in Windows PC pr even Mac PC.

plutoless commented 4 years ago

i just did a test and it's working fine. could you pls help provide the console logs of both end so that i can take a look?

ej020586 commented 4 years ago

I am unable to host from my iphone in safari. I disabled dual stream and still get kicked back to the landing page after allowing the app to use my camera. Does hosting not working from safari with this demo?

Update I was able to get this to work. I'm not exactly sure what the cause was but after making sure all my parameters for the config being set correctly it started working.

plutoless commented 4 years ago

@ej020586 could you pls help provide a test link so that i can quickly check?

Jarred-Sumner commented 3 years ago

I have a similar issue when using a Canvas stream. Support Ticket: CUS-7128

The error I'm getting is: {code: 400, reason: "invalid_appid", serverTs: 1595977190985, requestId: 1}

I've tried with both Agora RTC Web and Agora RTC Web NG.

~From looking at the debugger before the exception is raised, it appears that it never makes an outgoing request to publish the stream, the code is really 0 before it's changed to 400.~ <-- is incorrect, it just hadn't parsed the JSON yet.

This is the request body it sends in to the messages endpoint:

{
  "msgType": "EventMessages",
  "sentTs": 1595981587,
  "payloads": [
    "{\"type\":\"io.agora.pb.Wrtc.Publish\",\"data\":{\"sid\":\"FB08985A6670F0E66529FC36E27EFAE9\",\"lts\":1595981586656,\"success\":true,\"cname\":\"315\",\"uid\":5088,\"peer\":null,\"cid\":653833311,\"elapse\":1810,\"extend\":null,\"vid\":\"298000\",\"eventType\":\"publish\",\"eventElapse\":0,\"errorCode\":null,\"videoName\":\"Wn/MpbDXFPyGmBN4TK6DJSGJCzFOqdbpL60wwt289wKV8CthxwxoLN7rWeXsr3pQIVaNY/HBs55X1GzFeqdPLQ==\",\"audioName\":\"MediaStreamAudioDestinationNode\"}}"
  ]
}

Here are the logs (Agora RTC Web NG):

16:51:17:545 Agora-SDK [INFO]: browser compatibility {getDisplayMedia: true, getStreamFromExtension: true, supportUnifiedPlan: true, supportMinBitrate: true, supportMaxBitrateInEncodingParameters: true, …} {name: "Chrome", version: "84", os: "Mac OS X"}
16:51:17:569 Agora-SDK [INFO]: [835cf] Initializing AgoraRTC client v0.1.9, mode: live, codec: vp8
16:51:17:573 Agora-SDK [DEBUG]: [835cf] connection state change: DISCONNECTED -> CONNECTING
16:51:17:576 Agora-SDK [DEBUG]: Flush cached event reporting: 1
16:51:17:583 Agora-SDK [DEBUG]: [835cf] Connect to choose_server: https://webrtc2-ap-web-1.agora.io/api/v1
16:51:18:56 Agora-SDK [INFO]: [835cf] Joining channel: 315
16:51:18:57 Agora-SDK [DEBUG]: [835cf] setParameter in distribution: {}
16:51:18:60 Agora-SDK [DEBUG]: [gateway-835cf] start connect, url: wss://107-155-2-162.edge.agora.io:5888
16:51:18:208 Agora-SDK [DEBUG]: [gateway-835cf] websockect opened: wss://107-155-2-162.edge.agora.io:5888
16:51:18:363 Agora-SDK [DEBUG]: [835cf] finish join to gateway
16:51:18:363 Agora-SDK [DEBUG]: turn config {username: "test", password: "111111", turnServerURL: "107-155-2-162.edge.agora.io", tcpport: 5918, udpport: 5918, …}
16:51:18:364 Agora-SDK [DEBUG]: [835cf] connection state change: CONNECTING -> CONNECTED
16:51:18:367 Agora-SDK [DEBUG]: [835cf] Connected to gateway server
16:51:21:585 Agora-SDK [DEBUG]: start check mediaStreamTrack resolution CanvasCaptureMediaStreamTrack {canvas: canvas#noa-container.jsx-1576047751, kind: "video", id: "da4c4fbc-fd70-468a-8e84-de568f0456bb", label: "RNb1Yibyj0vTCwJDjhuLnfk2jbWhAf+j8s4oy1ydIpNGs2ocqkiwtDTD48nQE7aqhAEwL1X/3jBEO0Mv35+heQ==", enabled: true, …}
16:51:21:596 Agora-SDK [INFO]: [835cf] Publishing tracks, id 7949d531 ,9d408368 
16:51:21:741 Agora-SDK [DEBUG]: get track resolution:  547 x 926 CanvasCaptureMediaStreamTrack {canvas: canvas#noa-container.jsx-1576047751, kind: "video", id: "da4c4fbc-fd70-468a-8e84-de568f0456bb", label: "RNb1Yibyj0vTCwJDjhuLnfk2jbWhAf+j8s4oy1ydIpNGs2ocqkiwtDTD48nQE7aqhAEwL1X/3jBEO0Mv35+heQ==", enabled: true, …}
16:51:21:851 Agora-SDK [DEBUG]: [pc-1] ice-state: pub p2p checking
16:51:21:877 Agora-SDK [DEBUG]: [pc-1] connection-state: pub p2p connecting
16:51:21:885 Agora-SDK [DEBUG]: [pc-1] ice-state: pub p2p connected
16:51:21:886 Agora-SDK [DEBUG]: Flush cached event reporting: 2
16:51:21:894 Agora-SDK [DEBUG]: start live streaming rtmp://global-live.mux.com/app/[redacted], mode: mix_streaming
16:51:21:968 Agora-SDK [DEBUG]: [pc-1] connection-state: pub p2p connected
ej020586 commented 3 years ago

@Jarred-Sumner I haven't tried the canvas stream. Do you get a similar issue with a video stream?

Jarred-Sumner commented 3 years ago

I haven't but I'll try it tomorrow.

The main differences between a canvas stream and a webcam stream is the variety of resolutions a canvas could be -- webcams have relatively standard resolutions, but a canvas could be any. H264 encoders are known to have issues with height/width that are not divisible by 8 (With iOS' video editing framework, if it's not divisible by 8 then you will sometimes get green bars on the edges of the video). I also vaguely remember something about canvas streams always being vp8 instead of h264, but that might not be true anymore (MediaRecorder supports h264 inside a webm container)

plutoless commented 3 years ago

@Jarred-Sumner if the error indicates an invalid appid error, it's usually because you are not putting appid in the right place. how did you set your appid in the sample app?

Jarred-Sumner commented 3 years ago

I got it working!

The problem was that I was using string-based user IDs. The error appeared when calling startLiveStreaming (after joined & published)