2015-09-26 203 views
0

我有一個Android應用程序,我一直在phoengap上構建。我升級到最新的版本上phoengap編譯:Phonegap Ajax請求未執行

<preference name="phonegap-version" value="cli-5.2.0" /> 

而且我的配置是這樣的:

<widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" id="com.beerportfolio.beerportfoliopro" version="5.2.1"> 

    <preference name="phonegap-version" value="cli-5.2.0" /> 

    <name>Beer Portfolio</name> 
    <description>Know Your Beer</description> 
    <author href="http://www.beerportfolio.glass" email="[email protected]">Mike</author> 
    <content src="index.html" /> 

    <preference name="permissions" value="none" /> 
    <preference name="orientation" value="default" /> 
    <preference name="target-device" value="universal" /> 
    <preference name="fullscreen" value="false" /> 
    <preference name="webviewbounce" value="false" /> 
    <preference name="disallowOverscroll" value="true" /> 
    <preference name="prerendered-icon" value="true" /> 
    <preference name="stay-in-webview" value="false" /> 
    <preference name="ios-statusbarstyle" value="black-opaque" /> 
    <preference name="detect-data-types" value="true" /> 
    <preference name="exit-on-suspend" value="false" /> 
    <preference name="show-splash-screen-spinner" value="true" /> 
    <preference name="auto-hide-splash-screen" value="true" /> 
    <preference name="disable-cursor" value="false" /> 
    <preference name="android-minSdkVersion" value="10" /> 
    <preference name="android-targetSdkVersion" value="19" /> 
    <preference name="android-installLocation" value="auto" /> 

    <gap:plugin name="org.apache.cordova.camera" source="npm"/> 
    <gap:plugin name="org.apache.cordova.media-capture" source="npm"/> 
    <gap:plugin name="org.apache.cordova.console" source="npm" /> 
    <gap:plugin name="org.apache.cordova.device" source="npm" /> 
    <gap:plugin name="org.apache.cordova.device-motion" source="npm"/> 
    <gap:plugin name="org.apache.cordova.device-orientation" source="npm"/> 
    <gap:plugin name="org.apache.cordova.dialogs" source="npm"/> 
    <gap:plugin name="org.apache.cordova.file" source="npm"/> 
    <gap:plugin name="org.apache.cordova.file-transfer" source="npm"/> 
    <gap:plugin name="org.apache.cordova.geolocation" source="npm"/> 
    <gap:plugin name="org.apache.cordova.globalization" source="npm"/> 
    <gap:plugin name="org.apache.cordova.inappbrowser" source="npm"/> 
    <gap:plugin name="org.apache.cordova.media" source="npm"/> 
    <gap:plugin name="org.apache.cordova.network-information" source="npm"/> 
    <gap:plugin name="org.apache.cordova.splashscreen" source="npm"/> 
    <gap:plugin name="org.apache.cordova.vibration" source="npm"/> 
    <icon src="icon.png" /> 

    <gap:splash src="splash.png" gap:platform="android" gap:qualifier="port-ldpi" /> 
    <gap:splash src="splash.png" gap:platform="android" gap:qualifier="port-mdpi" /> 
    <gap:splash src="splash.png" gap:platform="android" gap:qualifier="port-hdpi" /> 
    <gap:splash src="splash.png" gap:platform="android" gap:qualifier="port-xhdpi" /> 
    <gap:splash src="splash.png" gap:platform="blackberry" /> 
    <gap:splash src="splash.png" gap:platform="ios" width="320" height="480" /> 
    <gap:splash src="splash.png" gap:platform="ios" width="640" height="960" /> 
    <gap:splash src="splash.png" gap:platform="ios" width="640" height="1136" /> 
    <gap:splash src="splash.png" gap:platform="ios" width="768" height="1024" /> 
    <gap:splash src="splash.png" gap:platform="ios" width="1024" height="768" /> 
    <gap:splash src="splash.png" gap:platform="winphone" /> 
    <access origin="*" /> 

    <gap:plugin name="com.phonegap.plugins.barcodescanner" source="npm" /> 
    <gap:plugin name="uk.co.workingedge.phonegap.plugin.launchnavigator" source="npm" /> 


    <!-- iPhone/iPod Touch - lower 4s --> 
    <icon src="icon-57.png" gap:platform="ios" width="57" height="57" /> 
    <icon src="icon.png" gap:platform="ios" width="114" height="114" /> 
    <icon src="icon-72.png" gap:platform="ios" width="72" height="72" /> 

    <!-- iPhone/iPod Touch - 5-5s --> 
    <icon src="icon.png" gap:platform="ios" width="60" height="60" /> 
    <icon src="icon.png" gap:platform="ios" width="120" height="120" /> 
    <!-- iPhone6-6+ --> 
    <icon src="icon.png" gap:platform="ios" width="180" height="180" /> 

    <!-- Settings Icon --> 
    <icon src="icon.png" gap:platform="ios" width="29" height="29" /> 
    <icon src="icon.png" gap:platform="ios" width="58" height="58" /> 

    <!-- Spotlight Icon --> 
    <icon src="icon.png" gap:platform="ios" width="40" height="40" /> 
    <icon src="icon.png" gap:platform="ios" width="80" height="80" /> 

    <plugin name="cordova-plugin-whitelist" version="1" source="npm"/> 

    <gap:plugin name="org.apache.cordova.device" version="0.2.3" source="npm"/> 
    <gap:plugin name="org.apache.cordova.geolocation" source="npm"/> 

    <feature name="http://api.phonegap.com/1.0/battery" /> 
    <feature name="http://api.phonegap.com/1.0/camera" /> 
    <feature name="http://api.phonegap.com/1.0/geolocation" /> 
    <feature name="http://api.phonegap.com/1.0/network" /> 
    <feature name="http://api.phonegap.com/1.0/notification" /> 

    <allow-intent href="http://*/*" /> 
    <allow-intent href="https://*/*" /> 
    <allow-intent href="tel:*" /> 
    <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> 
</widget> 

當我嘗試和執行一個按鈕,立即登錄,它從來沒有執行Ajax請求。我的HTML看起來像這樣:

<body> 

    <div class="row"> 
     <div class="col s12 m7"> 
      <div class="card"> 
       <div class="card-image"> 
        <img src="img/logo.png"> 

       </div> 
       <div class="card-content"> 
        <div class="row"> 
         <form class="col s12"> 
          <div class="row"> 
           <div class="input-field col s12"> 
            <input id="email" type="text" class="validate"> 
            <label for="email">Username</label> 
           </div> 

           <div class="input-field col s12"> 
            <input id="example" type="password" class="validate"> 
            <label for="example">Password</label> 
           </div> 
          </div> 

         </form> 
         <a id="login" class="waves-effect waves-light white-text btn orange">Login</a> 

         <a id="register" class="orange-text" style="float: right;" href="register.html">Register</a> 



        </div> 

       </div> 

      </div> 
     </div> 
    </div> 



    <!-- Scripts--> 

    <script src="js/jquery-2.1.4.min.js"></script> 
    <script src="js/init.js"></script> 
    <script src="js/materialize.js"></script> 
    <script src="js/home.js"></script> 



</body> 

而我的JS類似於此:

$(document).ready(function() { 


    //check if user has already logged in once 
    if (localStorage.getItem("userID") != null) { 
     window.localStorage.setItem("userID", localStorage.getItem("userID")); 
     window.location.replace("stats.html"); 
    } 

    //if user has logged in go to stats page 

    $("#login").click(function() { 
     var u = $('#email').val(); 
     var p = $('#example').val(); 
     alert("test1"); 
     $.get("http://www.beerportfolio.glass/app_login2.php", { 
       ex1: example1, 
       ex2: example 
      }) 
      .done(function (data) { 
       alert("test2"); 
       if (data.status == "no") { 
        alert("test3"); 
        mixpanel.track("Wrong User Name or password"); 
        alert("Wrong username and password"); 
       } else { 
        alert("test4"); 
        mixpanel.track("User logged In"); 
        //todo: store user name 
        mixpanel.identify(data.userID); 
        window.localStorage.setItem("userID", data.userID); 
        //redirect to statistics page 
        window.location.replace("stats.html"); 
       } 
      }); 

    }); 

當我在瀏覽器中執行我的桌面上的所有作品完美。但是當我用phonegap構建之後執行時,它只顯示執行中的「test1」,表明它不執行ajax調用。

}); 
+0

嘗試添加到您的配置文件 – Diptox

+0

現在試試,謝謝。它做什麼? – Mike

+0

@Diptox沒有工作 – Mike

回答

1

@Mike,
你有兩個選擇,回滾。之前4.0或前進

往前走,你需要閱讀更深入的文檔,您需要在HTML頁面中添加頁眉信息

見:。Cordova Whitelist Guidenpm version

下面是你需要從文件添加到您的網頁內容示例: <!-- Allow requests to foo.com --> <meta http-equiv="Content-Security-Policy" content="default-src 'self' foo.com">

更詳細信息,請訪問:
Top Mistakes by Developers new to Cordova/Phonegap 見#10

祝您好運

-1
$.get("http://www.beerportfolio.glass/app_login2.php", { 
       ex1: example1, 
       ex2: example 
}) 

檢查您的獲取請求參數。

example1example未定義。

+0

他們被定義。 – Mike

0

的原因是現在的PhoneGap不允許CORS阿賈克斯,如果你沒有明確允許這樣的origing:

<access origin="*" /> 

最快的解決方法是進行編譯一箇舊的PhoneGap版本。例如只添加這在你的config.xml

<preference name="phonegap-version" value="3.6.3" /> 
0

最近我有同樣的問題,我只是改變我的config.xml和它的作品,我用ajax,我config.xml中是這樣的。

<gap:plugin name="cordova-plugin-camera" version="1.2.0" source="npm" /> 
<gap:plugin name="cordova-plugin-whitelist" source="npm" /> 
<gap:plugin name="cordova-plugin-device" version="1.0.1" source="npm" /> 
<gap:plugin name="cordova-plugin-device-motion" version="1.1.1" source="npm" /> 
<gap:plugin name="cordova-plugin-device-orientation" version="1.0.1" source="npm" /> 
<gap:plugin name="cordova-plugin-dialogs" version="1.1.1" source="npm" /> 
<gap:plugin name="cordova-plugin-file" version="3.0.0" source="npm" /> 
<gap:plugin name="cordova-plugin-inappbrowser" version="1.0.1" source="npm" /> 
<gap:plugin name="cordova-plugin-splashscreen" version="2.1.0" source="npm" /> 
<gap:plugin name="cordova-plugin-vibration" version="1.2.0" source="npm" /> 
<gap:plugin name="cordova-plugin-sms" version="1.0.4" source="npm" /> 
<gap:plugin name="phonegap-plugin-barcodescanner" version="4.0.2" source="npm"/> 
<gap:plugin name="com.phonegap.plugins.pushplugin" version="2.5.0" /> 
<gap:plugin name="cordova-plugin-network-information" version="0.2.12" source="npm"/> 
<gap:plugin name="com.admob.plugin" version="5.0.4" source="plugins.cordova.io"/> 

我的要求:

$.ajax({ 
      beforeSend: function() {$('#div_carga').show();}, 
      complete: function(){$('#div_carga').hide();}, 
      type: "post", 
      url:"https://www.example.net/get_form.php", 
      data:{id:id}, 
      success: function(datos){ 
       $("#obten").remove(); 
       $("#contenidoForm").append("<div id='obten' name='obten'></div>"); 
       $('#prospectos').html(datos); 
      } 
     }); 

如果我使用的HttpRequest也很有效。