Angular AJAX 发布问题
Posted
技术标签:
【中文标题】Angular AJAX 发布问题【英文标题】:Angular AJAX post Issue 【发布时间】:2015-11-11 13:41:24 【问题描述】:我正在开发一个 ionic 应用程序,该应用程序需要将用户提交的信息发布到数据库。我正在与为此表单提交创建单独的 php 脚本的人合作,但是每次我尝试从应用程序发布时,我要么在不使用代理时遇到 cors 问题,要么在使用 json afeld 时遇到 404 错误......
PHP 看起来像这样:
<?php
$data = json_decode(file_get_contents("php://input"));
$celeb = $data->celeb;
$camp = $data->camp;
$spirit = $data->spirit;
$sport = $data->sport;
$bizs = $data->bizs;
$entrep = $data->entrep;
$young = $data->young;
$conser = $data->conser;
$saty = $data->saty;
$name = $data->name;
$surname = $data->surname;
$email = $data->email;
$contacts = $data->contacts;
$con = mysql_connect('localhost', 'yarp', 'arpi');
mysql_select_db('yeah', $con);
$qry_em = 'select count(*) as cnt from users where email ="' . $email . '"';
$qry_res = mysql_query($qry_em);
$res = mysql_fetch_assoc($qry_res);
if ($res['cnt'] == 0)
$qry = 'INSERT INTO test (celeb,camp,spirit,sport,bizs,entrep,young,conser,saty,name,surname,email,contacts) values ("' . $celeb . '","' . $camp . '",' .$spirit . ','.$sport. ','.$bizs. ','.$entrep. ','.$young. ','.$conser. ','.$saty. ','.$name. ','.$surname. ','.$email. ','.$contacts. ')';
$qry_res = mysql_query($qry);
if ($qry_res)
$arr = array('msg' => "Submitted Successfully!!!", 'error' => '');
$jsn = json_encode($arr);
print_r($jsn);
else
$arr = array('msg' => "", 'error' => 'Error In Submit');
$jsn = json_encode($arr);
print_r($jsn);
else
$arr = array('msg' => "", 'error' => 'A submit has already been cast using this email');
$jsn = json_encode($arr);
print_r($jsn);
?>
我的控制器如下所示:
.controller('FrmController', function ($scope , $http)
$scope.errors = [];
$scope.msgs = [];
$scope.vote = function()
$scope.errors.splice(0, $scope.errors.length);
$scope.msgs.splice(0, $scope.msgs.length);
$http.post('https://jsonp.afeld.me/?url=http://www.examplesite.com/submit.php',
'celeb' : $scope.celeb,
'camp' : $scope.camp,
'spirit' : $scope.spirit,
'sport' : $scope.sport,
'bizs' : $scope.bizs,
'entrep' : $scope.entrep,
'young' : $scope.young,
'conser' : $scope.conser,
'saty' : $scope.saty,
'name' : $scope.name,
'surname' : $scope.surname,
'email' : $scope.email,
'contacts' : $scope.contacts
).success(function(data, status, headers, config)
if (data.msg != '')
console.log(data.msg);
$scope.msgs.push(data.msg);
else
console.log(data.error);
$scope.errors.push(data.error);
).error(function(data, status)
$scope.errors.push(status);
);
)
submit.php 文件肯定在地址,所以我不太确定我哪里出错了......
【问题讨论】:
【参考方案1】:正如 Jess Paton 所说,您应该使用它。然而,一个更好的例子(来自我的博客文章,链接如下)是:
<?php
//http://***.com/questions/18382740/cors-not-working-php
if (isset($_SERVER['HTTP_ORIGIN']))
header("Access-Control-Allow-Origin: $_SERVER['HTTP_ORIGIN']");
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Max-Age: 86400'); // cache for 1 day
// 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, POST, OPTIONS");
if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
header("Access-Control-Allow-Headers: $_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']");
exit(0);
//http://***.com/questions/15485354/angular-http-post-to-php-and-undefined
$postdata = file_get_contents("php://input");
if (isset($postdata))
$request = json_decode($postdata);
$username = $request->username;
if ($username != "")
echo "Server returns: " . $username;
else
echo "Empty username parameter!";
else
echo "Not called properly with username parameter!";
?>
如需更多信息,如果您有兴趣,我编写了关于如何将数据从 Ionic 应用程序发布到 PHP 服务器的分步教程,以及Github example,您可以在此处查看:http://www.nikola-breznjak.com/blog/codeproject/posting-data-from-ionic-app-to-php-server/。
【讨论】:
非常感谢您的评论和链接。我现在似乎正在处理 PHP 代码,但我收到一个错误,我假设数据库端的某些东西正在阻止代码通过,否则我的控制器不正确 当然,没问题。如果答案被证明是有帮助的,请考虑将其标记为这样。至于您的错误,始终值得检查服务器日志中是否存在任何 PHP 错误。至于客户端,如果您使用的是 Chrome,您可以随时查看开发工具(或类似工具)。 感谢您的回答!【参考方案2】:所以我对php不太了解,但我很确定你需要在你的php文件中启用cors:
<?php
header("Access-Control-Allow-Origin: *");
注意:与 PHP 标头函数的所有用途一样,这必须在从服务器发送任何输出之前。
【讨论】:
以上是关于Angular AJAX 发布问题的主要内容,如果未能解决你的问题,请参考以下文章
无法使用 Angular 7 中的 FormData 发送带有 Ajax 的文件
使用 Jquery Ajax 后,Angular 函数突然不起作用