sipRTC - Benutzerbeiträge [de]

Biliothek:ws

2018-03-06T21:25:59Z

Admin: Die Seite wurde neu angelegt: „Category:Bibliothek == Server == (Teilweise übernommen aus [https://github.com/websockets/ws]) === Server bereitstellen === <syntaxhighlight lang="Java…“

[[Category:Bibliothek]]
== Server ==

(Teilweise übernommen aus [https://github.com/websockets/ws])

=== Server bereitstellen ===

<syntaxhighlight lang="JavaScript" line>
var WebSocketServer = require('ws').Server
, wss = new WebSocketServer({ port: 8080 });

wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
});

ws.send('something');
});
</syntaxhighlight>

=== Sending and receiving text data ===

<syntaxhighlight lang="JavaScript" line>
var WebSocket = require('ws');
var ws = new WebSocket('ws://www.host.com/path');

ws.on('open', function open() {
ws.send('something');
});

ws.on('message', function(data, flags) {
// flags.binary will be set if a binary data is received.
// flags.masked will be set if the data was masked.
});
</syntaxhighlight>

=== Server sending broadcast data ===

<syntaxhighlight lang="JavaScript" line>
var WebSocketServer = require('ws').Server
, wss = new WebSocketServer({ port: 8080 });

// Broadcast to all.
wss.broadcast = function broadcast(data) {
wss.clients.forEach(function each(client) {
client.send(data);
});
};

wss.on('connection', function connection(ws) {
ws.on('message', function message(data) {
// Broadcast to everyone except message sending socket
wss.clients.forEach(function each(client) {
if (client !== ws) client.send(data);
});
});
});
</syntaxhighlight>

== Weblinks ==
* [https://github.com/websockets/ws GitHub]

Kategorie:Bibliothek

2018-03-06T21:25:47Z

Admin: Die Seite wurde neu angelegt: „Biliothek:ws“

[[Biliothek:ws]]

Datei:EntwurfFunktionsweiseApo.jpg

2018-03-06T21:23:34Z

Admin:

Funktionsweise

2018-03-06T21:23:20Z

Admin: Die Seite wurde neu angelegt: „Die Konzeption des Szenarios ''Apotheken-Verbund'' ist in der nachfolgenden Abbildung ersichtlich. Datei:EntwurfFunktionsweiseApo.jpg|600px|thumb|left|erste…“

Die Konzeption des Szenarios ''Apotheken-Verbund'' ist in der nachfolgenden Abbildung ersichtlich.
[[Datei:EntwurfFunktionsweiseApo.jpg|600px|thumb|left|erste Skizze]]

Datei:UI2.png

2018-03-06T21:22:40Z

Admin:

Datei:UI1.png

2018-03-06T21:22:20Z

Admin:

Benutzer-Oberfläche

2018-03-06T21:21:58Z

Admin: Die Seite wurde neu angelegt: „== Szenario 1 == Datei:UI1.png Benutzer-Oberfläche für das Szenario ''Apotheken-Verbund'' == Szenario 2 == Datei:UI2.png Benutzer-Oberfläche f…“

== Szenario 1 ==

[[Datei:UI1.png]]

Benutzer-Oberfläche für das Szenario ''Apotheken-Verbund''

== Szenario 2 ==

[[Datei:UI2.png]]

Benutzer-Oberfläche für das Szenario ''Video-Wand''

Architektur

2018-03-06T21:20:38Z

Admin: Die Seite wurde neu angelegt: „Die Webapplikation besteht aus folgenden Komponenten: * Statischer Webseiteninhalt (HTML/PHP) inklusive WebRTC-Komponenten * Verweis auf SIP-JavaScript-Bibliot…“

Die Webapplikation besteht aus folgenden Komponenten:
* Statischer Webseiteninhalt (HTML/PHP) inklusive WebRTC-Komponenten
* Verweis auf SIP-JavaScript-Bibliothek
* JavaScript Programmlogik
* [[Code:CSS|CSS]]-Stylevorlagen

Serverseitig sind folgende Komponenten nötig:
* [[Konfiguration:Webserver|Webserver]] mit aktiviertem TLS-Support (HTTPS)
* [[Konfiguration:WebSocket-Server|WebSocket-Server]] mit aktiviertem TLS-Support (WSS)

Hauptseite

2018-03-06T21:20:09Z

Admin: /* Administratives */

<div
style="text-align: center; margins: 1em; font-size: 3em; color: #444; border-bottom: 0.15em solid #ccc; background: #eee;">
Willkommen im Wiki von sipRTC
</div>

== Übersicht ==

Das Projekt '''sipRTC''' wurde im Rahmen einer Masterarbeit ins Leben gerufen.

Es soll ein auf dem [[Session Initiation Protocol (SIP)]] basiertes [[WebRTC]]-Framework bieten, welches Open Source zur Verfügung gestellt werden soll.
Während der Masterarbeit wurden die Kenntnisse zu [[JavaScript]] vertieft und insbesondere das Programm [[Node.js]] angeschaut.

Die [[Aufgabenstellung]] der Masterarbeit besteht darin, eine funktionierende Demo-Infrastruktur aufzubauen. Es sollen jedoch auch Überlegungen dazu angestellt werden, wie eine produktive Umgebung betrieben werden müsste.

Damit ist diese Arbeit eine Weiterführung des Projekts ''WebRTC'' im Herbstsemester 2015.

== Administratives ==

Erstmalig während des Studiums wird ein Wiki als Wissens-Ablage verwendet.

Die einzelnen [[Projektschritte]] werden ebenfalls in diesem Wiki erfasst.

== Planung ==
*[[Aufgabenstellung#Analyse|Analyse]] der Aufgabenstellung
*[[Architektur]]
*[[Benutzer-Oberfläche]]
*[[Funktionsweise]]

== Umsetzung ==
* [[:Category:Bibliothek|Bibliotheken]]
* [[:Category:Code|Code]]
* [[:Category:Konfiguration|Server-Konfiguration]]

Bootstrap

2018-03-06T21:19:24Z

Admin: Die Seite wurde neu angelegt: „ == Weblinks == [http://getbootstrap.com/ Offizielle Website von Bootstrap]“

== Weblinks ==
[http://getbootstrap.com/ Offizielle Website von Bootstrap]

M9

2018-03-06T21:19:09Z

Admin: Die Seite wurde neu angelegt: „Informationen zur diensthabenden Notfall-Apotheke sind unter folgender URL abrufbar: [http://www.notfall.apotheke-chur.ch/ http://www.notfall.apotheke-chur.ch]…“

Informationen zur diensthabenden Notfall-Apotheke sind unter folgender URL abrufbar: [http://www.notfall.apotheke-chur.ch/ http://www.notfall.apotheke-chur.ch]. Der HTML-Code der Website wurde grösstenteils kopiert. Auf dieser Basisseite aufbauend wurde der Video-Chat integriert.

Dabei wurde das [[Bootstrap]]-Framework verwendet.

M8

2018-03-06T21:18:39Z

Admin: Die Seite wurde neu angelegt: „== Umsetzung Variante 1 == === Server === Der untenstehende Code ist leicht abgeändert, da für die Konfiguration für einen sicheren WebSocket-Server noch…“

== Umsetzung Variante 1 ==

=== Server ===
Der untenstehende Code ist leicht abgeändert, da für die Konfiguration für einen sicheren WebSocket-Server noch weiterer Code nötig ist.
<syntaxhighlight lang="js" line>
var calleeReady = false;

var WebSocketServer = require('ws').Server
, wss = new WebSocketServer({ port: 4001 });

wss.on('connection', function connection(ws) {
ws.on('message', function message(data) {
if (data == 'calleeReady') {
calleeReady = true;
} else if (data == 'calleeBusy') {
calleeReady = false;
} else if (data == 'stateRequest') {
if (calleeReady) {
ws.send('calleeReady')
} else {
ws.send('calleeBusy')
}
}

// Broadcast to everyone else.
wss.clients.forEach(function each(client) {
if (client !== ws) {
client.send(data);
}
});
});
});
</syntaxhighlight>

=== Browser Apotheke ===
<syntaxhighlight lang="js" line>
var connection = new WebSocket('wss://pbx.prbox.biz:4001');

// When the connection is open, send some data to the server
connection.onopen = function () {
connection.send('Ping'); // Send the message 'Ping' to the server
};

connection.onclose = function() {
connection.send('calleeBusy');
}

var userAgent = new SIP.UA( {
// ... configuration of SIP UA
})

userAgent.on('connected', function() {
connection.send('calleeReady');
// rest of code when UA is connected to WSS
})

userAgent.on('disconnected', function() {
connection.send('calleeBusy');
// rest of code when UA is disconnected to WSS
})

userAgent.on('invite', function(session) {
connection.send('calleeBusy');
// rest of code when INVITE is received
});

window.onunload = function() {
connection.send('calleeBusy');
}
</syntaxhighlight>

=== Browser Besucher===
<syntaxhighlight lang="js" line>
<p>
<input id="calleeState" />
</p>

var connection = new WebSocket('wss://pbx.prbox.biz:4001');

connection.onopen = function () {
connection.send('stateRequest'); // Request state of callee
};

connection.onmessage = function (e) {
if (e.data == 'calleeReady') {
$('#calleeState').val('Callee Ready');
$('#calleeState').css("background-color", "#0F0");
} else if (e.data == 'calleeBusy') {
$('#calleeState').val('Callee Busy');
$('#calleeState').css("background-color", "#F00");
}
};
</syntaxhighlight>

M7

2018-03-06T21:18:04Z

Admin: Die Seite wurde neu angelegt: „Die bisherigen Implementation für einen WebSocket-Server setzten die Bibliothek ws für Node.JS ein. Die Konfiguration des Servers wurde so…“

Die bisherigen Implementation für einen WebSocket-Server setzten die Bibliothek [[Bibliothek:ws|ws]] für Node.JS ein. Die Konfiguration des Servers wurde so festgelegt, dass der Server alle eingehenden Nachrichten transparent an die anderen verbundenen WebSocket-Clients weiterleitet. Dies führt dazu, dass auch weitere Clients sämtliche Kommunikation ''mithören'' können. Der Server verfügt demnach über keine "Intelligenz" und weiss nicht, in welchem Zustand sich eine Session befindet.

Im Falle des Szenarios ''Apotheke'' soll beispielsweise einem zweiten Website-Besucher mitgeteilt werden, dass sich die Apotheke bereits in einem Gespräch befindet. Es wird also eine Komponente benötigt, welche den Zustand der involvierten Clients überwacht und an die Website weitermelden kann.

== Variante 1: zusätzlicher WebSocket für Präsenzanzeige ==
Ein zusätzlicher WebSocket-Server kann verwendet werden um den Zustand des Apotheken-Browsers zu überwachen. Über einen zweiten WebSocket-Kanal signalisiert der WebSocket-Server dem Client, ob eine Gesprächsverbindung möglich ist. Dabei werden keine SIP-Meldungen gesendet, sondern benutzerdefinierte Nachrichten.

Auf dem Server wird die Variable ''calleeReady'' geführt. Sobald sich der Apothekenbrowser am Server anmeldet, wird die Variable auf '''true''' gesetzt. Sobald ein eingehender Anruf angenommen wird, wechselt sie während der Dauer des Gesprächs auf '''false'''.

Der Status der Variable wird jeweils bei derer Veränderung an alle verbundenen Clients weitergeleitet. Auf Anfrage eines Clients (z.B. Anmelden eines weiteren Clients) kann der aktuelle Status ebenfalls mitgeteilt werden.

Umsetzung in [[M9]]

== Variante 2: SIP-Server ==
Bei dieser Variante würde die [[Session Initiation Protocol (SIP)|SIP]]-Client-Implementation mit '''Subscriptions''' und dem SIP-Request ''SUBSCRIBE'' erweitert werden. Dabei erfolgt eine Anmeldung für ein Ereignis wie z.B. eine Präsenzanzeige. Die Anmeldung wird von einem SIP-Server verarbeitet, welcher Ereignisse mittels dem SIP-Request ''NOTIFY'' an angemeldete Clients meldet.

Durch die Benutzung eines SIP-Servers wäre auch eine Integration in ein öffentliches SIP-Netzwerk möglich.

=== Serverseitig ===

Das RFC 6665 beschreibt den Mechanismus von SUBSCRIBE/NOTIFY im Allgemeinen:

''The SUBSCRIBE method is used to request current state and state updates from a remote node.''

''NOTIFY requests are sent to inform subscribers of changes in state to which the subscriber has a subscription. Subscriptions are created using the SUBSCRIBE method.''

In [https://tools.ietf.org/html/rfc3856 RFC 3856] wird erläutert, wie Präsenz-Ereignisse in SIP übertragen werden können:

<syntaxhighlight lang="http" line>
SUBSCRIBE sip:resource@example.com SIP/2.0
Via: SIP/2.0/TCP watcherhost.example.com;branch=z9hG4bKnashds7
To: <sip:resource@example.com>
From: <sip:user@example.com>;tag=xfg9
Call-ID: 2010@watcherhost.example.com
CSeq: 17766 SUBSCRIBE
Max-Forwards: 70
Event: presence
Accept: application/pidf+xml
Contact: <sip:user@watcherhost.example.com>
Expires: 600
Content-Length: 0
</syntaxhighlight>

<syntaxhighlight lang="http" line>
NOTIFY sip:user@watcherhost.example.com SIP/2.0
Via: SIP/2.0/TCP server.example.com;branch=z9hG4bKna998sk
From: <sip:resource@example.com>;tag=ffd2
To: <sip:user@example.com>;tag=xfg9
Call-ID: 2010@watcherhost.example.com
Event: presence
Subscription-State: active;expires=599
Max-Forwards: 70
CSeq: 8775 NOTIFY
Contact: sip:server.example.com
Content-Type: application/pidf+xml
Content-Length: ...

[PIDF Document]
</syntaxhighlight>

Der Inhalt eines ''PIDF Document'' ist im [https://tools.ietf.org/html/rfc3863 RFC 3863] festgehalten. Es handelt sich dabei um XML-codierte Statusinformationen.

=== Clientseitig ===
Die Implementierung soll anhand von Beispielcode der Bibliothek SIP.JS gezeigt werden.

<syntaxhighlight lang="js" line>
// Subscribes the existing UA to the presence information of resource@example.com
var subscription = myUA.subscribe('resource@example.com', 'presence');

// Once subscribed, receive notifications and print out the presence information to console
subscription.on('notify', function (notification) {
console.log(notification.request.body);
});
</syntaxhighlight>

[https://groups.google.com/forum/#!topic/sip_js/CkVQb9mR5jI SIP PUBLISH (presence)]

M3

2018-03-06T21:17:16Z

Admin: Die Seite wurde neu angelegt: „= Erweiterung Chat um Räume = Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche…“

= Erweiterung Chat um Räume =
Das bestehende System soll nun ausgebaut werden, um ''Räume'' zu unterstützen. Damit sind mehrere Verbindungen gemeint, welche parallel geführt werden können.
Die fertige Anwendung ist [https://pbx.prbox.biz/sipRTC/socketio-rooms.html hier] abrufbar.

Bevor Nachrichten gesendet werden können, muss zuerst ein Raum ausgewählt werden. Pro Raum sind nur zwei Teilnehmer zulässig. Ein dritter Teilnehmer erhält eine Warnung, dass der gewählte Raum schon voll ist.

Teile des Programmcodes stammen von der WebRTC-Demo-Applikation von Lukas Toggenburger.

== Programm-Code ==

=== Serverseitig ===
<syntaxhighlight lang="javascript" line>
var counts = {};

io.on('connection', function(socket) {

socket.on('disconnect', function() {
if (typeof socket.session != "undefined") {
socket.broadcast.to(socket.session).emit('message', {
type : 'leave',
session : socket.session
});
counts[socket.session] = 0;
}
});

socket.on('join', function(session) {
if (typeof counts[session] == "undefined") {
console.log("DEBUG: session = " + session
+ " used for the first time");
counts[session] = 0;
}

var numClients = counts[session];

if (numClients === 0) {
socket.join(session);
socket.session = session;
socket.emit('caller', session);
counts[session]++;
} else if (numClients === 1) {
socket.join(session);
socket.session = session;
socket.emit('callee', session);
counts[session]++;
socket.broadcast.to(session).emit('calleeHasJoined', session);
} else {
socket.emit('full', session);
}

console.log("DEBUG: counts = " + JSON.stringify(counts));
});

socket.on('chat message', function(msg) {
console.log('message: msg = ' + JSON.stringify(msg));
console.log("onmessage: counts = " + JSON.stringify(counts));
socket.broadcast.to(socket.session).emit('chat message', msg);
});

});
</syntaxhighlight>

=== Clientseitig ===
<syntaxhighlight lang="html" line>
<ul id="messages"></ul>

<form action="" id="formJoin">
<input type="text" id="room" size="24" maxlength="24"
value="Kanalnummer"
onblur="if (this.value == '') {this.value = 'Kanalnummer';}"
onfocus="if (this.value == 'Kanalnummer') {this.value = '';}" />
<button id="connectButton">Verbinden</button>
</form>

<form action="" id="formSend">
<input id="m" autocomplete="off" disabled="disabled" />
<button id="sendMessage" disabled="disabled">Senden</button>
</form>

<script>
var isRoomJoined = false;
var socket = io.connect('https://pbx.prbox.biz:3001');
$('#formSend').submit(function() {
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
$('#formJoin').submit(function() {
joinRoom();
return false;
});
socket.on('chat message', function(msg) {
$('#messages').append($('<li>').text(msg));
});
socket.on('full', function(msg) {
window.alert("Room is already full!");
isRoomJoined = false;
document.getElementById('m').disabled = 'disabled';
document.getElementById('sendMessage').disabled = 'disabled';
});
function joinRoom() {
if (isRoomJoined == false) {
console.log("Raum wird beigetreten...");
isRoomJoined = true;
document.getElementById('m').disabled = false;
document.getElementById('sendMessage').disabled = false;
document.getElementById('room').disabled = 'disabled';
document.getElementById('connectButton').disabled = 'disabled';
socket.emit('join',
document.getElementById('room').value);
}
}
</script>
</syntaxhighlight>

M2

2018-03-06T21:16:29Z

Admin: Die Seite wurde neu angelegt: „= Chat-Test-System mit socket.io = Um socket.io heranzutasten kennen zu lernen, wurde eine Chat-Demo-Anwendung aus dem Abschnitt [http://socket.io/get-started/…“

= Chat-Test-System mit socket.io =
Um socket.io heranzutasten kennen zu lernen, wurde eine Chat-Demo-Anwendung aus dem Abschnitt [http://socket.io/get-started/ Get Started] der socket.io-Dokumentation aufgebaut.
Die fertige Anwendung ist [https://pbx.prbox.biz/sipRTC/socketio-simple.html hier] abrufbar.

Jeder Client, der sich mit der Anwendung verbindet, sieht die Nachrichten der anderen Teilnehmer. Es gibt keine Beschränkung der Anzahl Benutzer im Chat.

== Programm-Code ==

=== Serverseitig ===
<syntaxhighlight lang="javascript" line>
io.on('connection', function(socket){
console.log('a user connected');
socket.on('disconnect', function(){
console.log('user disconnected');
});
socket.on('chat message', function(msg){
io.emit('chat message', msg);
console.log('message:' + msg);
});
});
</syntaxhighlight>

=== Clientseitig ===
<syntaxhighlight lang="html" line>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" />
<button>Senden</button>
</form>

<script>
var socket = io.connect('https://pbx.prbox.biz:3000');
$('form').submit(function() {
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
socket.on('chat message', function(msg) {
$('#messages').append($('<li>').text(msg));
});
</script>
</syntaxhighlight>

Projektschritte

2018-03-06T21:15:51Z

Admin: Die Seite wurde neu angelegt: „{| class="wikitable" |- ! Schritt !! Name !! Beschreibung !…“

{| class="wikitable"
|-
! Schritt !! Name !! Beschreibung !! Stand der Arbeit
|-
| [[JavaScript|M1]] || Aneignung Kenntnisse JavaScript || Vertiefung der Kenntnisse über Programmierung || ... laufend ...
|-
| [[M2]] || Chat-Test-System mit Node.JS (socket.io) || Um Node.JS kennen zu lernen, soll ein Testchat erstellt werden || erstellt: [https://pbx.prbox.biz/sipRTC/socketio-simple.html] (18.11.2016)
|-
| [[M3]] || Erweiterung Chat um Räume || Testchat soll um die Funktionalität von ''Räumen'' erweitert werden || erstellt: [https://pbx.prbox.biz/sipRTC/socketio-rooms.html] (01.12.2016)
|-
| [[M4]] || Implementation IM mit ws-Bibliothek || Wechsel von socket.io auf die Bibliothek '''ws''' || erstellt: [https://pbx.prbox.biz/sipRTC/ws-sipim-alice.html Alice] [https://pbx.prbox.biz/sipRTC/ws-sipim-bob.html Bob] (05.12.2016)
|-
| [[M5]] || Implementation A/V mit ws-Bibliothek || Die Bibliothek '''ws''' wird nun verwendet, um eine Audio/Video-Lösung zu erstellen. || erstellt: [https://pbx.prbox.biz/sipRTC/ws-sipav-alice.html Alice] [https://pbx.prbox.biz/sipRTC/ws-sipav-bob.html Bob] (07.12.2016)
|-
| [[M6]] || A/V und IM mit ws-Bibliothek und sip.js || Gesamte Lösung mit Audio, Video und IM-Chat || erstellt: [https://pbx.prbox.biz/sipRTC/ws-sip-alice.html Alice] [https://pbx.prbox.biz/sipRTC/ws-sip-bob.html Bob] (13.12.2016)
|-
| [[M7]] || Analyse ''zweiter Anruf'' || Was ist nötig, um einem zweiten Kunden zu signalisieren, dass die Apotheke bereits in einem Gespräch ist. || erstellt
|-
| [[M8|(M8)]] || Optional: Lösungsumsetzung M7 || Eine Lösung für die Analyse gemäss [[M7]] soll entwickelt werden. || erstellt: [https://pbx.prbox.biz/sipRTC/ws-sip-pres-alice.html Alice] [https://pbx.prbox.biz/sipRTC/ws-sip-pres-bob.html Bob] (28.12.2016)
|-
| [[M9]] || UI Demo-Applikation || Demo-Applikation in einem Kontext entwerfen (Ansicht einer Apotheken-Website) || erstellt: [https://pbx.prbox.biz/sipRTC/demo-apotheke.html Apotheke] [https://pbx.prbox.biz/sipRTC/demo-kunde.html Kunde] (16.01.2016)
|-
| [[M10|(M10)]] || Optional: Integration in ein Kommunikationsnetz || Es sollen Überlegungen und eventuell eine Umsetzung erfolgen, um das System in ein öffentliches Kommunikationsnetz einzubinden. || noch nicht begonnen

|}

Aufgabenstellung

2018-03-06T21:15:15Z

Admin: Die Seite wurde neu angelegt: „Es soll eine funktionierende Demo-Umgebung aufgebaut werden, mit welcher Peer-to-Peer-Audio/Video-Verbindungen zwischen zwei Teilnehmern möglich sind. Die W…“

Es soll eine funktionierende Demo-Umgebung aufgebaut werden, mit welcher Peer-to-Peer-Audio/Video-Verbindungen zwischen zwei Teilnehmern möglich sind. Die [[WebRTC]]-Lösung, bei welcher die beiden Teilnehmer unterstützte Webbrowser sind, soll das [[Session Initiation Protocol (SIP)|SIP]]-Protokoll als Signalisierungsprotokoll verwenden.

Für die Demo-Umgebung sollen im Rahmen der Masterarbeit folgende beiden Szenarien berücksichtigt werden:

* '''Apotheken-Verbund:''' Die teilnehmenden Apotheken eines Apotheken-Verbundes wechseln regelmässig die Pikett-Bereitschaftszeit. Ein Kunde soll die Website des Apotheken-Verbundes aufrufen und per Knopfdruck mit der diensthabenden Apotheke verbunden werden können (Statischer Client A, dynamischer Client B).
* '''Video-Wand:''' Ein Thinktank verfügt über zwei Standorte mit je einer Cafeteria. Mittels einer Kamera soll jede Cafeteria ''virtuell erweitert'' werden, indem ein Beamer das Bild des jeweilig anderen Standortes projiziert wird (sowohl Client A als auch Client B sind statisch).

'''Vertiefung:''' Diese Szenarien sollten nach Möglichkeit nicht nur im Labor, sondern auch unter realen Voraussetzungen durchführbar sein.
Welche Einflüsse auf das Konzept und die Realisierung haben allgemeine Anwendungsszenarien beispielsweise auf die Elemente einer SIP-Nachricht.

'''Erweiterte Ziele:''' Während Zwischenbesprechungen wurden weitere Ziele definiert:
* Im Falle des Apotheken-Szenarios soll einem zweiten Besucher angezeigt werden, ob sich die Apotheke bereits in einem Gespräch befindet. Hierbei steht die Analyse im Vordergrund, eine Umsetzung ist optional.
* Die entworfene Demo-Applikation soll in den Kontext des Apotheken-Szenarios gebracht werden. Die Benutzeroberfläche soll entsprechend gestaltet werden.
* Es sollen Überlegungen und eventuell eine Umsetzung erfolgen, um das System in ein öffentliches Kommunikationsnetz einzubinden.

== Analyse ==
Die Demo-Umgebung wird erstmals mit privater Infrastruktur aufgebaut.

Node Package Manager

2018-03-06T21:14:48Z

Admin: Die Seite wurde neu angelegt: „= Pakete = * '''rtc.io'''. Dokumentation: [https://www.npmjs.com/package/rtc]“

= Pakete =
* '''rtc.io'''. Dokumentation: [https://www.npmjs.com/package/rtc]

Node.js

2018-03-06T21:14:29Z

Admin: Die Seite wurde neu angelegt: „Paketinstallations-Tool: Node Package Manager. Auf dem Server, auf welchem Node.js betrieben wird, ist ein Tool namens ''forever'' installiert, mit welche…“

Paketinstallations-Tool: [[Node Package Manager]].

Auf dem Server, auf welchem Node.js betrieben wird, ist ein Tool namens ''forever'' installiert, mit welchem man Node.js-Applikationen als Daemon im Hintergrund ausgeführt werden können. Das Starten oder Stoppen der Applikationen erfolgt mit:
forever start app.js
forever stop app.js

== Literatur ==

* Node.js offizielle Website [https://nodejs.org/en/]

JQuery

2018-03-06T21:13:57Z

Admin: Die Seite wurde neu angelegt: „ == Code-Abschnitte == Verändert den Wert des Objekts mit der ID ''state'' auf '''connecting''': <syntaxhighlight lang="javascript"> $('#state').val('connecti…“

== Code-Abschnitte ==
Verändert den Wert des Objekts mit der ID ''state'' auf '''connecting''':
<syntaxhighlight lang="javascript">
$('#state').val('connecting');
</syntaxhighlight>

Verändert den CSS-Stil des Objekt mit der ID ''state'':
<syntaxhighlight lang="javascript">
$('#state').css("background-color", "#FF0");
</syntaxhighlight>

== Weblinks ==
* [https://jquery.com/ jQuery]

JavaScript

2018-03-06T21:13:38Z

Admin: Die Seite wurde neu angelegt: „Für die Erarbeitung von JavaScript-Wissen, wurde hauptsächlich die Website [http://eloquentjavascript.net/ Eloquent JavaScript] konsultiert. Auf dieser Seit…“

Für die Erarbeitung von JavaScript-Wissen, wurde hauptsächlich die Website [http://eloquentjavascript.net/ Eloquent JavaScript] konsultiert.

Auf dieser Seite werden die relevantesten Erkenntnisse erfasst. Für Erkenntnisse in einem Bereich einer Bibliothek, sind die informationen in den entsprechenden Artikeln zu finden:

* [[jQuery]]

JavaScript Session Establishment Protocol (JSEP)

2018-03-06T21:13:09Z

Admin: Die Seite wurde neu angelegt: „Die folgende Abbildung entstammt aus dem Internet-Draft von JSEP und zeigt das Signalisierungs-Modell von entsprechenden Applikationen. +-----------+…“

Die folgende Abbildung entstammt aus dem Internet-Draft von JSEP und zeigt das Signalisierungs-Modell von entsprechenden Applikationen.

+-----------+ +-----------+
| Web App |<--- App-Specific Signaling -->| Web App |
+-----------+ +-----------+
^ ^
| SDP | SDP
V V
+-----------+ +-----------+
| Browser |<----------- Media ------------>| Browser |
+-----------+ +-----------+

== Literatur ==
* [https://datatracker.ietf.org/doc/draft-ietf-rtcweb-jsep/?include_text=1 Definition von JSEP des IETF] (Draft)

WebRTC

2018-03-06T21:12:26Z

Admin: Die Seite wurde neu angelegt: „== Architektur == WebRTC besteht im Wesentlichen aus folgenden drei APIs mit den nachfolgenden Funktionen: * '''MediaStream''': bietet Zugriff auf lokale R…“

== Architektur ==
WebRTC besteht im Wesentlichen aus folgenden drei APIs mit den nachfolgenden Funktionen:
* '''[[MediaStream]]''': bietet Zugriff auf lokale Ressourcen wie Mikrofon und Kamera.
* '''[[RTCPeerConnection]]''': stellt die Verbindung zwischen den Peers sicher.
* '''[[RTCDataChannel]]''': bietet die Möglichkeit, Text- oder binäre (nicht audiovisuelle) Nachrichten auszutauschen.

Das Modell, welches einer JavaScript-Applikation erlaubt, die Signalisierung einer Multimedia-Sitzung mit der [[RTCPeerConnection]] API zu realisieren nennt sich [[JavaScript Session Establishment Protocol (JSEP)]]. Dabei ist das Protokoll dieser Signalisierung nicht festgelegt. Ein Entwickler kann für seine Applikation selber entscheiden, ob er das [[Session Initiation Protocol (SIP)]], XMPP oder ein anderes Protokoll verwenden möchte.

== Weblinks ==
* Getting Started (WebRTC.org) [https://webrtc.org/start/]
* Getting Started with WebRTC (HTML5rocks) [https://www.html5rocks.com/en/tutorials/webrtc/basics/]
* WebRTC Signaling Concepts [https://www.webrtc-experiment.com/docs/WebRTC-Signaling-Concepts.html]
* WebRTC in the real world: STUN, TURN and signaling [https://www.html5rocks.com/en/tutorials/webrtc/infrastructure/]
* The term 'signaling' in WebRTC [https://www.webrtc-experiment.com/docs/WebRTC-Signaling-Concepts.html]
* WebRTC Google Codelab [https://codelabs.developers.google.com/codelabs/webrtc-web/]
* WebRTC-Plugin für Internet Explorer [https://confluence.temasys.com.sg/display/TWPP]

== Literatur ==

* Wikipedia-Seite zu WebRTC [https://de.wikipedia.org/wiki/WebRTC]

Session Initiation Protocol (SIP)

2018-03-06T21:11:50Z

Admin: Die Seite wurde neu angelegt: „== Verwendung von SIP in diesem Projekt == SIP wurde als Signalisierungsprotokoll gewählt, da es es sich um ein frei zugängliches, in der Industrie jedoch de…“

== Verwendung von SIP in diesem Projekt ==
SIP wurde als Signalisierungsprotokoll gewählt, da es es sich um ein frei zugängliches, in der Industrie jedoch dennoch oft verwendetes Protokoll handelt.

Im Rahmen dieser Arbeit stellt das RFC 7118 '''The WebSocket Protocol as a Transport for the Session Initiation Protocol (SIP)''' eine wichtige Komponente dar. Dieses Dokument erläutert, wie SIP über das [[WebSockets|WebSocket-Protokoll]] signalisiert werden kann.

== Erweiterungen ==
* [https://tools.ietf.org/html/rfc5626 RFC 5626 (Outbound)]
* [https://tools.ietf.org/html/rfc5627 RFC 5627 (GRUU)]
* [https://tools.ietf.org/html/rfc6665 RFC 6665 (SIP-Specific Event Notification)]
* [https://tools.ietf.org/html/rfc3856 RFC 3856 (Presence)]

== JavaScript SIP-Clients ==
* [https://www.doubango.org/sipml5/ '''sipML5''']. Quelle auf [https://github.com/DoubangoTelecom/sipml5 GitHub]
** [https://www.doubango.org/sipml5/docgen/index.html?svn=200#sendMessage send SMS style message]
* [http://jssip.net/ '''jssip''']. Quelle auf [https://github.com/versatica/JsSIP GitHub]
* [http://sipjs.com '''SIP.js''']. Quelle auf [https://github.com/onsip/sip.js GitHub]
* [http://jscommunicator.org/ '''JSCommunicator'''] Quelle auf [https://github.com/opentelecoms-org/jscommunicator GitHub]

== Proxies mit WebSocket-Unterstützung ==

* [http://oversip.net/ '''OverSIP''']. Quelle auf [https://github.com/versatica/OverSIP GitHub]
* [https://www.resiprocate.org '''reSIProcate'''] / [https://www.resiprocate.org/About_Repro '''repro''']
** [http://rtcquickstart.org/guide/multi/sip-proxy-repro.html repro konfigurieren]
* [https://www.kamailio.org/ '''Kamailio''']
* [http://www.asterisk.com '''Asterisk'''] [https://wiki.asterisk.org/wiki/display/AST/WebRTC+tutorial+using+SIPML5]

== Literatur ==

* Wikipedia-Seite zu SIP [https://de.wikipedia.org/wiki/Session_Initiation_Protocol]
* RFC 3261 [https://tools.ietf.org/html/rfc3261]

Hauptseite

2018-03-06T21:10:47Z

Admin:

<div
style="text-align: center; margins: 1em; font-size: 3em; color: #444; border-bottom: 0.15em solid #ccc; background: #eee;">
Willkommen im Wiki von sipRTC
</div>

== Übersicht ==

Das Projekt '''sipRTC''' wurde im Rahmen einer Masterarbeit ins Leben gerufen.

Es soll ein auf dem [[Session Initiation Protocol (SIP)]] basiertes [[WebRTC]]-Framework bieten, welches Open Source zur Verfügung gestellt werden soll.
Während der Masterarbeit wurden die Kenntnisse zu [[JavaScript]] vertieft und insbesondere das Programm [[Node.js]] angeschaut.

Die [[Aufgabenstellung]] der Masterarbeit besteht darin, eine funktionierende Demo-Infrastruktur aufzubauen. Es sollen jedoch auch Überlegungen dazu angestellt werden, wie eine produktive Umgebung betrieben werden müsste.

Damit ist diese Arbeit eine Weiterführung des Projekts ''WebRTC'' im Herbstsemester 2015.

== Administratives ==

Erstmalig während des Studiums wird ein Wiki als Wissens-Ablage verwendet.

Die einzelnen [[Projektschritte]] werden ebenfalls in diesem Wiki erfasst.

Die alte Hauptseite ist auf der Seite [[Starthilfe]] zu finden.

== Planung ==
*[[Aufgabenstellung#Analyse|Analyse]] der Aufgabenstellung
*[[Architektur]]
*[[Benutzer-Oberfläche]]
*[[Funktionsweise]]

== Umsetzung ==
* [[:Category:Bibliothek|Bibliotheken]]
* [[:Category:Code|Code]]
* [[:Category:Konfiguration|Server-Konfiguration]]