Question

此代码可在JSFiddle.net上使用：

html：

<script src="https://rtcmulticonnection.herokuapp.com/dist/RTCMultiConnection.min.js"></script>
<script src="https://rtcmulticonnection.herokuapp.com/socket.io/socket.io.js"></script>

css：

video {
  width: 40%;
  border-radius:15px;
  margin: 5px 10px;
}

js：

var connection = new RTCMultiConnection();

// this line is VERY_important
connection.socketURL = 'https://rtcmulticonnection.herokuapp.com:443/';

// all below lines are optional; however recommended.

connection.session = {
    audio: true,
    video: true
};

connection.sdpConstraints.mandatory = {
    OfferToReceiveAudio: true,
    OfferToReceiveVideo: true
};

connection.onstream = function(event) {
    document.body.appendChild( event.mediaElement );
};

var predefinedRoomId = prompt('Please enter room-id', 'xyzxyzxyz');

connection.openOrJoin(predefinedRoomId);

但是当我将其全部结合并添加到通知js片段中后放到GitHub Pages托管上时，js根本看不到激活，而只显示了基本页面。

HTML / CSS：

<!DOCTYPE html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<title>
 Instant Call
</title>
<style>
video {
  width: 40%;
  border-radius:15px;
  margin: 5px 10px;
}
</style>
<body>
  <p>Instant Conference</p>
  <script src="https://rtcmulticonnection.herokuapp.com/dist/RTCMultiConnection.min.js"></script>
<script src="https://rtcmulticonnection.herokuapp.com/socket.io/socket.io.js"></script>
<script src ="notifi.js"></script>
</body>
</html>

notifi.JS：

if (window.webkitNotifications.checkPermission() == 0) {
  window.webkitNotifications.createNotification('icon.png', 'Notification Title', 'Notification content...');
} else {
  // Note that we can't call requestPermission from here as we are in the
  // callback function and not triggered just on user action
  console.log('You have to click on "Set notification permissions for this page" ' + 'first to be able to receive notifications.');
  return;
}



var connection = new RTCMultiConnection();

// this line is VERY_important
connection.socketURL = 'https://rtcmulticonnection.herokuapp.com:443/';

// all below lines are optional; however recommended.

connection.session = {
    audio: true,
    video: true
};

connection.sdpConstraints.mandatory = {
    OfferToReceiveAudio: true,
    OfferToReceiveVideo: true
};

connection.onstream = function(event) {
    document.body.appendChild( event.mediaElement );
};

var predefinedRoomId = prompt('Please enter room-id', 'xyzxyzxyz');

connection.openOrJoin(predefinedRoomId);

||||||||||||||||||||||||||||||||||||||||||| |||||||||| \ 编辑美国东部时间8 / 17-5：17PM

现在它仅成功显示在连接的一端（一个用户/设备）****

当用户加入聊天室时，它应该通知所有用户，并同时显示他们的两个实时网络摄像头。在JSfiddle中，此方法有效，但在github页面上无效。

|||||||||||||||||||||||||||||||| 编辑美国东部标准时间8/17/18 8:47

获得了该行的所有预期工作，应将新加入的用户通知参与者：

if (connection.newParticipant === true) {
  var notification = new Notification("New Call!");
}

这是完整的代码：

<!DOCTYPE html>
<html>
<style>
video {
  width: 40%;
  border-radius:15px;
  margin: 5px 10px;
}
</style>
<body>

<h1>Instant Call</h1>


<script src="https://rtcmulticonnection.herokuapp.com/dist/RTCMultiConnection.min.js"></script>
<script src="https://rtcmulticonnection.herokuapp.com/socket.io/socket.io.js"></script>
<script>
  // Let's check if the browser supports notifications
  if (!("Notification" in window)) {
    alert("This browser does not support desktop notification");
  }
  // Let's check whether notification permissions have already been granted
  //else if (Notification.permission === "granted") {

   // var notification = new Notification("Hi there!");
    // If it's okay let's create a notification
  //}
  // Otherwise, we need to ask the user for permission
  else if (Notification.permission !== "denied") {
    Notification.requestPermission(function (permission) {
      // If the user accepts, let's create a notification
     // if (permission === "granted") {

     // }
    });
  }
  // At last, if the user has denied notifications, and you 
  // want to be respectful there is no need to bother them any more.

var connection = new RTCMultiConnection();
// this line is VERY_important
connection.socketURL = 'https://rtcmulticonnection.herokuapp.com:443/';
// all below lines are optional; however recommended.
connection.session = {
    audio: true,
    video: true,
    data:   true,
    //screen: true,
    //oneway: true
};
connection.sdpConstraints.mandatory = {
    OfferToReceiveAudio: true,
    OfferToReceiveVideo: true
};
connection.onstream = function(event) {
    document.body.appendChild( event.mediaElement );
  //var notification = new Notification("New Call!");
};
var predefinedRoomId = prompt('Please enter room-id', 'xyzxyzxyz');

connection.openOrJoin(predefinedRoomId);

if (connection.newParticipant === true) {
  var notification = new Notification("New Call!");
}
</script>



</body>
</html>

Answer 1

问题是，如果您将其删除，此返回将起作用，该返回应在函数内部使用：

if (window.webkitNotifications.checkPermission() == 0) {
  window.webkitNotifications.createNotification('icon.png', 'Notification Title', 'Notification content...');
} else {
  // Note that we can't call requestPermission from here as we are in the
  // callback function and not triggered just on user action
  console.log('You have to click on "Set notification permissions for this page" ' + 'first to be able to receive notifications.');
  **return;**
}

return语句结束函数执行并指定一个值返回给函数调用者。 MDN

JSFiddle示例有效，但不适用于GitHub Pages

1 个答案: