Cordova Windows 8.1在Visual Studio 2015外部图像加载到img标记 [英] Cordova Windows 8.1 on Visual Studio 2015 external image loading to img tag

查看:693
本文介绍了Cordova Windows 8.1在Visual Studio 2015外部图像加载到img标记的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在Cordova应用程式中显示外部来源的图片时发生问题。所有DOM都工作,但无法加载图片。我专注于使它只适用于Windows 8.1。我为javascript创建了一个Cordova项目。我在config.xml文件中设置:

 <?xml version =1.0encoding =utf-8? > 
< widget xmlns:cdv =http://cordova.apache.org/ns/1.0xmlns:vs =http://schemas.microsoft.com/appx/2014/htmlappsid = pl.com.sk.todolistversion =1.0.0xmlns =http://www.w3.org/ns/widgetsdefaultlocale =pl-PL>
< name> todolist< / name>
< description> todolist< / description>
< author href =http://cordova.ioemail =dev@cordova.apache.org> SK Team< / author>
< content src =index.html/>
< access origin =*/>
< vs:features />
< preference name =SplashScreenvalue =screen/>
< preference name =windows-target-versionvalue =8.1/>
<! - 支持Cordova 5.0.0插件系统 - >
< plugin name =cordova-plugin-whitelistversion =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-cameraversion =1.2.0/>
< vs:plugin name =cordova-plugin-fileversion =3.0.0/>
< vs:plugin name =cordova-plugin-file-transferversion =1.2.1/>
< vs:platformSpecificValues>
< vs:platformSpecificWidget platformName =windowsid =pl.com.sk.todolistversion =0.0.0.1>
< vs:name> todolist< / vs:name>
< / vs:platformSpecificWidget>
< / vs:platformSpecificValues>
< vs:plugin name =cordova-plugin-media-captureversion =1.0.1/>
< preference name =Fullscreenvalue =True/>
< vs:plugin name =io.github.pwlin.cordova.plugins.fileopener2version =1.0.11src =https://github.com/pwlin/cordova-plugin-file- opener2/>
< / widget>

我的img标签是:

 < img ng-src ={{cfg.img_url}} {{groupImg.link}}alt ={{groupImg.name}}
title ={ {groupImg.name}}ng-click =mc.showPreviewGroupImg()/>

渲染到DOM后,它是:

 < img alt =The imagetitle =The imageng-click =mc.showPreviewGroupImg()ng-src =http://static.videezy.com /system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpgsrc =http://static.videezy.com/system/resources/ thumbnail / 000/003/294 / original / aerial-view-of-mountain-forest-free-hd-video.jpg> 

在debug mod运行期间我在Visual Studio 2015中收到错误:

  SEC7117:网络请求到http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial- view-of-mountain-forest-free-hd-video.jpg没有成功。您的应用程序清单未声明以下功能:privateNetworkClientServer 

我在哪里可以设置此功能? >

解决方案

按照平台特定配置文件


将自定义package.windows80.appxmanifest(Windows 8.0),
package.windows.appxmanifest(Windows 8.1)或
package.phone.appxmanifestfile(Windows Phone 8.1)在
res / native / windows文件夹中覆盖各种配置设置。
在为Windows或
Windows Phone(Universal)构建项目的Debug配置后,使用platforms / windows文件夹
中生成的文件版本。


Sony Aurje解决方案


  • 打开项目文件夹并转到bld / windows-AnyCpu / Debug并在记事本中打开AppxManifest.xml,


  • 双击Package.appxmanifest文件,然后转到Capabilities选项卡,选择Private,然后将其粘贴到
    上面的Package.appxmanifest文件。网络(客户端和服务器)。


  • 保存并再次运行应用程序,这次我可以连接到Node js REST api。 / p>



  • 我添加的文件像是写在第一次报价,



    文件位置:

      C: \ {visual studio project dir} \BlankCordovaApp2\res\\\
    ative\windows\package.windows.appxmanifest

    我改变了什么?

     < Capabilities> 
    < Capability Name =privateNetworkClientServer/> <! - 添加此行 - >
    < Capability Name =internetClient/>
    < DeviceCapability Name =webcam/>
    < DeviceCapability Name =microphone/>
    < / Capabilities>


    I have a problem with displaying images from external source in Cordova app. All DOM is working but images won't to load. I am focused to made it working for Windows 8.1 only. I created a Cordova project for javascript. I have set in config.xml file:

    <?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.sk.todolist" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" defaultlocale="pl-PL">
      <name>todolist</name>
      <description>todolist</description>
      <author href="http://cordova.io" email="dev@cordova.apache.org">SK Team</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.sk.todolist" version="0.0.0.1">
          <vs:name>todolist</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>
    

    My img tag is:

    <img ng-src="{{cfg.img_url}}{{groupImg.link}}" alt="{{groupImg.name}}"
            title="{{groupImg.name}}" ng-click="mc.showPreviewGroupImg()" />
    

    After rendering to DOM it is:

    <img alt="The image" title="The image" ng-click="mc.showPreviewGroupImg()" ng-src="http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg" src="http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg">
    

    During running in debug mod I'm getting an error in Visual Studio 2015:

    SEC7117: Network request to http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg did not succeed. Your application manifest does not declare the following capabilities: privateNetworkClientServer
    

    Where can I set this capability?

    解决方案

    Following to the Platform specific configuration files

    Place the custom package.windows80.appxmanifest (Windows 8.0), package.windows.appxmanifest (Windows 8.1), or package.phone.appxmanifestfile (Windows Phone 8.1) in the res/native/windows folder to override various configuration settings. Use the generated version of the file in the platforms/windows folder after building a Debug configuration of the project for Windows or Windows Phone (Universal).

    and Sony Aurje solution

    1. Create a Package.appxmanifest file under res/cert/windows8. Create a windows8 solution folder if not exist.

    2. Open the project folder and go to bld/windows-AnyCpu/Debug and open AppxManifest.xml in notepad, copy the content and paste it in the above Package.appxmanifest file.

    3. Double click on Package.appxmanifest file then goto Capabilities tab and choose ‘Private Networks (Client & Server)’.

    4. Save it and run the app again, this time it worked I could connect to my Node js REST api.

    I added the file like it was written in first quote and I have used all other advices from second quote.

    File location:

    C:\{visual studio project dir}\BlankCordovaApp2\res\native\windows\package.windows.appxmanifest
    

    What I have changed?

    <Capabilities>
        <Capability Name="privateNetworkClientServer" /> <!-- Added this line -->
        <Capability Name="internetClient" />
        <DeviceCapability Name="webcam" />
        <DeviceCapability Name="microphone" />
    </Capabilities>
    

    这篇关于Cordova Windows 8.1在Visual Studio 2015外部图像加载到img标记的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

    查看全文
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆