2

我使用了framework7+vue app的app-framework模板。然后我安装了axios。该代码在测试时在浏览器中运行良好。但是当我运行 npm run android 命令并在设备模拟器中运行该应用程序时，它无法从服务器获取数据。

我确实搜索了原因。

Ajax 请求适用于浏览器，但不适用于 Android 设备

Phonegap Build 后 Axios 无法在 Android 上运行

cordova-whitelist 在 framework7 中是默认的。那么这是我的ajax调用在android应用程序中失败的原因吗？如何配置它？项目结构中没有 config.xml，而是我有 config.json。

下面是我使用 axios 的 config.json 和 home.vue 的代码。

配置文件

{
  "title": "Sollywood",
  "defaultLanguage": "en",
  "defaultLanguageFallback": false,
  "theme": "material",
  "color": "indigo",
  "layout": "default",
  "statusbarVisibility": true,
  "statusbarTextColor": "white",
  "statusbarBackgroundColor": "#000000",
  "iconBackgroundColor": "#ffffff",
  "useIconFonts": {
    "framework7": false,
    "material": false,
    "ion": false,
    "fontawesome": false
  },
  "limitApplicationWidth": 320,
  "limitApplicationHeight": 570,
  "showPhoneFrameOnDesktop": true,
  "framework7parameters": {},
  "materialSubnavbarFix": true,
  "restoreHistory": true,
  "restoreComponentData": true,
  "completeRoutesFile": true,
  "firebase": {
    "apiKey": "",
    "authDomain": "",
    "databaseURL": "",
    "storageBucket": "",
    "projectId": "",
    "allowEmailLogin": false,
    "allowEmailRegistration": false
  },
  "devFirebase": {
    "deployDevRulesOnTesting": false,
    "apiKey": "",
    "authDomain": "",
    "databaseURL": "",
    "storageBucket": "",
    "projectId": "",
    "allowEmailLogin": false,
    "allowEmailRegistration": false
  },
  "appStoreId": "",
  "playStoreId": "",
  "useCordovaPlugins": [
    "cordova-plugin-whitelist"
  ],
  "cordovaPreferences": {
    "DisallowOverscroll": true
  },
  "resetLocalStorageOnVersionChange": false,
  "preloadImages": true,
  "buildSourcemaps": false,
  "fixCodeOnTest": true,
  "fixCodeOnBuild": true,
  "devServerPort": "8081"
}

我的 Home.vue 代码：

<template>
  <f7-page>
    <f7-navbar :title="$root.config.title" />
    <!-- Home Page Search Bar -->
    <f7-searchbar
      cancel-link="Cancel"
      placeholder="Search in items"
      :clear-button="true"
    ></f7-searchbar>
    <!-- Home Page Banner -->
    <f7-swiper :params="{autoplay: 2000}">
      <f7-swiper-slide v-for="item in bannerLinks" :key="item.id"><img :src="item" width="100%" height="200px" class="lazy" ></f7-swiper-slide>
    </f7-swiper> 
    <f7-block inner inset>{{$lang('text')}}</f7-block>
    <f7-block inner>
      <ul>
        <li v-for="bannerLink in bannerLinks" :key="bannerLink.id">{{ bannerLink }}</li>
      </ul>
    </f7-block>
    <f7-block>
      <f7-button big fill raised bg="green" href="https://github.com/scriptPilot/app-framework/blob/master/DOCUMENTATION.md" external>Documentation</f7-button>
    </f7-block>
  </f7-page>
</template>
<script>
import axios from 'axios'


export default {
  data: function () {
    return {
      bannerLinks: []
    }
  },
  created () {
    
    axios.get('http://localhost:8080/sollywood/public/skills').then(Response => { this.bannerLinks = Response.data })
  }
}

</script>

编辑：从框架7附带的cordova-plugin-whitelist中添加config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.app_framework.dev_build" version="0.0.1709211819" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>Sollywood</name>
    <content src="index.html" />
    <preference name="DisallowOverscroll" value="true" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="hdpi" src="icons\android-icon-hdpi-72x72.png" />
        <icon density="ldpi" src="icons\android-icon-ldpi-36x36.png" />
        <icon density="mdpi" src="icons\android-icon-mdpi-48x48.png" />
        <icon density="xhdpi" src="icons\android-icon-xhdpi-96x96.png" />
        <icon density="xxhdpi" src="icons\android-icon-xxhdpi-144x144.png" />
        <icon density="xxxhdpi" src="icons\android-icon-xxxhdpi-192x192.png" />
        <splash density="port-hdpi" src="icons\android-splash-hdpi-480x800.png" />
        <splash density="land-hdpi" src="icons\android-splash-hdpi-800x480.png" />
        <splash density="port-ldpi" src="icons\android-splash-ldpi-200x320.png" />
        <splash density="land-ldpi" src="icons\android-splash-ldpi-320x200.png" />
        <splash density="port-mdpi" src="icons\android-splash-mdpi-320x480.png" />
        <splash density="land-mdpi" src="icons\android-splash-mdpi-480x320.png" />
        <splash density="port-xhdpi" src="icons\android-splash-xhdpi-1280x720.png" />
        <splash density="land-xhdpi" src="icons\android-splash-xhdpi-720x1280.png" />
    </platform>
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <engine name="android" spec="^6.2.3" />
    <plugin name="cordova-plugin-statusbar" spec="^2.2.3" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.2" />
</widget>

4

0 回答 0