javascript — получение данных php из jQuery ajax без HTML-форм
Моя идея состоит в том, чтобы написать одностраничное веб-приложение с использованием jQuery и со стороны сервера в php, я хочу сделать это без использования HTML-форм. Пока у меня есть этот новый файл .php:
<?php
echo "Welcome";
?>
И JavaScript
$(document).ready(function() {
$.ajax({
type: 'GET',
url: 'http://localhost/pmfServer/new.php',
success: function (data) {
alert('success' + data);
},
error: function(jqXHR,error, errorThrown) {
alert("Something went wrong " + errorThrown);
}
});
});
Оповещение, которое я получаю, это просто «успех» и ничего больше.
У меня работает веб-сервер Apache, и когда я набираю тот же URL в веб-браузере, он говорит «добро пожаловать».
Это правильный способ сделать на стороне сервера, так как я не собираюсь использовать формы?
Должен ли я использовать некоторые рамки для этого?
Решение
Попробуй это:
$(document).ready(function() {
$.ajax({
type: 'GET',
url: 'http://localhost/pmfServer/new.php'
}).done(function(response){
var response = $.trim(response);
alert(response);
});
});
Если вы все еще не получили ответ от ajax, пожалуйста, проверьте ваш путь (url: ‘….’)
Также проверьте вашу консоль на наличие ошибок …
И последнее: файлы Ajax не всегда должны быть доступны напрямую из браузеров … Возможно, вы захотите защитить их (хотя они по-прежнему будут доступны для xmlhttprequest:
<?php
//protect the file from un-auth access
define('AJAX_REQUEST', isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest');
if(!AJAX_REQUEST) {die();}
echo "Welcome";
?>
Конечно, в вашем конкретном случае «Добро пожаловать», в этом может не быть необходимости … Я просто имею в виду более «чувствительные» файлы ajax;)
Другие решения
Старые функции, которые я сделал, позволяют вам также сделать запрос AJAX на URL.
function Get(t,e,n){!function(){var s=new XMLHttpRequest;s.onreadystatechange=function(){4==s.readyState&&200==s.status?(e(s.responseText),s=void 0):s.status>=500&&(s=void 0,n(0))},t+=t.indexOf("?")>-1?"&tsmp="+Date.now():"?tsmp="+Date.now(),s.open("GET",t,!0),s.send()}()}
function Post(t,e,n,o){!function(){var s=new XMLHttpRequest;s.onreadystatechange=function(){4==s.readyState&&200==s.status?(n(s.responseText),s=void 0):s.status>=500&&(s=void 0,o(0))},t+=t.indexOf("?")>-1?"&tsmp="+Date.now():"?tsmp="+Date.now(),s.open("POST",t,!0),s.setRequestHeader("Content-type","application/x-www-form-urlencoded"),s.send(e)}()}
Это очень просто использовать … если вы хотите использовать jQuery:
Get("http://localhost/pmfServer/new.php",function(msg){alert(msg)},function(err){alert("Error")})
Это для публикации данных и после получения:
Post("http://example.com/yourtext.php","wow=1",function(msg){alert(msg)},function(err){alert("Error")})
Также посмотрите, нет ли ошибок в консоли.
И … Я рекомендую вам использовать encodeURIComponent при отправке строки с данными пользователя.
encodeURIComponent("ÃÃO.. ! @ # $ % Ohh! & %><")
Убедитесь, что ваш файл .html находится рядом с .php и измените URL в коде JavaScript на «new.php» следующим образом
$(document).ready(function() {
$.ajax({
type: 'GET',
url: 'new.php',
success: function (data) {
alert('success' + data);
},
error: function(jqXHR,error, errorThrown) {
alert("Something went wrong " + errorThrown);
}
});
});
Я предлагаю использовать фреймворк для одностраничного приложения, такого как http://durandaljs.com/