Question

我正在通过phonegap进行原生应用。

首先，我在mvc中制作了rest api，我的所有函数都返回json行为并允许get。

然后我做了一个像index.html这样的html文件然后这个文件在firefox中运行并得到错误，如第三方跨域错误和此错误我已经修复了在我的web.config和现在正常工作的一些代码我的浏览器中的ajax代码

那么这个html页面我是简单的复制粘贴在eclips中并在模拟器中运行我的应用程序并且看起来很好但我的ajax调用总是错误。

我跟着这样的步骤：

1）config.xml文件中的<access origin="*" /><access origin="http://www.testsite.com:8090/Controller/Actionname" />

2）androidMenifest.xml文件中的<uses-permission android:name="android.permission.INTERNET" />

但仍然是ajax失败

Html代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Unable to zooming device-->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap-theme.min.css">

<script src="js/jquery-2.1.1.min.js" ></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>

</head>
<body>
<section id="login">
    <div class="container">
        <div class="row">
            <div class="col-xs-12">
                <div class="form-wrap">
                <h1>Log in with your email account</h1>
                  <!--  <form role="form" action="javascript:;" method="post" id="login-form" autocomplete="off">-->
                        <div class="form-group">
                            <label for="email" class="sr-only">Email</label>
                            <input type="email" name="email" id="email" class="form-control" placeholder="somebody@example.com">
                        </div>
                        <div class="form-group">
                            <label for="key" class="sr-only">Password</label>
                            <input type="password" name="key" id="key" class="form-control" placeholder="Password">
                        </div>
                        <input type="button" id="btn-login" class="btn btn-custom btn-lg btn-block" value="Log in">
                    <!--</form>-->
                    <a href="javascript:;" class="forget" data-toggle="modal" data-target=".forget-modal">Forgot your password?</a>
                    <hr>
                </div>
            </div> <!-- /.col-xs-12 -->
        </div> <!-- /.row -->
    </div> <!-- /.container -->
</section>


</body>

</html>

Ajax代码如下：

<script charset="utf&minus;8" type="text/javascript">
$(document).bind("mobileinit", function() {
    $.support.cors = true;
    $.mobile.allowCrossDomainPages = true;
});

$(document).ready(function(){
$("#btn-login").click(function(){
var email = $("#email").val();
var pwd = $("#key").val();
var URL = "http://www.testsite.com:8090/Controller/ActionName?email=abc@abc.com&password=123123&apiToken=45retw54fgw45fgq345fg"; //iis url
var URL1 = "http://localhost:15536/Controller/ActionName?email=abc@abc.com&password=123123&apiToken=45retw54fgw45fgq345fg";

             $.ajax({
                url: URL,
                type:"POST",
                datatype:"json",
                success: function (data) {
                console.log(data.data);
                window.location.href="welcome.html";
                },
                error : function(xhr, ajaxOptions, thrownError) {
                alert(xhr.status);
                alert(thrownError);
                }
            });

});
});

</script>

Answer 1

您获得的零是您的服务器响应代码。您的请求将作为跨域请求被阻止。您的桌面浏览器允许此操作，但手机屏幕不允许这样做。尝试使用jsonp和ajax get请求来解决这个跨域拒绝问题。修改它以满足您的需要并修改您的脚本以获取get输入： $.ajax({timeout: 5000, url: 'http://yoursite.com/yourscript.php', dataType: "jsonp", callback: 'callback', jsonpCallback: 'yourcallback', type: "GET", crossDomain: true, data: {'scriptinput':'data string you send'} }); function yourcallback(response) { console.log(response); } 确保将响应作为json字符串包装在函数调用yourcallback(yourjsonstring)中。以下是PHP中服务器端如何为我工作的一个示例。希望您能从中了解如何修改iis服务器端脚本。

function SendAnswer($response)  {
    // Allow from any origin
    if (isset($_SERVER['HTTP_ORIGIN'])) {
        header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
        header('Access-Control-Allow-Credentials: true');
    }
    // Access-Control headers are received during OPTIONS requests
    if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
            header("Access-Control-Allow-Methods: GET, OPTIONS");         

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
            header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
    }
    header("content-type: application/json");
    $callback = filter_input(INPUT_GET, 'callback', FILTER_SANITIZE_SPECIAL_CHARS);
    echo  "$callback(" . json_encode($response) . ")";
}

祝你好运。

Ajax没有在phonegap上工作

1 个答案: