访问存储在 ngCordova/ionic iOS 应用程序中的 mp3 文件
Posted
技术标签:
【中文标题】访问存储在 ngCordova/ionic iOS 应用程序中的 mp3 文件【英文标题】：Accessing mp3 files stored inside ngCordova/ionic iOS app 【发布时间】：2015-04-23 11:12:29 【问题描述】：我目前正在使用 ngCordova 和 Ionic 构建 ios 应用程序。该规范的一部分包括能够访问/播放存储在应用程序“www”文件夹中的 mp3 文件。 经过试验，我已经能够从外部 URL 播放音乐文件，但是当尝试使用本地存储的 mp3 时，我遇到了问题。
这是 html：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-app="editor">
<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Editor</h1>
</ion-header-bar>
<ion-content ng-controller="MusicController">
<button class="button" ng-click="play('www/elvis.mp3')">Play</button>
</ion-content>
</ion-pane>
</body>
</html>
这是控制器/应用程序：
var editorApp = angular.module('editor', ['ionic', 'ngCordova'])
.run(function($ionicPlatform)
$ionicPlatform.ready(function()
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard)
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
if(window.StatusBar)
StatusBar.styleDefault();
);
)
editorApp.controller("MusicController", function($scope, $cordovaMedia)
$scope.play = function(src)
var filePath = cordova.file.applicationDirectory + src;
var iOSPlayOptions =
numberOfLoops: 2,
playAudioWhenScreenIsLocked : false
;
var media = $cordovaMedia.newMedia(filePath);
media.play(iOSPlayOptions);
;
);
当我“cordova build ios”并在 xCode 中的手机上运行它时，我收到以下错误：
2015-04-23 11:59:43.619 IonicProject[1487:375698] 未知资源 'file:///private/var/mobile/Containers/Bundle/Application/FB22B00F-9020-46C9-BBA2-674009BD84F7/IonicProject.app/www/elvis.mp3'
【问题讨论】：
不要加www。只需添加 play('elvis.mp3') 试过了，但仍然出现同样的错误：2015-04-23 12:22:50.374 IonicProject[1516:381092] Unknown resource 'file:///private/var/mobile/Containers/Bundle /Application/D72C701B-50ED-48C9-99CC-B3D21D35A2C7/IonicProject.app/elvis.mp3' 首先，使用 $location 查找当前位置，并根据当前 url，更改本地音频 src。但是您可以使用以下代码在 iOS 应用中播放音频。您也可以使用音频标签播放/暂停，无需为其添加多个按钮。 遇到同样的问题，到目前为止运气好吗？在android中运行良好... 【参考方案1】：您可以在 ionic 中为 iOS 应用程序使用直接音频标签，而无需执行这些操作（这些是 Android 应用程序所必需的）。只需编写以下代码：
HTML 代码
<div ng-bind-html="audioCall()"></div>
控制器代码
$scope.audioCall = function ()
if ($scope.audioUrl)
return $sce.trustAsHtml("<audio controls> <source src='" + $scope.audioUrl + "' type='audio/mpeg'/></audio>");
else
return "";
;
【讨论】：
您可以将这个用于本地和外部的音频 url以上是关于访问存储在 ngCordova/ionic iOS 应用程序中的 mp3 文件的主要内容，如果未能解决你的问题，请参考以下文章
访问Xamarin Forms iOS应用程序中的共享存储位置
Facebook iOS SDK 不存储用于访问的 cookie
从 PowerShell 使用 System.IO 访问 MTP 存储