
15 changed files with 223 additions and 11031 deletions
@ -1,11 +1,16 @@ |
|||
module github.com/Monibuca/plugin-webrtc |
|||
module github.com/Monibuca/plugin-webrtc/v3 |
|||
|
|||
go 1.13 |
|||
|
|||
require ( |
|||
github.com/Monibuca/engine/v2 v2.2.5 |
|||
github.com/Monibuca/plugin-gb28181 v1.0.5 // indirect |
|||
github.com/Monibuca/engine/v3 v3.0.0 |
|||
github.com/Monibuca/plugin-rtp v1.0.0 |
|||
github.com/pion/rtcp v1.2.1 |
|||
github.com/pion/webrtc/v2 v2.2.14 |
|||
github.com/Monibuca/utils/v3 v3.0.0-alpha2 |
|||
github.com/pion/rtcp v1.2.6 |
|||
github.com/pion/webrtc/v3 v3.0.4 |
|||
github.com/shirou/gopsutil v2.20.8+incompatible // indirect |
|||
) |
|||
|
|||
replace github.com/Monibuca/engine/v3 v3.0.0 => ../engine |
|||
|
|||
replace github.com/Monibuca/utils/v3 => ../utils |
|||
|
@ -1,19 +0,0 @@ |
|||
<meta charset="utf-8"> |
|||
<title>plugin-webrtc demo</title> |
|||
<script src="https://unpkg.com/vue"></script> |
|||
<script src="./plugin-webrtc.umd.js"></script> |
|||
|
|||
<link rel="stylesheet" href="./plugin-webrtc.css"> |
|||
|
|||
|
|||
<div id="app"> |
|||
<demo></demo> |
|||
</div> |
|||
|
|||
<script> |
|||
new Vue({ |
|||
components: { |
|||
demo: plugin-webrtc |
|||
} |
|||
}).$mount('#app') |
|||
</script> |
@ -1,584 +0,0 @@ |
|||
module.exports = |
|||
/******/ (function(modules) { // webpackBootstrap
|
|||
/******/ // The module cache
|
|||
/******/ var installedModules = {}; |
|||
/******/ |
|||
/******/ // The require function
|
|||
/******/ function __webpack_require__(moduleId) { |
|||
/******/ |
|||
/******/ // Check if module is in cache
|
|||
/******/ if(installedModules[moduleId]) { |
|||
/******/ return installedModules[moduleId].exports; |
|||
/******/ } |
|||
/******/ // Create a new module (and put it into the cache)
|
|||
/******/ var module = installedModules[moduleId] = { |
|||
/******/ i: moduleId, |
|||
/******/ l: false, |
|||
/******/ exports: {} |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // Execute the module function
|
|||
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); |
|||
/******/ |
|||
/******/ // Flag the module as loaded
|
|||
/******/ module.l = true; |
|||
/******/ |
|||
/******/ // Return the exports of the module
|
|||
/******/ return module.exports; |
|||
/******/ } |
|||
/******/ |
|||
/******/ |
|||
/******/ // expose the modules object (__webpack_modules__)
|
|||
/******/ __webpack_require__.m = modules; |
|||
/******/ |
|||
/******/ // expose the module cache
|
|||
/******/ __webpack_require__.c = installedModules; |
|||
/******/ |
|||
/******/ // define getter function for harmony exports
|
|||
/******/ __webpack_require__.d = function(exports, name, getter) { |
|||
/******/ if(!__webpack_require__.o(exports, name)) { |
|||
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); |
|||
/******/ } |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // define __esModule on exports
|
|||
/******/ __webpack_require__.r = function(exports) { |
|||
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
|||
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
|||
/******/ } |
|||
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // create a fake namespace object
|
|||
/******/ // mode & 1: value is a module id, require it
|
|||
/******/ // mode & 2: merge all properties of value into the ns
|
|||
/******/ // mode & 4: return value when already ns object
|
|||
/******/ // mode & 8|1: behave like require
|
|||
/******/ __webpack_require__.t = function(value, mode) { |
|||
/******/ if(mode & 1) value = __webpack_require__(value); |
|||
/******/ if(mode & 8) return value; |
|||
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; |
|||
/******/ var ns = Object.create(null); |
|||
/******/ __webpack_require__.r(ns); |
|||
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); |
|||
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); |
|||
/******/ return ns; |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|||
/******/ __webpack_require__.n = function(module) { |
|||
/******/ var getter = module && module.__esModule ? |
|||
/******/ function getDefault() { return module['default']; } : |
|||
/******/ function getModuleExports() { return module; }; |
|||
/******/ __webpack_require__.d(getter, 'a', getter); |
|||
/******/ return getter; |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // Object.prototype.hasOwnProperty.call
|
|||
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; |
|||
/******/ |
|||
/******/ // __webpack_public_path__
|
|||
/******/ __webpack_require__.p = ""; |
|||
/******/ |
|||
/******/ |
|||
/******/ // Load entry module and return exports
|
|||
/******/ return __webpack_require__(__webpack_require__.s = "fb15"); |
|||
/******/ }) |
|||
/************************************************************************/ |
|||
/******/ ({ |
|||
|
|||
/***/ "2029": |
|||
/***/ (function(module, exports, __webpack_require__) { |
|||
|
|||
// extracted by mini-css-extract-plugin
|
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "8875": |
|||
/***/ (function(module, exports, __webpack_require__) { |
|||
|
|||
var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;// addapted from the document.currentScript polyfill by Adam Miller
|
|||
// MIT license
|
|||
// source: https://github.com/amiller-gh/currentScript-polyfill
|
|||
|
|||
// added support for Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1620505
|
|||
|
|||
(function (root, factory) { |
|||
if (true) { |
|||
!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory), |
|||
__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ? |
|||
(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__), |
|||
__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); |
|||
} else {} |
|||
}(typeof self !== 'undefined' ? self : this, function () { |
|||
function getCurrentScript () { |
|||
if (document.currentScript) { |
|||
return document.currentScript |
|||
} |
|||
|
|||
// IE 8-10 support script readyState
|
|||
// IE 11+ & Firefox support stack trace
|
|||
try { |
|||
throw new Error(); |
|||
} |
|||
catch (err) { |
|||
// Find the second match for the "at" string to get file src url from stack.
|
|||
var ieStackRegExp = /.*at [^(]*\((.*):(.+):(.+)\)$/ig, |
|||
ffStackRegExp = /@([^@]*):(\d+):(\d+)\s*$/ig, |
|||
stackDetails = ieStackRegExp.exec(err.stack) || ffStackRegExp.exec(err.stack), |
|||
scriptLocation = (stackDetails && stackDetails[1]) || false, |
|||
line = (stackDetails && stackDetails[2]) || false, |
|||
currentLocation = document.location.href.replace(document.location.hash, ''), |
|||
pageSource, |
|||
inlineScriptSourceRegExp, |
|||
inlineScriptSource, |
|||
scripts = document.getElementsByTagName('script'); // Live NodeList collection
|
|||
|
|||
if (scriptLocation === currentLocation) { |
|||
pageSource = document.documentElement.outerHTML; |
|||
inlineScriptSourceRegExp = new RegExp('(?:[^\\n]+?\\n){0,' + (line - 2) + '}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*', 'i'); |
|||
inlineScriptSource = pageSource.replace(inlineScriptSourceRegExp, '$1').trim(); |
|||
} |
|||
|
|||
for (var i = 0; i < scripts.length; i++) { |
|||
// If ready state is interactive, return the script tag
|
|||
if (scripts[i].readyState === 'interactive') { |
|||
return scripts[i]; |
|||
} |
|||
|
|||
// If src matches, return the script tag
|
|||
if (scripts[i].src === scriptLocation) { |
|||
return scripts[i]; |
|||
} |
|||
|
|||
// If inline source matches, return the script tag
|
|||
if ( |
|||
scriptLocation === currentLocation && |
|||
scripts[i].innerHTML && |
|||
scripts[i].innerHTML.trim() === inlineScriptSource |
|||
) { |
|||
return scripts[i]; |
|||
} |
|||
} |
|||
|
|||
// If no match, return null
|
|||
return null; |
|||
} |
|||
}; |
|||
|
|||
return getCurrentScript |
|||
})); |
|||
|
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "bce4": |
|||
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|||
|
|||
"use strict"; |
|||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("2029"); |
|||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__); |
|||
/* unused harmony reexport * */ |
|||
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a); |
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "fb15": |
|||
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|||
|
|||
"use strict"; |
|||
// ESM COMPAT FLAG
|
|||
__webpack_require__.r(__webpack_exports__); |
|||
|
|||
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
|
|||
// This file is imported into lib/wc client bundles.
|
|||
|
|||
if (typeof window !== 'undefined') { |
|||
var currentScript = window.document.currentScript |
|||
if (true) { |
|||
var getCurrentScript = __webpack_require__("8875") |
|||
currentScript = getCurrentScript() |
|||
|
|||
// for backward compatibility, because previously we directly included the polyfill
|
|||
if (!('currentScript' in document)) { |
|||
Object.defineProperty(document, 'currentScript', { get: getCurrentScript }) |
|||
} |
|||
} |
|||
|
|||
var src = currentScript && currentScript.src.match(/(.+\/)[^/]+\.js(\?.*)?$/) |
|||
if (src) { |
|||
__webpack_require__.p = src[1] // eslint-disable-line
|
|||
} |
|||
} |
|||
|
|||
// Indicate to webpack that this file can be concatenated
|
|||
/* harmony default export */ var setPublicPath = (null); |
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0b526416-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=template&id=674ea55a&scoped=true&
|
|||
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.$parent.titleTabActive == 0)?_c('div',[_c('mu-text-field',{attrs:{"label":"streamPath"},model:{value:(_vm.streamPath),callback:function ($$v) {_vm.streamPath=$$v},expression:"streamPath"}}),(!_vm.remoteSDP)?_c('m-button',{on:{"click":_vm.publish}},[_vm._v("Publish")]):_c('m-button',{on:{"click":_vm.stopSession}},[_vm._v("Stop")]),(_vm.remoteSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.remoteSDPURL,"download":"remoteSDP.txt"},slot:"content"},[_vm._v("remoteSDP")])]):_vm._e(),(_vm.localSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.localSDPURL,"download":"localSDP.txt"},slot:"content"},[_vm._v("localSDP")])]):_vm._e(),_c('br'),_c('video',{ref:"video1",attrs:{"width":"640","height":"480","autoplay":"","muted":""},domProps:{"srcObject":_vm.stream,"muted":true}})],1):(_vm.$parent.titleTabActive == 1)?_c('stream-table',{scopedSlots:_vm._u([{key:"default",fn:function(scope){return [_c('m-button',{on:{"click":function($event){return _vm.preview(scope)}}},[_vm._v("Play")]),void 0]}}])}):(_vm.$parent.titleTabActive == 2)?_c('pre',[_vm._v(_vm._s(_vm.localSDP))]):(_vm.$parent.titleTabActive == 3)?_c('pre',[_vm._v(_vm._s(_vm.remoteSDP))]):_vm._e(),_c('webrtc-player',{ref:"player",attrs:{"PublicIP":_vm.PublicIP},model:{value:(_vm.previewStreamPath),callback:function ($$v) {_vm.previewStreamPath=$$v},expression:"previewStreamPath"}})],1)} |
|||
var staticRenderFns = [] |
|||
|
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue?vue&type=template&id=674ea55a&scoped=true&
|
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0b526416-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Player.vue?vue&type=template&id=30c7d0b2&
|
|||
var Playervue_type_template_id_30c7d0b2_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('Modal',_vm._g(_vm._b({attrs:{"draggable":"","title":_vm.streamPath},on:{"on-ok":_vm.onClosePreview,"on-cancel":_vm.onClosePreview}},'Modal',_vm.$attrs,false),_vm.$listeners),[_c('video',{ref:"webrtc",attrs:{"width":"488","height":"275","autoplay":"","muted":"","controls":""},domProps:{"srcObject":_vm.stream,"muted":true}}),_c('div',{attrs:{"slot":"footer"},slot:"footer"},[(_vm.remoteSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.remoteSDPURL,"download":"remoteSDP.txt"},slot:"content"},[_vm._v("remoteSDP")])]):_vm._e(),(_vm.localSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.localSDPURL,"download":"localSDP.txt"},slot:"content"},[_vm._v("localSDP")])]):_vm._e()],1)])} |
|||
var Playervue_type_template_id_30c7d0b2_staticRenderFns = [] |
|||
|
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue?vue&type=template&id=30c7d0b2&
|
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Player.vue?vue&type=script&lang=js&
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
|
|||
let pc = null; |
|||
/* harmony default export */ var Playervue_type_script_lang_js_ = ({ |
|||
data() { |
|||
return { |
|||
iceConnectionState: pc && pc.iceConnectionState, |
|||
stream: null, |
|||
localSDP: "", |
|||
remoteSDP: "", |
|||
remoteSDPURL: "", |
|||
localSDPURL: "", |
|||
streamPath: "" |
|||
}; |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
methods: { |
|||
async play(streamPath) { |
|||
pc = new RTCPeerConnection(); |
|||
pc.addTransceiver('video',{ |
|||
direction:'recvonly' |
|||
}) |
|||
this.streamPath = streamPath; |
|||
pc.onsignalingstatechange = e => { |
|||
//console.log(e);
|
|||
}; |
|||
pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(pc.iceConnectionState); |
|||
this.iceConnectionState = pc.iceConnectionState; |
|||
}; |
|||
pc.onicecandidate = event => { |
|||
console.log(event) |
|||
}; |
|||
pc.ontrack = event => { |
|||
// console.log(event);
|
|||
if (event.track.kind == "video") |
|||
this.stream = event.streams[0]; |
|||
}; |
|||
await pc.setLocalDescription(await pc.createOffer()); |
|||
this.localSDP = pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL( |
|||
new Blob([this.localSDP], { type: "text/plain" }) |
|||
); |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(pc.localDescription.toJSON()), |
|||
url: "/webrtc/play?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
if (result.errmsg) { |
|||
this.$toast.error(result.errmsg); |
|||
return; |
|||
} else { |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([this.remoteSDP], { type: "text/plain" })); |
|||
} |
|||
await pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
onClosePreview() { |
|||
pc.close(); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue?vue&type=script&lang=js&
|
|||
/* harmony default export */ var components_Playervue_type_script_lang_js_ = (Playervue_type_script_lang_js_); |
|||
// CONCATENATED MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
|
|||
/* globals __VUE_SSR_CONTEXT__ */ |
|||
|
|||
// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
|
|||
// This module is a runtime utility for cleaner component module output and will
|
|||
// be included in the final webpack user bundle.
|
|||
|
|||
function normalizeComponent ( |
|||
scriptExports, |
|||
render, |
|||
staticRenderFns, |
|||
functionalTemplate, |
|||
injectStyles, |
|||
scopeId, |
|||
moduleIdentifier, /* server only */ |
|||
shadowMode /* vue-cli only */ |
|||
) { |
|||
// Vue.extend constructor export interop
|
|||
var options = typeof scriptExports === 'function' |
|||
? scriptExports.options |
|||
: scriptExports |
|||
|
|||
// render functions
|
|||
if (render) { |
|||
options.render = render |
|||
options.staticRenderFns = staticRenderFns |
|||
options._compiled = true |
|||
} |
|||
|
|||
// functional template
|
|||
if (functionalTemplate) { |
|||
options.functional = true |
|||
} |
|||
|
|||
// scopedId
|
|||
if (scopeId) { |
|||
options._scopeId = 'data-v-' + scopeId |
|||
} |
|||
|
|||
var hook |
|||
if (moduleIdentifier) { // server build
|
|||
hook = function (context) { |
|||
// 2.3 injection
|
|||
context = |
|||
context || // cached call
|
|||
(this.$vnode && this.$vnode.ssrContext) || // stateful
|
|||
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
|
|||
// 2.2 with runInNewContext: true
|
|||
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { |
|||
context = __VUE_SSR_CONTEXT__ |
|||
} |
|||
// inject component styles
|
|||
if (injectStyles) { |
|||
injectStyles.call(this, context) |
|||
} |
|||
// register component module identifier for async chunk inferrence
|
|||
if (context && context._registeredComponents) { |
|||
context._registeredComponents.add(moduleIdentifier) |
|||
} |
|||
} |
|||
// used by ssr in case component is cached and beforeCreate
|
|||
// never gets called
|
|||
options._ssrRegister = hook |
|||
} else if (injectStyles) { |
|||
hook = shadowMode |
|||
? function () { |
|||
injectStyles.call( |
|||
this, |
|||
(options.functional ? this.parent : this).$root.$options.shadowRoot |
|||
) |
|||
} |
|||
: injectStyles |
|||
} |
|||
|
|||
if (hook) { |
|||
if (options.functional) { |
|||
// for template-only hot-reload because in that case the render fn doesn't
|
|||
// go through the normalizer
|
|||
options._injectStyles = hook |
|||
// register for functional component in vue file
|
|||
var originalRender = options.render |
|||
options.render = function renderWithStyleInjection (h, context) { |
|||
hook.call(context) |
|||
return originalRender(h, context) |
|||
} |
|||
} else { |
|||
// inject component registration as beforeCreate hook
|
|||
var existing = options.beforeCreate |
|||
options.beforeCreate = existing |
|||
? [].concat(existing, hook) |
|||
: [hook] |
|||
} |
|||
} |
|||
|
|||
return { |
|||
exports: scriptExports, |
|||
options: options |
|||
} |
|||
} |
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
/* normalize component */ |
|||
|
|||
var component = normalizeComponent( |
|||
components_Playervue_type_script_lang_js_, |
|||
Playervue_type_template_id_30c7d0b2_render, |
|||
Playervue_type_template_id_30c7d0b2_staticRenderFns, |
|||
false, |
|||
null, |
|||
null, |
|||
null |
|||
|
|||
) |
|||
|
|||
/* harmony default export */ var Player = (component.exports); |
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
|
|||
|
|||
const config = { iceServers: []}; |
|||
let Appvue_type_script_lang_js_pc = new RTCPeerConnection(config); |
|||
var stream = null |
|||
var streamPath = "live/rtc"; |
|||
/* harmony default export */ var Appvue_type_script_lang_js_ = ({ |
|||
components:{ |
|||
WebrtcPlayer: Player |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
data() { |
|||
return { |
|||
localSDP: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.localDescription && Appvue_type_script_lang_js_pc.localDescription.sdp, |
|||
remoteSDP: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.remoteDescription && Appvue_type_script_lang_js_pc.remoteDescription.sdp, |
|||
streamPath, |
|||
iceConnectionState: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.iceConnectionState, |
|||
stream, |
|||
previewStreamPath:false, |
|||
localSDPURL:"", |
|||
remoteSDPURL:"" |
|||
}; |
|||
}, |
|||
methods: { |
|||
async publish() { |
|||
Appvue_type_script_lang_js_pc.addStream(stream); |
|||
await Appvue_type_script_lang_js_pc.setLocalDescription(await Appvue_type_script_lang_js_pc.createOffer()); |
|||
this.localSDP = Appvue_type_script_lang_js_pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL(new Blob([ this.localSDP ],{type:'text/plain'})) |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(Appvue_type_script_lang_js_pc.localDescription), |
|||
url: "/webrtc/publish?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
console.log(result) |
|||
if (typeof result == "string"){ |
|||
this.$toast.error(result); |
|||
return; |
|||
} |
|||
streamPath = this.streamPath; |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([ this.remoteSDP ],{type:'text/plain'})) |
|||
Appvue_type_script_lang_js_pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
stopSession() { |
|||
Appvue_type_script_lang_js_pc.close(); |
|||
Appvue_type_script_lang_js_pc = new RTCPeerConnection(config); |
|||
this.remoteSDP = ""; |
|||
this.localSDP = ""; |
|||
// this.connectICE().catch(err => this.$toast.error(err.message));
|
|||
}, |
|||
preview({row}) { |
|||
this.previewStreamPath = true |
|||
this.$nextTick(() =>this.$refs.player.play(row.StreamPath)); |
|||
}, |
|||
}, |
|||
async mounted() { |
|||
Appvue_type_script_lang_js_pc.onsignalingstatechange = e => { |
|||
console.log(e); |
|||
}; |
|||
Appvue_type_script_lang_js_pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(Appvue_type_script_lang_js_pc.iceConnectionState); |
|||
this.iceConnectionState = Appvue_type_script_lang_js_pc.iceConnectionState; |
|||
}; |
|||
Appvue_type_script_lang_js_pc.onicecandidate = event => {}; |
|||
this.$parent.titleTabs = ["publish","play"]; |
|||
try { |
|||
if (!this.stream) |
|||
this.stream = stream = await navigator.mediaDevices.getUserMedia( |
|||
{ video: true, audio: true } |
|||
); |
|||
} catch (err) { |
|||
this.$toast.error(err.message); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue?vue&type=script&lang=js&
|
|||
/* harmony default export */ var src_Appvue_type_script_lang_js_ = (Appvue_type_script_lang_js_); |
|||
// EXTERNAL MODULE: ./src/App.vue?vue&type=style&index=0&id=674ea55a&scoped=true&lang=css&
|
|||
var Appvue_type_style_index_0_id_674ea55a_scoped_true_lang_css_ = __webpack_require__("bce4"); |
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
/* normalize component */ |
|||
|
|||
var App_component = normalizeComponent( |
|||
src_Appvue_type_script_lang_js_, |
|||
render, |
|||
staticRenderFns, |
|||
false, |
|||
null, |
|||
"674ea55a", |
|||
null |
|||
|
|||
) |
|||
|
|||
/* harmony default export */ var App = (App_component.exports); |
|||
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib.js
|
|||
|
|||
|
|||
/* harmony default export */ var entry_lib = __webpack_exports__["default"] = (App); |
|||
|
|||
|
|||
|
|||
/***/ }) |
|||
|
|||
/******/ })["default"]; |
|||
//# sourceMappingURL=plugin-webrtc.common.js.map
|
File diff suppressed because one or more lines are too long
@ -1 +0,0 @@ |
|||
@-webkit-keyframes blink-data-v-674ea55a{0%{opacity:.2}50%{opacity:1}to{opacity:.2}}@keyframes blink-data-v-674ea55a{0%{opacity:.2}50%{opacity:1}to{opacity:.2}}.blink[data-v-674ea55a]{-webkit-animation:blink-data-v-674ea55a 1s infinite;animation:blink-data-v-674ea55a 1s infinite} |
@ -1,594 +0,0 @@ |
|||
(function webpackUniversalModuleDefinition(root, factory) { |
|||
if(typeof exports === 'object' && typeof module === 'object') |
|||
module.exports = factory(); |
|||
else if(typeof define === 'function' && define.amd) |
|||
define([], factory); |
|||
else if(typeof exports === 'object') |
|||
exports["plugin-webrtc"] = factory(); |
|||
else |
|||
root["plugin-webrtc"] = factory(); |
|||
})((typeof self !== 'undefined' ? self : this), function() { |
|||
return /******/ (function(modules) { // webpackBootstrap
|
|||
/******/ // The module cache
|
|||
/******/ var installedModules = {}; |
|||
/******/ |
|||
/******/ // The require function
|
|||
/******/ function __webpack_require__(moduleId) { |
|||
/******/ |
|||
/******/ // Check if module is in cache
|
|||
/******/ if(installedModules[moduleId]) { |
|||
/******/ return installedModules[moduleId].exports; |
|||
/******/ } |
|||
/******/ // Create a new module (and put it into the cache)
|
|||
/******/ var module = installedModules[moduleId] = { |
|||
/******/ i: moduleId, |
|||
/******/ l: false, |
|||
/******/ exports: {} |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // Execute the module function
|
|||
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); |
|||
/******/ |
|||
/******/ // Flag the module as loaded
|
|||
/******/ module.l = true; |
|||
/******/ |
|||
/******/ // Return the exports of the module
|
|||
/******/ return module.exports; |
|||
/******/ } |
|||
/******/ |
|||
/******/ |
|||
/******/ // expose the modules object (__webpack_modules__)
|
|||
/******/ __webpack_require__.m = modules; |
|||
/******/ |
|||
/******/ // expose the module cache
|
|||
/******/ __webpack_require__.c = installedModules; |
|||
/******/ |
|||
/******/ // define getter function for harmony exports
|
|||
/******/ __webpack_require__.d = function(exports, name, getter) { |
|||
/******/ if(!__webpack_require__.o(exports, name)) { |
|||
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); |
|||
/******/ } |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // define __esModule on exports
|
|||
/******/ __webpack_require__.r = function(exports) { |
|||
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
|||
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
|||
/******/ } |
|||
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // create a fake namespace object
|
|||
/******/ // mode & 1: value is a module id, require it
|
|||
/******/ // mode & 2: merge all properties of value into the ns
|
|||
/******/ // mode & 4: return value when already ns object
|
|||
/******/ // mode & 8|1: behave like require
|
|||
/******/ __webpack_require__.t = function(value, mode) { |
|||
/******/ if(mode & 1) value = __webpack_require__(value); |
|||
/******/ if(mode & 8) return value; |
|||
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; |
|||
/******/ var ns = Object.create(null); |
|||
/******/ __webpack_require__.r(ns); |
|||
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); |
|||
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); |
|||
/******/ return ns; |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|||
/******/ __webpack_require__.n = function(module) { |
|||
/******/ var getter = module && module.__esModule ? |
|||
/******/ function getDefault() { return module['default']; } : |
|||
/******/ function getModuleExports() { return module; }; |
|||
/******/ __webpack_require__.d(getter, 'a', getter); |
|||
/******/ return getter; |
|||
/******/ }; |
|||
/******/ |
|||
/******/ // Object.prototype.hasOwnProperty.call
|
|||
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; |
|||
/******/ |
|||
/******/ // __webpack_public_path__
|
|||
/******/ __webpack_require__.p = ""; |
|||
/******/ |
|||
/******/ |
|||
/******/ // Load entry module and return exports
|
|||
/******/ return __webpack_require__(__webpack_require__.s = "fb15"); |
|||
/******/ }) |
|||
/************************************************************************/ |
|||
/******/ ({ |
|||
|
|||
/***/ "2029": |
|||
/***/ (function(module, exports, __webpack_require__) { |
|||
|
|||
// extracted by mini-css-extract-plugin
|
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "8875": |
|||
/***/ (function(module, exports, __webpack_require__) { |
|||
|
|||
var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;// addapted from the document.currentScript polyfill by Adam Miller
|
|||
// MIT license
|
|||
// source: https://github.com/amiller-gh/currentScript-polyfill
|
|||
|
|||
// added support for Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1620505
|
|||
|
|||
(function (root, factory) { |
|||
if (true) { |
|||
!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory), |
|||
__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ? |
|||
(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__), |
|||
__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); |
|||
} else {} |
|||
}(typeof self !== 'undefined' ? self : this, function () { |
|||
function getCurrentScript () { |
|||
if (document.currentScript) { |
|||
return document.currentScript |
|||
} |
|||
|
|||
// IE 8-10 support script readyState
|
|||
// IE 11+ & Firefox support stack trace
|
|||
try { |
|||
throw new Error(); |
|||
} |
|||
catch (err) { |
|||
// Find the second match for the "at" string to get file src url from stack.
|
|||
var ieStackRegExp = /.*at [^(]*\((.*):(.+):(.+)\)$/ig, |
|||
ffStackRegExp = /@([^@]*):(\d+):(\d+)\s*$/ig, |
|||
stackDetails = ieStackRegExp.exec(err.stack) || ffStackRegExp.exec(err.stack), |
|||
scriptLocation = (stackDetails && stackDetails[1]) || false, |
|||
line = (stackDetails && stackDetails[2]) || false, |
|||
currentLocation = document.location.href.replace(document.location.hash, ''), |
|||
pageSource, |
|||
inlineScriptSourceRegExp, |
|||
inlineScriptSource, |
|||
scripts = document.getElementsByTagName('script'); // Live NodeList collection
|
|||
|
|||
if (scriptLocation === currentLocation) { |
|||
pageSource = document.documentElement.outerHTML; |
|||
inlineScriptSourceRegExp = new RegExp('(?:[^\\n]+?\\n){0,' + (line - 2) + '}[^<]*<script>([\\d\\D]*?)<\\/script>[\\d\\D]*', 'i'); |
|||
inlineScriptSource = pageSource.replace(inlineScriptSourceRegExp, '$1').trim(); |
|||
} |
|||
|
|||
for (var i = 0; i < scripts.length; i++) { |
|||
// If ready state is interactive, return the script tag
|
|||
if (scripts[i].readyState === 'interactive') { |
|||
return scripts[i]; |
|||
} |
|||
|
|||
// If src matches, return the script tag
|
|||
if (scripts[i].src === scriptLocation) { |
|||
return scripts[i]; |
|||
} |
|||
|
|||
// If inline source matches, return the script tag
|
|||
if ( |
|||
scriptLocation === currentLocation && |
|||
scripts[i].innerHTML && |
|||
scripts[i].innerHTML.trim() === inlineScriptSource |
|||
) { |
|||
return scripts[i]; |
|||
} |
|||
} |
|||
|
|||
// If no match, return null
|
|||
return null; |
|||
} |
|||
}; |
|||
|
|||
return getCurrentScript |
|||
})); |
|||
|
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "bce4": |
|||
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|||
|
|||
"use strict"; |
|||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("2029"); |
|||
/* harmony import */ var _node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0__); |
|||
/* unused harmony reexport * */ |
|||
/* unused harmony default export */ var _unused_webpack_default_export = (_node_modules_mini_css_extract_plugin_dist_loader_js_ref_6_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_6_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_6_oneOf_1_2_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_App_vue_vue_type_style_index_0_id_674ea55a_scoped_true_lang_css___WEBPACK_IMPORTED_MODULE_0___default.a); |
|||
|
|||
/***/ }), |
|||
|
|||
/***/ "fb15": |
|||
/***/ (function(module, __webpack_exports__, __webpack_require__) { |
|||
|
|||
"use strict"; |
|||
// ESM COMPAT FLAG
|
|||
__webpack_require__.r(__webpack_exports__); |
|||
|
|||
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/setPublicPath.js
|
|||
// This file is imported into lib/wc client bundles.
|
|||
|
|||
if (typeof window !== 'undefined') { |
|||
var currentScript = window.document.currentScript |
|||
if (true) { |
|||
var getCurrentScript = __webpack_require__("8875") |
|||
currentScript = getCurrentScript() |
|||
|
|||
// for backward compatibility, because previously we directly included the polyfill
|
|||
if (!('currentScript' in document)) { |
|||
Object.defineProperty(document, 'currentScript', { get: getCurrentScript }) |
|||
} |
|||
} |
|||
|
|||
var src = currentScript && currentScript.src.match(/(.+\/)[^/]+\.js(\?.*)?$/) |
|||
if (src) { |
|||
__webpack_require__.p = src[1] // eslint-disable-line
|
|||
} |
|||
} |
|||
|
|||
// Indicate to webpack that this file can be concatenated
|
|||
/* harmony default export */ var setPublicPath = (null); |
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0b526416-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=template&id=674ea55a&scoped=true&
|
|||
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.$parent.titleTabActive == 0)?_c('div',[_c('mu-text-field',{attrs:{"label":"streamPath"},model:{value:(_vm.streamPath),callback:function ($$v) {_vm.streamPath=$$v},expression:"streamPath"}}),(!_vm.remoteSDP)?_c('m-button',{on:{"click":_vm.publish}},[_vm._v("Publish")]):_c('m-button',{on:{"click":_vm.stopSession}},[_vm._v("Stop")]),(_vm.remoteSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.remoteSDPURL,"download":"remoteSDP.txt"},slot:"content"},[_vm._v("remoteSDP")])]):_vm._e(),(_vm.localSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.localSDPURL,"download":"localSDP.txt"},slot:"content"},[_vm._v("localSDP")])]):_vm._e(),_c('br'),_c('video',{ref:"video1",attrs:{"width":"640","height":"480","autoplay":"","muted":""},domProps:{"srcObject":_vm.stream,"muted":true}})],1):(_vm.$parent.titleTabActive == 1)?_c('stream-table',{scopedSlots:_vm._u([{key:"default",fn:function(scope){return [_c('m-button',{on:{"click":function($event){return _vm.preview(scope)}}},[_vm._v("Play")]),void 0]}}])}):(_vm.$parent.titleTabActive == 2)?_c('pre',[_vm._v(_vm._s(_vm.localSDP))]):(_vm.$parent.titleTabActive == 3)?_c('pre',[_vm._v(_vm._s(_vm.remoteSDP))]):_vm._e(),_c('webrtc-player',{ref:"player",attrs:{"PublicIP":_vm.PublicIP},model:{value:(_vm.previewStreamPath),callback:function ($$v) {_vm.previewStreamPath=$$v},expression:"previewStreamPath"}})],1)} |
|||
var staticRenderFns = [] |
|||
|
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue?vue&type=template&id=674ea55a&scoped=true&
|
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"0b526416-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Player.vue?vue&type=template&id=30c7d0b2&
|
|||
var Playervue_type_template_id_30c7d0b2_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('Modal',_vm._g(_vm._b({attrs:{"draggable":"","title":_vm.streamPath},on:{"on-ok":_vm.onClosePreview,"on-cancel":_vm.onClosePreview}},'Modal',_vm.$attrs,false),_vm.$listeners),[_c('video',{ref:"webrtc",attrs:{"width":"488","height":"275","autoplay":"","muted":"","controls":""},domProps:{"srcObject":_vm.stream,"muted":true}}),_c('div',{attrs:{"slot":"footer"},slot:"footer"},[(_vm.remoteSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.remoteSDPURL,"download":"remoteSDP.txt"},slot:"content"},[_vm._v("remoteSDP")])]):_vm._e(),(_vm.localSDP)?_c('mu-badge',[_c('a',{attrs:{"slot":"content","href":_vm.localSDPURL,"download":"localSDP.txt"},slot:"content"},[_vm._v("localSDP")])]):_vm._e()],1)])} |
|||
var Playervue_type_template_id_30c7d0b2_staticRenderFns = [] |
|||
|
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue?vue&type=template&id=30c7d0b2&
|
|||
|
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Player.vue?vue&type=script&lang=js&
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
|
|||
let pc = null; |
|||
/* harmony default export */ var Playervue_type_script_lang_js_ = ({ |
|||
data() { |
|||
return { |
|||
iceConnectionState: pc && pc.iceConnectionState, |
|||
stream: null, |
|||
localSDP: "", |
|||
remoteSDP: "", |
|||
remoteSDPURL: "", |
|||
localSDPURL: "", |
|||
streamPath: "" |
|||
}; |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
methods: { |
|||
async play(streamPath) { |
|||
pc = new RTCPeerConnection(); |
|||
pc.addTransceiver('video',{ |
|||
direction:'recvonly' |
|||
}) |
|||
this.streamPath = streamPath; |
|||
pc.onsignalingstatechange = e => { |
|||
//console.log(e);
|
|||
}; |
|||
pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(pc.iceConnectionState); |
|||
this.iceConnectionState = pc.iceConnectionState; |
|||
}; |
|||
pc.onicecandidate = event => { |
|||
console.log(event) |
|||
}; |
|||
pc.ontrack = event => { |
|||
// console.log(event);
|
|||
if (event.track.kind == "video") |
|||
this.stream = event.streams[0]; |
|||
}; |
|||
await pc.setLocalDescription(await pc.createOffer()); |
|||
this.localSDP = pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL( |
|||
new Blob([this.localSDP], { type: "text/plain" }) |
|||
); |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(pc.localDescription.toJSON()), |
|||
url: "/webrtc/play?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
if (result.errmsg) { |
|||
this.$toast.error(result.errmsg); |
|||
return; |
|||
} else { |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([this.remoteSDP], { type: "text/plain" })); |
|||
} |
|||
await pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
onClosePreview() { |
|||
pc.close(); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue?vue&type=script&lang=js&
|
|||
/* harmony default export */ var components_Playervue_type_script_lang_js_ = (Playervue_type_script_lang_js_); |
|||
// CONCATENATED MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
|
|||
/* globals __VUE_SSR_CONTEXT__ */ |
|||
|
|||
// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
|
|||
// This module is a runtime utility for cleaner component module output and will
|
|||
// be included in the final webpack user bundle.
|
|||
|
|||
function normalizeComponent ( |
|||
scriptExports, |
|||
render, |
|||
staticRenderFns, |
|||
functionalTemplate, |
|||
injectStyles, |
|||
scopeId, |
|||
moduleIdentifier, /* server only */ |
|||
shadowMode /* vue-cli only */ |
|||
) { |
|||
// Vue.extend constructor export interop
|
|||
var options = typeof scriptExports === 'function' |
|||
? scriptExports.options |
|||
: scriptExports |
|||
|
|||
// render functions
|
|||
if (render) { |
|||
options.render = render |
|||
options.staticRenderFns = staticRenderFns |
|||
options._compiled = true |
|||
} |
|||
|
|||
// functional template
|
|||
if (functionalTemplate) { |
|||
options.functional = true |
|||
} |
|||
|
|||
// scopedId
|
|||
if (scopeId) { |
|||
options._scopeId = 'data-v-' + scopeId |
|||
} |
|||
|
|||
var hook |
|||
if (moduleIdentifier) { // server build
|
|||
hook = function (context) { |
|||
// 2.3 injection
|
|||
context = |
|||
context || // cached call
|
|||
(this.$vnode && this.$vnode.ssrContext) || // stateful
|
|||
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
|
|||
// 2.2 with runInNewContext: true
|
|||
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') { |
|||
context = __VUE_SSR_CONTEXT__ |
|||
} |
|||
// inject component styles
|
|||
if (injectStyles) { |
|||
injectStyles.call(this, context) |
|||
} |
|||
// register component module identifier for async chunk inferrence
|
|||
if (context && context._registeredComponents) { |
|||
context._registeredComponents.add(moduleIdentifier) |
|||
} |
|||
} |
|||
// used by ssr in case component is cached and beforeCreate
|
|||
// never gets called
|
|||
options._ssrRegister = hook |
|||
} else if (injectStyles) { |
|||
hook = shadowMode |
|||
? function () { |
|||
injectStyles.call( |
|||
this, |
|||
(options.functional ? this.parent : this).$root.$options.shadowRoot |
|||
) |
|||
} |
|||
: injectStyles |
|||
} |
|||
|
|||
if (hook) { |
|||
if (options.functional) { |
|||
// for template-only hot-reload because in that case the render fn doesn't
|
|||
// go through the normalizer
|
|||
options._injectStyles = hook |
|||
// register for functional component in vue file
|
|||
var originalRender = options.render |
|||
options.render = function renderWithStyleInjection (h, context) { |
|||
hook.call(context) |
|||
return originalRender(h, context) |
|||
} |
|||
} else { |
|||
// inject component registration as beforeCreate hook
|
|||
var existing = options.beforeCreate |
|||
options.beforeCreate = existing |
|||
? [].concat(existing, hook) |
|||
: [hook] |
|||
} |
|||
} |
|||
|
|||
return { |
|||
exports: scriptExports, |
|||
options: options |
|||
} |
|||
} |
|||
|
|||
// CONCATENATED MODULE: ./src/components/Player.vue
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
/* normalize component */ |
|||
|
|||
var component = normalizeComponent( |
|||
components_Playervue_type_script_lang_js_, |
|||
Playervue_type_template_id_30c7d0b2_render, |
|||
Playervue_type_template_id_30c7d0b2_staticRenderFns, |
|||
false, |
|||
null, |
|||
null, |
|||
null |
|||
|
|||
) |
|||
|
|||
/* harmony default export */ var Player = (component.exports); |
|||
// CONCATENATED MODULE: ./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=script&lang=js&
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
//
|
|||
|
|||
|
|||
const config = { iceServers: []}; |
|||
let Appvue_type_script_lang_js_pc = new RTCPeerConnection(config); |
|||
var stream = null |
|||
var streamPath = "live/rtc"; |
|||
/* harmony default export */ var Appvue_type_script_lang_js_ = ({ |
|||
components:{ |
|||
WebrtcPlayer: Player |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
data() { |
|||
return { |
|||
localSDP: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.localDescription && Appvue_type_script_lang_js_pc.localDescription.sdp, |
|||
remoteSDP: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.remoteDescription && Appvue_type_script_lang_js_pc.remoteDescription.sdp, |
|||
streamPath, |
|||
iceConnectionState: Appvue_type_script_lang_js_pc && Appvue_type_script_lang_js_pc.iceConnectionState, |
|||
stream, |
|||
previewStreamPath:false, |
|||
localSDPURL:"", |
|||
remoteSDPURL:"" |
|||
}; |
|||
}, |
|||
methods: { |
|||
async publish() { |
|||
Appvue_type_script_lang_js_pc.addStream(stream); |
|||
await Appvue_type_script_lang_js_pc.setLocalDescription(await Appvue_type_script_lang_js_pc.createOffer()); |
|||
this.localSDP = Appvue_type_script_lang_js_pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL(new Blob([ this.localSDP ],{type:'text/plain'})) |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(Appvue_type_script_lang_js_pc.localDescription), |
|||
url: "/webrtc/publish?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
console.log(result) |
|||
if (typeof result == "string"){ |
|||
this.$toast.error(result); |
|||
return; |
|||
} |
|||
streamPath = this.streamPath; |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([ this.remoteSDP ],{type:'text/plain'})) |
|||
Appvue_type_script_lang_js_pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
stopSession() { |
|||
Appvue_type_script_lang_js_pc.close(); |
|||
Appvue_type_script_lang_js_pc = new RTCPeerConnection(config); |
|||
this.remoteSDP = ""; |
|||
this.localSDP = ""; |
|||
// this.connectICE().catch(err => this.$toast.error(err.message));
|
|||
}, |
|||
preview({row}) { |
|||
this.previewStreamPath = true |
|||
this.$nextTick(() =>this.$refs.player.play(row.StreamPath)); |
|||
}, |
|||
}, |
|||
async mounted() { |
|||
Appvue_type_script_lang_js_pc.onsignalingstatechange = e => { |
|||
console.log(e); |
|||
}; |
|||
Appvue_type_script_lang_js_pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(Appvue_type_script_lang_js_pc.iceConnectionState); |
|||
this.iceConnectionState = Appvue_type_script_lang_js_pc.iceConnectionState; |
|||
}; |
|||
Appvue_type_script_lang_js_pc.onicecandidate = event => {}; |
|||
this.$parent.titleTabs = ["publish","play"]; |
|||
try { |
|||
if (!this.stream) |
|||
this.stream = stream = await navigator.mediaDevices.getUserMedia( |
|||
{ video: true, audio: true } |
|||
); |
|||
} catch (err) { |
|||
this.$toast.error(err.message); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue?vue&type=script&lang=js&
|
|||
/* harmony default export */ var src_Appvue_type_script_lang_js_ = (Appvue_type_script_lang_js_); |
|||
// EXTERNAL MODULE: ./src/App.vue?vue&type=style&index=0&id=674ea55a&scoped=true&lang=css&
|
|||
var Appvue_type_style_index_0_id_674ea55a_scoped_true_lang_css_ = __webpack_require__("bce4"); |
|||
|
|||
// CONCATENATED MODULE: ./src/App.vue
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
|
|||
/* normalize component */ |
|||
|
|||
var App_component = normalizeComponent( |
|||
src_Appvue_type_script_lang_js_, |
|||
render, |
|||
staticRenderFns, |
|||
false, |
|||
null, |
|||
"674ea55a", |
|||
null |
|||
|
|||
) |
|||
|
|||
/* harmony default export */ var App = (App_component.exports); |
|||
// CONCATENATED MODULE: ./node_modules/@vue/cli-service/lib/commands/build/entry-lib.js
|
|||
|
|||
|
|||
/* harmony default export */ var entry_lib = __webpack_exports__["default"] = (App); |
|||
|
|||
|
|||
|
|||
/***/ }) |
|||
|
|||
/******/ })["default"]; |
|||
}); |
|||
//# sourceMappingURL=plugin-webrtc.umd.js.map
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
@ -1,15 +0,0 @@ |
|||
{ |
|||
"name": "dashboard", |
|||
"version": "1.0.0", |
|||
"description": "dashboard of webrtc plugin for monibuca", |
|||
"main": "index.js", |
|||
"scripts": { |
|||
"build": "vue-cli-service build --target lib --name plugin-webrtc" |
|||
}, |
|||
"author": "dexter", |
|||
"license": "ISC", |
|||
"devDependencies": { |
|||
"@vue/cli-service": "^4.2.3", |
|||
"vue-template-compiler": "^2.6.11" |
|||
} |
|||
} |
@ -1,124 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<div v-if="$parent.titleTabActive == 0"> |
|||
<mu-text-field v-model="streamPath" label="streamPath"></mu-text-field> |
|||
<m-button @click="publish" v-if="!remoteSDP">Publish</m-button> |
|||
<m-button @click="stopSession" v-else>Stop</m-button> |
|||
<mu-badge v-if="remoteSDP"> |
|||
<a slot="content" :href="remoteSDPURL" download="remoteSDP.txt">remoteSDP</a> |
|||
</mu-badge> |
|||
<mu-badge v-if="localSDP"> |
|||
<a slot="content" :href="localSDPURL" download="localSDP.txt">localSDP</a> |
|||
</mu-badge> |
|||
<br /> |
|||
<video ref="video1" :srcObject.prop="stream" width="640" height="480" autoplay muted></video> |
|||
</div> |
|||
<stream-table v-else-if="$parent.titleTabActive == 1"> |
|||
<template v-slot="scope"> |
|||
<m-button @click="preview(scope)">Play</m-button> |
|||
<template> |
|||
</stream-table> |
|||
<pre v-else-if="$parent.titleTabActive == 2">{{localSDP}}</pre> |
|||
<pre v-else-if="$parent.titleTabActive == 3">{{remoteSDP}}</pre> |
|||
<webrtc-player ref="player" v-model="previewStreamPath" :PublicIP="PublicIP"></webrtc-player> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import WebrtcPlayer from "./components/Player" |
|||
const config = { iceServers: []}; |
|||
let pc = new RTCPeerConnection(config); |
|||
var stream = null |
|||
var streamPath = "live/rtc"; |
|||
export default { |
|||
components:{ |
|||
WebrtcPlayer |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
data() { |
|||
return { |
|||
localSDP: pc && pc.localDescription && pc.localDescription.sdp, |
|||
remoteSDP: pc && pc.remoteDescription && pc.remoteDescription.sdp, |
|||
streamPath, |
|||
iceConnectionState: pc && pc.iceConnectionState, |
|||
stream, |
|||
previewStreamPath:false, |
|||
localSDPURL:"", |
|||
remoteSDPURL:"" |
|||
}; |
|||
}, |
|||
methods: { |
|||
async publish() { |
|||
pc.addStream(stream); |
|||
await pc.setLocalDescription(await pc.createOffer()); |
|||
this.localSDP = pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL(new Blob([ this.localSDP ],{type:'text/plain'})) |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(pc.localDescription), |
|||
url: "/webrtc/publish?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
console.log(result) |
|||
if (typeof result == "string"){ |
|||
this.$toast.error(result); |
|||
return; |
|||
} |
|||
streamPath = this.streamPath; |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([ this.remoteSDP ],{type:'text/plain'})) |
|||
pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
stopSession() { |
|||
pc.close(); |
|||
pc = new RTCPeerConnection(config); |
|||
this.remoteSDP = ""; |
|||
this.localSDP = ""; |
|||
// this.connectICE().catch(err => this.$toast.error(err.message)); |
|||
}, |
|||
preview({row}) { |
|||
this.previewStreamPath = true |
|||
this.$nextTick(() =>this.$refs.player.play(row.StreamPath)); |
|||
}, |
|||
}, |
|||
async mounted() { |
|||
pc.onsignalingstatechange = e => { |
|||
console.log(e); |
|||
}; |
|||
pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(pc.iceConnectionState); |
|||
this.iceConnectionState = pc.iceConnectionState; |
|||
}; |
|||
pc.onicecandidate = event => {}; |
|||
this.$parent.titleTabs = ["publish","play"]; |
|||
try { |
|||
if (!this.stream) |
|||
this.stream = stream = await navigator.mediaDevices.getUserMedia( |
|||
{ video: true, audio: true } |
|||
); |
|||
} catch (err) { |
|||
this.$toast.error(err.message); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
@keyframes blink { |
|||
0% { |
|||
opacity: 0.2; |
|||
} |
|||
50% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
opacity: 0.2; |
|||
} |
|||
} |
|||
.blink { |
|||
animation: blink 1s infinite; |
|||
} |
|||
</style> |
@ -1,86 +0,0 @@ |
|||
<template> |
|||
<Modal |
|||
v-bind="$attrs" |
|||
draggable |
|||
v-on="$listeners" |
|||
:title="streamPath" |
|||
@on-ok="onClosePreview" |
|||
@on-cancel="onClosePreview" |
|||
> |
|||
<video ref="webrtc" :srcObject.prop="stream" width="488" height="275" autoplay muted controls></video> |
|||
<div slot="footer"> |
|||
<mu-badge v-if="remoteSDP"> |
|||
<a slot="content" :href="remoteSDPURL" download="remoteSDP.txt">remoteSDP</a> |
|||
</mu-badge> |
|||
<mu-badge v-if="localSDP"> |
|||
<a slot="content" :href="localSDPURL" download="localSDP.txt">localSDP</a> |
|||
</mu-badge> |
|||
</div> |
|||
</Modal> |
|||
</template> |
|||
<script> |
|||
let pc = null; |
|||
export default { |
|||
data() { |
|||
return { |
|||
iceConnectionState: pc && pc.iceConnectionState, |
|||
stream: null, |
|||
localSDP: "", |
|||
remoteSDP: "", |
|||
remoteSDPURL: "", |
|||
localSDPURL: "", |
|||
streamPath: "" |
|||
}; |
|||
}, |
|||
props:{ |
|||
PublicIP:String |
|||
}, |
|||
methods: { |
|||
async play(streamPath) { |
|||
pc = new RTCPeerConnection(); |
|||
pc.addTransceiver('video',{ |
|||
direction:'recvonly' |
|||
}) |
|||
this.streamPath = streamPath; |
|||
pc.onsignalingstatechange = e => { |
|||
//console.log(e); |
|||
}; |
|||
pc.oniceconnectionstatechange = e => { |
|||
this.$toast.info(pc.iceConnectionState); |
|||
this.iceConnectionState = pc.iceConnectionState; |
|||
}; |
|||
pc.onicecandidate = event => { |
|||
console.log(event) |
|||
}; |
|||
pc.ontrack = event => { |
|||
// console.log(event); |
|||
if (event.track.kind == "video") |
|||
this.stream = event.streams[0]; |
|||
}; |
|||
await pc.setLocalDescription(await pc.createOffer()); |
|||
this.localSDP = pc.localDescription.sdp; |
|||
this.localSDPURL = URL.createObjectURL( |
|||
new Blob([this.localSDP], { type: "text/plain" }) |
|||
); |
|||
const result = await this.ajax({ |
|||
type: "POST", |
|||
processData: false, |
|||
data: JSON.stringify(pc.localDescription.toJSON()), |
|||
url: "/webrtc/play?streamPath=" + this.streamPath, |
|||
dataType: "json" |
|||
}); |
|||
if (result.errmsg) { |
|||
this.$toast.error(result.errmsg); |
|||
return; |
|||
} else { |
|||
this.remoteSDP = result.sdp; |
|||
this.remoteSDPURL = URL.createObjectURL(new Blob([this.remoteSDP], { type: "text/plain" })); |
|||
} |
|||
await pc.setRemoteDescription(new RTCSessionDescription(result)); |
|||
}, |
|||
onClosePreview() { |
|||
pc.close(); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
Loading…
Reference in new issue