Question

我正在按照网站上的步骤设置//www.svlconnectsdk.com / docs / 1-6-0 / cordova / discover-connect /

我已成功安装SDK，构建并运行Android版本。我在屏幕上显示按钮但是在选择按钮时我收到了未被捕获的参考错误？

任何人都可以提供帮助吗？

错误：

index.js:36 Uncaught ReferenceError: connectSDK is not defined
at Object.showDevicePicker (index.js:36)
at HTMLButtonElement.onclick (index.html:41)

我的HTML

<meta http-equiv="Content-Security-Policy" content="default-src * gap: ws: https://ssl.gstatic.com;style-src * 'unsafe-inline' 'self' data: blob:;script-src * 'unsafe-inline' 'unsafe-eval' data: blob:;img-src * data: 'unsafe-inline' 'self' content:;fmedia-src mediastream;">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Hello World</title>
</head>
<body>
    <div class="app">
        <h1>Apache Cordova</h1>
        <button onclick="app.showDevicePicker()">Select a TV</button>
        <div id="deviceready" class="blink">
            <p class="event listening">Connecting to Device</p>
            <p class="event received">Device is Ready</p>
        </div>
    </div>
    <script type="text/javascript" src="js/index.js"></script>

我的JS文件

    [var app = {
    // Application Constructor
    initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    },
    // deviceready Event Handler
    //
    // Bind any cordova events here. Common events are:
    // 'pause', 'resume', etc.
    onDeviceReady: function() {
        this.receivedEvent('deviceready');
        app.setupDiscovery();
    },
    setupDiscovery: function () {
        connectSDK.discoveryManager.startDiscovery();
    },
    showDevicePicker: function () {
        connectSDK.discoveryManager.pickDevice();
    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }
};
    app.initialize();

我意识到我在HTML中缺少cordova.js脚本：

新守则：

<html>
    <head>
        <!--
        Customize this policy to fit your own app's needs. For more guidance, see:

            * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
            * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
            * Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
                * Enable inline JS: add 'unsafe-inline' to default-src
        -->
        <meta http-equiv="Content-Security-Policy" content="default-src * gap: ws: https://ssl.gstatic.com;style-src * 'unsafe-inline' 'self' data: blob:;script-src * 'unsafe-inline' 'unsafe-eval' data: blob:;img-src * data: 'unsafe-inline' 'self' content:;fmedia-src mediastream;">
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <title>Hello World</title>
    </head>
    <body>
        <div class="app">
            <h1>Apache Cordova</h1>
            <button onclick="app.showDevicePicker()">Select a TV</button>
            <div id="deviceready" class="blink">
                <p class="event listening">Connecting to Device</p>
                <p class="event received">Device is Ready</p>
            </div>
        </div>
        <script type="text/javascript" src="../platforms/android/assets/www/cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
</body>
</html>

为Android构建时仍然没有选择器。当我直接在chrome中加载index.html时，我现在得到以下弹出窗口。

https://i.stack.imgur.com/qwS9J.jpg https://i.stack.imgur.com/Q1L81.jpg

如果我取消弹出窗口，我会收到以下错误：

Unrecognized Content-Security-Policy directive 'fmedia-src'.

index.js:47 Received Event: deviceready

index.js:33 Uncaught ReferenceError: connectSDK is not defined
    at Object.setupDiscovery (index.js:33)
    at Object.onDeviceReady (index.js:30)
    at Channel.fire (cordova.js:822)
    at cordova.js:231
If i accept the pop ups i get these errors :

unrecognized Content-Security-Policy directive 'fmedia-src'.

25269 cordova.js:1083 processMessage failed: invalid message: ""

Answer 1

首先你应该纠正这个错误：unrecognized Content-Security-Policy directive 'fmedia-src'.你在这里有错误：

<meta http-equiv="Content-Security-Policy" content="default-src * gap: ws: https://ssl.gstatic.com;style-src * 'unsafe-inline' 'self' data: blob:;script-src * 'unsafe-inline' 'unsafe-eval' data: blob:;img-src * data: 'unsafe-inline' 'self' content:;fmedia-src mediastream;">

它应该是：

<meta http-equiv="Content-Security-Policy" content="default-src * gap: ws: https://ssl.gstatic.com;style-src * 'unsafe-inline' 'self' data: blob:;script-src * 'unsafe-inline' 'unsafe-eval' data: blob:;img-src * data: 'unsafe-inline' 'self' content:;media-src mediastream;">

你写了fmedia-src而不是media-src。

然后在这里：

 initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady.bind(this), false);
    }

我认为您应该尝试删除.bind(this)，如下所示：

 initialize: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    }

希望它有所帮助！

Cordova JS文件 - 未捕获的参考错误

1 个答案: