Phonegap构建后，Axios无法在Android上运行 [英] Axios not working on Android after Phonegap Build
本文介绍了Phonegap构建后，Axios无法在Android上运行的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在他们的站点上构建后，我的Phonegap .apk中出现问题，我的问题是axios无法正常工作，但在我的Desktop Phonegap App中工作正常.我不知道我遇到的问题是什么，是因为我的axios吗?
I've got a problem in my Phonegap .apk after build it on their site, my problem is axios not working, but in my Desktop Phonegap App it works fine. I don't know what is/are the issue(s) that I have encounter, is this because of my axios?
技术:
Axios
，VueJS
，Phonegap
这是我的index.js样子:
Vue.directive('focus', {
inserted: function(el) {
return el.focus();
}
});
var apiURL = 'http://stishs-grade-and-progress-report-monitoring-system.cf/',
tokenString = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyz';
var Authentication = Vue.component('sti-main', {
data() {
return {
username: '',
password: '',
error: {
flag: false,
message: ''
}
}
},
template: `
<main>
<form class="sti-form-auth" v-on:submit.prevent="signInProceed(username, password)">
<div class="sti-logo">
<img src="img/sti-logo-250.png" alt="STI Grading and Progress Report Monitoring System Logo">
</div>
<h1 class="sti-form-title">STI Grading and Progress Report Monitoring System</h1>
<div class="sti-addon sti-form-control">
<input type="text" class="sti-block" placeholder="Username" v-on:keydown="hideNotif" v-model.trim="username" v-focus ref="Username">
<i class="ion ion-android-person"></i>
</div>
<div class="sti-addon sti-form-control">
<input type="password" class="sti-block" placeholder="Password" v-on:keydown="hideNotif" v-model.trim="password" ref="Password">
<i class="ion ion-android-lock"></i>
</div>
<div class="sti-form-control">
<button class="sti-block sti-button-blue">Sign in</button>
</div>
</form>
<div v-show="error.flag" class="sti-error-message">
<p class="sti-error-title"><i class="ion ion-alert-circled sti-right-5"></i>Error Found!</p>
<p>{{ error.message }}</p>
</div>
<div class="sti-footer-auth">
<p class="sti-center">Copyright © 2017 STI Grading and Progress Report Monitoring System. All Rights Reserved.</p>
</div>
</main>
`,
created: function() {
var authToken = localStorage.getItem('stishTokenAPI')
if(authToken != null && authToken.split('&')[2] == 3) {
var authData = `method=check&0=${authToken.split('&')[0]}&1=${authToken.split('&')[1]}`
return axios.post(`${apiURL}sti-api/authentication.php`, authData).then(function(response) {
var authenticated = response.data
if(authenticated.count == 1 && authenticated.type_id == 3) {
return window.location.href = './student.html'
}
return window.location.href = './index.html'
});
}
},
methods: {
hideNotif: function() {
return this.error.flag ? this.error.flag = false : true
},
generateToken: function(generateToken = '') {
for(var i = 0; i < tokenString.length; i++) {
generateToken += tokenString[Math.floor(Math.random() * (tokenString.length - 1)) + 1];
}
return generateToken;
},
signInProceed: function(user, pass) {
var vm = this
if(user == '' || pass == '') {
var errorType = user == '' ? 'Username' : 'Password'
vm.$refs[errorType].focus()
vm.error.message = `- Missing credential. ${errorType} is required!.`
vm.error.flag = true
return
}
var authToken = vm.generateToken()
var parameter = `method=auth&username=${vm.username}&password=${vm.password}&token=${authToken}`
return axios.post(`${apiURL}sti-api/authentication.php`, parameter).then(function(response) {
var account = response.data
if(account.success && account.details.type_id == 3) {
localStorage.setItem('stishTokenAPI', `${authToken}&${account.details.account_id}&${account.details.type_id}`)
return window.location.href = './student.html'
}
vm.error.message = `- ${account.message}`
return vm.error.flag = true
});
}
}
});
new Vue({
el: '#auth'
});
这是我的index.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>STI Grading and Progress Report Monitoring System</title>
<link rel=stylesheet href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<link rel=stylesheet href="https://fonts.googleapis.com/css?family=Roboto+Mono|Source+Sans+Pro:300,400,500,600">
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<main id="auth">
<sti-main></sti-main>
</main>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/axios.min.js"></script>
<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
这是我的config.xml
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phonegap.helloworld" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0">
<name>sti-mobile-app</name>
<description>
A blank PhoneGap app.
</description>
<author email="support@phonegap.com" href="http://phonegap.com">
PhoneGap Team
</author>
<content src="index.html" />
<allow-navigation href="*" />
<allow-intent href="*" />
<access origin="*" />
</widget>
推荐答案
对于Android/PhoneGap应用，您必须告诉OS您要访问哪些域.也许那是怎么回事?
For Android / PhoneGap apps, you have to tell the OS which domains you want to access. Maybe that's what's going on?
以下是相关的Cordova插件: http://npmjs.com/package/cordova-插件白名单
Here's a cordova plugin that's related: http://npmjs.com/package/cordova-plugin-whitelist
这篇关于Phonegap构建后，Axios无法在Android上运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
