js发送数据php接收并解析显示

pal97

于 2021-04-29 10:21:20 发布

阅读量453

点赞数

分类专栏：自用文章标签： php javascript

本文链接：https://blog.csdn.net/pal97/article/details/116261362

版权

自用专栏收录该内容

12 篇文章 1 订阅

订阅专栏

1、js 用post发送json数据
2、php接收json数据并解析成数组

<?php 
if ($_SERVER['REQUEST_METHOD']==='POST'&&empty($_POST)){//判断如果是post并且$_POST为空则是json数据
	$content=file_get_contents('php://input');//获取json数据的固定写法，暂时不懂什么意识
	// $content=json_decode($content, true);
	$file=fopen('./record/jsontest.txt', 'w');
	fwrite($file,$content);
	fclose($file);
	
	echo $content;
	exit();//php退出，不返回下面的html代码
}
// 1、通过js发送json数据，php获取后返回原数据，js再利用eval('('+content+')')解析


 ?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button id='btn'>按钮</button>
    <?php 
    $_file=fopen('./record/jsontest.txt','r');
    $content=fread($_file,filesize('./record/jsontest.txt'));
    $content=json_decode($content,true);//第二个参数true则返回数组类型，默认flase则是对象类型,
    // echo $content['a']];
    // var_dump($content);
    fclose($_file);
    foreach ($content as $key => $value) {
    	echo $key,'=', $value;
    	echo "<br>";
    }

     ?>
    
    <script type="text/javascript">
    	var btn = document.querySelector("#btn");
    	
    	var data1={a:1,b:2,c:3};
    	data1.vison=navigator.appVersion;//navigator返回浏览器及计算机的很多信息，这里还没研究

    	data1=JSON.stringify(data1);//用js中内置对象JSON，将js对象转换成JSON字符串
    	
    	//data1=eval('('+data1+')')//eval函数是执行字符串函数，将JSON字符串转换成JSON对象，注意要用单引号
			  
    	
    	btn.onclick = function() {
        	var xml = new XMLHttpRequest();
	        xml.open("POST",location.href,true)
	        //下面是发送json数据的固定写法
	        xml.setRequestHeader("Content-type", "application/json");
	        xml.setRequestHeader("kbn-version", "5.3.0");	        
	        xml.send(data1);	        
	        xml.onreadystatechange = function () {
		        if (xml.readyState == 4 && xml.status == 200) {
		        	var content=xml.responseText;
		        	//解析获取的json数据
		        	content=eval('('+content+')')
		        	console.log(content.b);
		        }
		    }
    	}	
    </script>
</body>

</html>