代码之家 › 专栏 › 技术社区 › misha sachenko

XML HTTP请求无法从JS向我的PHP文件发送请求

xmlhttprequest cookies xml jquery php

misha sachenko · 技术社区 · 6 年前

在里面 log.js 由于某种原因,下面的函数不起作用,我真的希望它起作用,也许有人知道如何使用post而不是get,这样我就不必使用cookie来检索PHP文件中的登录信息

function refreshData(file,msg){
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("GET", file);
  xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  xmlhttp.send();
  xmlhttp.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
      location.reload();
    } else {
      swal(msg);
    };
  }
}

但是如果没有请求,当我用这个函数替换这个函数时,一切都很好,但它打开了一个新选项卡

function refreshData(file,msg){
  window.open("login.php");
}

这是我的 index.php :

<DOCTYPE! HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<script src="/cafe/script/main2.js"></script>
	<link rel='stylesheet' type='text/css' href='../style/main.css' media='screen' />
</head>
<body>

<div align='left' class='nav-top'>
	<a class='logo' id='logo'>kush.</a>
	<a class='logo2' id='logo'>by</a>
	<a href='../novosti' id='btnNews'>news</a>
	<a href='../zavedenia' id='btnPlaces'>places</a>
	<a href='../kontakty' id='btnContacts'>contacts</a>
	<a href='../blog' id='btnBlog'>blog</a>
<script src='log.js'></script>
</body>
</html>

这是我的日志。js公司

var authentication = "no";
var authentication=getCookie("auth");
var email=getCookie("email");

	if(authentication=="logged_in")
	{
		//some code
		if(email.indexOf("@cafe.eda")>-1)
		{
			loadCafeProfile(email);
		}
		else
		{
			loadPersonProfile(email);
		}
	}
	else
	{
		//some code
		var login = document.getElementById("btnLogIn");
		login.addEventListener('click', logIn);
	}

	function logIn()
	{
		var email = document.getElementById("InputEmail").value;
		var pass = document.getElementById("InputPass").value;
		var re = /^[a-zA-Z0-9]+$/i;
		if(!validateEmail(email))
		{
			swal("check  email");
		}
		else if(pass.length<6)
		{
			swal("max password length 6 char");
		}
		else
		{
			setCookie("email",email,1);
			setCookie("pass",pass,1);
			refreshData("login.php","login in");
		}
	}

function validateEmail(email)
{
    //email validation
    return //true false
}

function setCookie(cname,cvalue,exdays)
{
	var d = new Date();
	d.setTime(d.getTime()+(exdays*24*60*60*1000));
	var expires="expires="+d.toGMTString();
	document.cookie=cname+"="+cvalue+";"+expires+";path=/";
}

function getCookie( name )
{
    var dc = document.cookie;
    var prefix = name + "=";
    var begin = dc.indexOf("; " + prefix);
    var end = null;
    if (begin == -1)
    {
        begin = dc.indexOf(prefix);
        if (begin != 0)
        {
        	return null;
        }
        end = document.cookie.indexOf(";", begin);
    } 
    else
    {
        begin += 2;
        end = document.cookie.indexOf(";", begin);
        if (end == -1)
        {
            end = dc.length;
        }
    }
    return decodeURI(dc.substring(begin + prefix.length, end) ).replace(/"/g, '');
}



function loadCafeProfile(email)
	{
		//load cafe profile
	}
	function loadPersonProfile(email)
	{
		//loads persons profile
	}

function refreshData(file,msg){
      var xmlhttp = new XMLHttpRequest();
      xmlhttp.open("GET", file);
      xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      xmlhttp.send();
      xmlhttp.onreadystatechange = function() {
        if (this.readyState === 4 && this.status === 200) {
          location.reload();
        } else {
          swal(msg);
        };
      }
    }

这是我的登录名。php

<?php
$ini_array = parse_ini_file("../../db.ini");
$servername=$ini_array['sn'];
$username=$ini_array['un'];
$password=$ini_array['pw'];
$dbname=$ini_array['dn'];
	setcookie("jumbo","jumbo",time()+3600,'/');
	$conn=new mysqli($servername,$username,$password,$dbname);
	
	//check conection
	if(!$conn)
	{
		setcookie('error','connection_fail',time()+3600,'/');
		//header("Location:../cafe");
	}
	$email=mysqli_real_escape_string($conn,$_COOKIE['email']);
	$pass=mysqli_real_escape_string($conn,$_COOKIE['pass']);

	$email = filter_var($email, FILTER_SANITIZE_EMAIL);

// Validate e-mail and password
if (filter_var($email, FILTER_VALIDATE_EMAIL) && !preg_match('/[^A-Za-z0-9]/', $pass))
{
	$pass=md5(sha1(md5($pass)));
	if(strpos($email,'@cafe.eda')!==false)
	{
		$sql="SELECT * FROM cafe WHERE email='".$email."' and parol='".$pass."'";
	}
	else
	{
		$sql="SELECT * FROM rebyata WHERE email='".$email."' and parol='".$pass."'";
	}
	$result = mysqli_query($conn, $sql);
	if ($row = mysqli_fetch_array($result, MYSQLI_BOTH))
	{
		setcookie('auth','logged_in',time()+3600*2400,'/');
		setcookie('ses',md5($email.$pass),time()+3600*2400,'/');
		//echo "<script>window.close();</script>";
	}
	else
	{
		setcookie('error','loginfail',time()+3600*2400,'/');
		//header("Location:../cafe");
	}
}
else
{
	setcookie('error','wrong_input',time()+3600*2400,'/');
	//header("Location:../cafe");
}
?>

1 回复 | 直到 6 年前

Sam 6 年前

好吧,所以不用 cookies 使用 xmlHttpRequest() 您可以使用 send() 作用

Web API | MDN:

send()接受一个可选参数,用于指定请求的正文;这主要用于PUT等请求。如果请求方法为GET或HEAD,则忽略body参数,并将请求body设置为null。

对象

发送() 允许参数;在这种情况下,您可以在 object

.send({
  user: email,
  pass: password
});

然后在PHP中 $_POST 将数据放入正确的数组:

if($_POST)
{
    $email = $_POST['user'];
    $password = $_POST['pass'];
}

序列化

或者可以将数据序列化为字符串:

var params = "email="+ email + "&pass="+ password;

然后发送:

.send(params);

如果您使用的是jQuery,那么也可以使用其方便的little serialize() 作用

$('form').serialize();

这将简单地将项目放入一个字符串中,如上所示。

一旦您在 login.php 如果序列化,则可以解析字符串,如果将其放入对象中,则可以使用标准 $\u帖子 变量

if($_POST)
{
    parse_str($_POST, $form);
    // you can now get the post data into an array:
    $form['email'];
    $form['password'];
}

决议

你的 login() 功能:

function logIn() {
    var email = document.getElementById("InputEmail").value;
    var pass = document.getElementById("InputPass").value;
    var re = /^[a-zA-Z0-9]+$/i;
    if (!validateEmail(email)) {
        swal("check  email");
    } else if (pass.length < 6) {
        swal("max password length 6 char");
    } else {
        refreshData("login.php", {
                email: email,
                password: pass
        });
    }
}

然后你的 refreshData() 函数如下所示:

function refreshData(file, data) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open("POST", file);
    xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xmlhttp.send(data);
    xmlhttp.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
            location.reload();
        } else {
            swal(msg);
        };
    }
}

承诺

或者,更好的是,您可以使用 fetch() 哪一个更好(更新)的替代品 xmlHttpRequest .你也可以使用承诺-这很有效。

function refreshData(url, data) {
    return fetch(url, {
        body: JSON.stringify(data),
        cache: 'no-cache',
        method: 'POST',
        mode: 'cors'
    })
    .then(function(response){
        return response.json();
    })
    .catch(function(e) {
            console.log("Error: ", e);
    });
}

这是实现AJAX调用的新方法,如果您感兴趣,请看 MDN's documentation ,他们都很好,也有很好的例子。