Phonegap下载/解压缩mp3播放的问题

时间:2015-12-29 11:15:09

标签: javascript cordova phonegap-build

我在使用phonegap在iphone 6上播放mp3时遇到问题。

我从服务器下载一个包含1个mp3文件和3个图像文件的zip文件。

所有似乎都正确下载但我不太确定mp3文件因为它不会播放。

要测试文件是否在那里,我这样做:

<img src="cdvfile://localhost/persistent/audio/1.jpg" alt="" /><br> 
<img src="cdvfile://localhost/persistent/audio/2.jpg" alt="" /><br>
<img src="cdvfile://localhost/persistent/audio/3.jpg" alt="" /><br>

<a href="cdvfile://localhost/persistent/audio/1.mp3">MP3HERE</a><br>

<audio class="audio" controls>
    <source src="cdvfile://localhost/persistent/audio/1.mp3" type="audio/mpeg">
</audio>

3张图片出现,所以我知道所有的文件都必须在那里但是虽然我得到了音频播放器它不会播放任何东西,所以我也创建了一个类似于mp3的播放器。

以下是我使用的功能:

function downloadAndUnzip() {

var fileTransfer = new FileTransfer();

fileTransfer.download(
    "http://myserver.com/test.zip",
    "cdvfile://localhost/persistent/audio/test.zip",
    function(entry) {
        alert("download complete: " + entry.fullPath);

        zip.unzip("cdvfile://localhost/persistent/audio/test.zip", 
           "cdvfile://localhost/persistent/audio/", 
           function(){
              alert('Zip decompressed successfully'); //I get this alert

              alert('Checking if test.zip exists');
              checkIfFileExists("/audio/test.zip"); //returns that it exists

              alert('Checking if 1.jpg exists');
              checkIfFileExists("/audio/1.jpg");

              alert('Checking if 2.jpg exists');
              checkIfFileExists("/audio/2.jpg"); //returns that it exists

              alert('Checking if 3.jpg exists');
              checkIfFileExists("/audio/3.jpg"); //returns that it exists

              alert('Checking if 1en.mp3 exists');
              checkIfFileExists("/audio/1.mp3"); //returns that it exists

           }
        );

    },
    function(error) {
        alert("download error source " + error.source);
        alert("download error target " + error.target);
        alert("upload error code" + error.code);
    });

}

现在,就警报而言,zip文件已成功下载和解压缩。

关于如何解决或解决此问题的任何想法?

2 个答案:

答案 0 :(得分:0)

我遇到了类似的问题,我无法显示本地文件系统中的图像。

根据https://www.npmjs.com/package/cordova-plugin-file的文档(在cdvfile协议下),我更改了内容安全规则:

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

<access origin="cdvfile://*" />

也许有帮助。

更新澄清:

<access origin="cdvfile://*" />

进入小部件下项目的根config.xml文件。它应该是这样的:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget ...>
...

 <access origin="cdvfile://*" />

...
</widget>

将您的HTML放入内容安全规则,例如:

<meta http-equiv="Content-Security-Policy" content="
            default-src 'self' data: gap: cdvfile:

...

然后使用:

进行构建
cordova build

答案 1 :(得分:0)

以下是我的案例:

let value = dictionary["currentLocation"] as! NSValue let currentLocation = value.MKCoordinateValue 对我不起作用。

道路上的问题一直存在。

在我使用cdvfile://修复问题的情况下。