从 Javascript 调用 PHP 网络服务答案

【问题标题】：Calling PHP webservice from Java script从 Javascript 调用 PHP 网络服务
【发布时间】：2012-03-22 00:46:13
【问题描述】：

我是 PHP 和 Javascript 开发的新手，我正在尝试执行此代码但它失败了

<?php
if(isset($_POST['username']) and isset($_POST['password'])) {

 // do logic for logining in (usually query your db)
if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
$data['success'] = true;
$data['message'] = 'Login succesful';
} else {
$data['success'] = false;
$data['message'] = 'Login failed';
}
// return json
echo json_encode($data);

}
?>

这里是 Javascript 文件

<script>
    $(document).ready(function() {
    alert("dddd");
        $('#loginForm').submit(function() {
            $('#output').html('Connecting....');
            var postTo = 'http://localhost/Login/login.php';
            alert(postTo);
            $.post(postTo,{username: $('[name=username]').val() ,   password: $('[name=password]').val()} , 
                function(data) {

                    if(data.message) {
                        alert(data);
                    } else {
                        $('#output').html('Could not connect');
                    }

                },'json');

            return false;
        });
    });
</script>

请帮忙，在此先感谢您！

【问题讨论】：

您能否提供有关它如何失败的更多信息？你得到一个javascript错误吗？ data.message 是否会收到警报？
它显示 Connecting.... 字符串，并且不提醒 (data.message)。
但是当我把 $('#output').html('Connecting....');在 $.post 之后，它会被执行
如果我不定义 $data 会不会出错？，我尝试删除所有 if 条件，只删除 $data['success'] = true; $data['message'] = 'Login succesful';，它会在浏览器中显示创建的 JSON，也就是我只从浏览器尝试的时候
@user1284732，是的，这可能是问题所在。没有定义就不能使用变量。

标签： php javascript jquery javascript-events

【解决方案1】：

假设 $data 没有在任何地方定义，这应该可以解决它：

<?php
    $data = Array();
    if(isset($_POST['username']) and isset($_POST['password'])) {

         // do logic for logining in (usually query your db)
        if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
        $data['success'] = true;
        $data['message'] = 'Login succesful';
    } else {
        $data['success'] = false;
        $data['message'] = 'Login failed';
    }
    // return json
    echo json_encode($data);

    }
?>

【讨论】：

【解决方案2】：

有趣的是，它在 Firefox 中对我有用。不久前我遇到了 IE 的问题，解决方案是将正确的标头添加到 php 脚本的顶部：

<?php
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');
...

编辑：通过从另一台机器调用它来复制它。尝试将var postTo = 'http://localhost/test/test.php'; 更改为var postTo = 'test/test.php';。

这是我测试的内容（我建议您使用 firebug 和 console.log() 而不是 alert()）：

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('#output').html('somestuff');

    $('#loginForm').submit(function() {
        $('#output').html('Connecting....');
        var postTo = 'http://localhost/test/test.php';
        //alert(postTo);
        $.post(postTo,{username: $('[name=username]').val() ,   password:  $('[name=password]').val()} , 
            function(data) {

                if(data.message) {
                   //  console.log(data);
                    $('#output').html('Ya got it: '+ data.message);
                } else {
                    $('#output').html('Could not connect');
                }

            },'json');

        return false;
    });
});
</script>
</head>

<body>
<form id="loginForm">
    <input type="text" name="username" value="test"/>
    <input type="text" name="password" value="test"/>
    <input type="submit"  />
</form>
<div id="output"></div>
</body>

【讨论】：

【解决方案3】：

if(isset($_POST['username']) and isset($_POST['password'])) {

应该是

if(isset($_POST['username']) && isset($_POST['password'])) {

作为第一次更正。

【讨论】：

很确定这不是真的。 php.net/manual/en/language.operators.logical.php
@user1284732，是的，显然唯一的区别是它们的运算符优先级。 php.net/manual/en/language.operators.precedence.php
@Walkerneo - 使用“and”而不是“&&”仅仅意味着如果第一个测试失败，第二个测试将不会被测试。此代码可用于所需目的。
@Eli，此处的页面：php.net/manual/en/language.operators.logical.php 表示所有四个运算符 ||、&&、and 和 or 都是短路的，区别在于它们逻辑优先。

【解决方案4】：

安装带有 Firebug 扩展的 Firefox，使用 F12 打开它，启用“NET”、“SCRIPT”和“CONSOLE”选项卡。使用 SCRIPT 选项卡在脚本中放置一个断点（在 alert(postTo) 周围）。刷新页面并单步执行，监控控制台。使用 NET 选项卡检查 php 脚本的请求和响应是否正确。

上面的代码在我的环境中工作，（alert(data) 到 alert(data.message) 的轻微变化）。以下对我有用：

<?
if(isset($_POST['username']) and isset($_POST['password'])) {
// do logic for logining in (usually query your db)
if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
$data['success'] = true;
$data['message'] = 'Login succesful';
} else {
$data['success'] = false;
$data['message'] = 'Login failed';
}
// return json
echo json_encode($data);

}
?>

<head>
<script type='text/javascript' src='jq/jquery.js'></script>

<script type='text/javascript'>
    $(document).ready(function() {
        alert("dddd");
        $('#loginForm').submit(function() {
            $('#output').html('Connecting....');
            var postTo = 'http://localhost/login.php';
            alert(postTo);
            $.post(postTo,{username: $('[name=username]').val() ,   password: $('[name=password]').val()} , 
                function(data) {

                    if(data.message) {
                        alert(data.message);
                    } else {
                        $('#output').html('Could not connect');
                    }

                },'json');

            return false;
        });
    });
</script>
</head>

<body>
<form id='loginForm'>
  <input type='text' id='username' name='username'/>
  <input type='text' id='password' name='password'/>
  <button type='submit'>Submit</button>
</form>
</body>

【讨论】：