拍照后无法访问 ms-appdata:///local

Question

我对为 Windows 8.1 编写的 Cordova 应用程序有疑问。我想拍一张照片并显示在屏幕上，同时保存在本地文件夹中。

在我的一个指令中，我有一个函数：

scope.takePhoto = function () {
    var myScope = scope;
    navigator.camera.getPicture(function (imageURI) {
        console.log('Method getPhoto succeed');
        myScope.addPhoto(imageURI);
    }, getPhotoOnFail, {
        quality: 50,
        destinationType: Camera.DestinationType.FILE_URI
    });
}

scope.addPhoto = function (fileUri) {
    scope.entity.previewCaptured = {fileUri: fileUri, datetime: new Date()};
}

在模板中我有一个 img：

<img alt="{{entity.previewCaptured.fileUri}}" ng-src="{{entity.previewCaptured.fileUri}}" title="{{entity.previewCaptured.datetime}}">

在我使用系统相机应用程序拍照后，当我接受这张照片时，显示的不是照片alt（因此我们无法访问图像），它的值与 src 相同。所以这个alt有价值

ms-appdata:///local/zdjęcie000.png

我检查了Windows.Storage.ApplicationData.current.localFolder.path 本地文件夹的路径在哪里，对我来说是C:\Users\user\AppData\Local\Packages\{app_name}\LocalState。我检查了文件 zdjęcie000.png 是否存在。

我读到ms-appdata:/// 适用于 Windows 应用程序。即使在the page 上也写到ms-appdata 应该适用于Windows 8，所以我希望它也应该适用于Windows 8.1。我还检查了传递给src 文件绝对路径C:\Users\user\AppData\Local\Packages\{app_name}\LocalState，没有用。我也试过用$timeout函数来延迟显示这个img，也没有用。

我已经安装了插件：文件、文件传输、相机、捕获和文件 Opener2

我的 config.xml：

<?xml version="1.0" encoding="utf-8"?>
<widget xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:vs="http://schemas.microsoft.com/appx/2014/htmlapps" id="pl.com.name" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" defaultlocale="pl-PL">
  <name>Name</name>
  <description>Name app</description>
  <author href="http://cordova.io" email="dev@cordova.apache.org">Name</author>
  <content src="index.html" />
  <access origin="*" />
  <vs:features />
  <preference name="SplashScreen" value="screen" />
  <preference name="windows-target-version" value="8.1" />
  <!-- Support for Cordova 5.0.0 plugin system -->
  <plugin name="cordova-plugin-whitelist" version="1" />
  <allow-intent href="http://*/*" />
  <allow-intent href="https://*/*" />
  <allow-intent href="tel:*" />
  <allow-intent href="sms:*" />
  <allow-intent href="mailto:*" />
  <allow-intent href="geo:*" />
  <platform name="android">
    <allow-intent href="market:*" />
  </platform>
  <platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
  </platform>
  <vs:plugin name="cordova-plugin-camera" version="1.2.0" />
  <vs:plugin name="cordova-plugin-file" version="3.0.0" />
  <vs:plugin name="cordova-plugin-file-transfer" version="1.2.1" />
  <vs:platformSpecificValues>
    <vs:platformSpecificWidget platformName="windows" id="pl.com.name" version="0.0.0.1">
      <vs:name>Name</vs:name>
    </vs:platformSpecificWidget>
  </vs:platformSpecificValues>
  <vs:plugin name="cordova-plugin-media-capture" version="1.0.1" />
  <preference name="Fullscreen" value="True" />
  <vs:plugin name="io.github.pwlin.cordova.plugins.fileopener2" version="1.0.11" src="https://github.com/pwlin/cordova-plugin-file-opener2" />
</widget>

还有我手动添加的/res/native/windows/package.windows.appmanifest，因为显示外部图像 (<img src="http://xxx">) 不起作用：

<Properties>
    <DisplayName>Name</DisplayName>
    <PublisherDisplayName>Name</PublisherDisplayName>
    <Logo>images\StoreLogo.png</Logo>
  </Properties>
  <Prerequisites>
    <OSMinVersion>6.3.0</OSMinVersion>
    <OSMaxVersionTested>6.3.0</OSMaxVersionTested>
  </Prerequisites>
  <Resources>
    <Resource Language="PL-PL" />
  </Resources>
  <Applications>
    <Application Id="pl.com.name" StartPage="www/index.html">
      <m2:VisualElements BackgroundColor="#464646" Description="CordovaApp" DisplayName="Name" ForegroundText="light" Square150x150Logo="images\Square150x150Logo.png" Square30x30Logo="images\Square30x30Logo.png">
        <m2:DefaultTile Square310x310Logo="images\Square310x310Logo.png" Square70x70Logo="images\Square70x70Logo.png" Wide310x150Logo="images\Wide310x150Logo.png">
          <m2:ShowNameOnTiles>
            <m2:ShowOn Tile="square150x150Logo" />
            <m2:ShowOn Tile="wide310x150Logo" />
            <m2:ShowOn Tile="square310x310Logo" />
          </m2:ShowNameOnTiles>
        </m2:DefaultTile>
        <m2:SplashScreen Image="images\SplashScreen.png" />
      </m2:VisualElements>
    </Application>
  </Applications>
  <Capabilities>
    <Capability Name="privateNetworkClientServer" />
    <Capability Name="internetClient" />
    <DeviceCapability Name="webcam" />
    <DeviceCapability Name="microphone" />
  </Capabilities>
  <Dependencies>
    <PackageDependency Name="Microsoft.WinJS.2.0" MinVersion="1.0.9600.17018" />
  </Dependencies>
  <build:Metadata>
    <build:Item Name="SharedGUID" Value="9ebdb27f-d75b-4d8c-b53f-7be4a1fe89f9" />
    <build:Item Name="CodeSharingProject" Value="248F659F-DAC5-46E8-AC09-60EC9FC95053" />
    <build:Item Name="VisualStudio" Version="14.0" />
    <build:Item Name="VisualStudioEdition" Value="Microsoft Visual Studio Community 2015" />
    <build:Item Name="OperatingSystem" Version="6.3.9600.16384 (winblue_rtm.130821-1623)" />
    <build:Item Name="Microsoft.Build.AppxPackage.dll" Version="14.0.23121.0" />
    <build:Item Name="ProjectGUID" Value="63d2ad13-9b12-4e63-95a7-2908337917ce" />
    <build:Item Name="MakePri.exe" Version="6.3.9600.17336 (winblue.150226-1500)" />
  </build:Metadata>
</Package>

Answer 1

我已经检查了使用 jQuery 将带有 src 属性的 img 附加到 DOM 并且它有效！这很奇怪，但是 angularJS ng-src 指令可能有问题。