XMLHTTPRequest resulting in Aw, snap in chrome
XMLHTTPRequest resulting in Aw, snap in chrome
我正在使用三.js制作基于服务器的多人游戏。服务器应该像这样工作
游戏-->服务器2.php-->服务器.txt
游戏-->服务器.php-->服务器.txt-->游戏
这种工作方式是
1.） 游戏生成
2.）每个元素都添加到一个名为sendtoserver的数组中
3.） 发送服务器通过开机自检发送到服务器 2.php
4.） 服务器 2.php 将发送服务器写入服务器.txt
5.） 然后，post 请求打开对服务器的 get 请求.php
6.） 服务器.php读取服务器.txt并返回结果
但是，chrome 正在运行请求并给出 aw 快照错误。这是代码
索引.html：
<!DOCTYPE html>
<!--
Controls:
Up Arrow to Move Foward
Down Arrow to Move Backward
Left Arrow to Move Left
Right Arrow to Move Right
1 to Move Up
2 to Move Down
3 to Rotate Left
4 to Rotate Right
5 to Rotate Up
6 to Rotate Down
-->
<html>
<head>
<meta charset="utf-8">
<title>Rotating Cube</title>
</head>
<body>
<!--Import three.js and jquery-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r74/three.js">
</script>
<script src="jquery.js">
</script>
<!--Set up camera-->
<script>
var sendtoserver=["server:online"];
getServerStatus=function(){
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
var response=xhttp.responseText;
response=response.substring(0, response.indexOf('<'));
alert(response);
}
};
xhttp.open("GET", "Server.php", true);
xhttp.send();
}
turnserveron=function(){
$.post( "Server2.php",{
data:sendtoserver
},function(){
getServerStatus();
});
}
Math.radians = function(degrees) {
return degrees * Math.PI / 180;
};
function getrandomdirection(){
return Math.radians(Math.round(Math.random()*360));
}
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
function render(){
requestAnimationFrame( render );
renderer.render( scene, camera );
}
//some non-essential camera commands were deleted here
function house(x,y,z,bodycolor1,bodycolor2,bodycolor3,roofcolor1,roofcolor2,roofcolor3,rotation){
var geometry = new THREE.BoxGeometry( 3, 3, 3 );
var material = new THREE.MeshBasicMaterial( { color:"rgb("+bodycolor1+","+bodycolor2+","+bodycolor3+")" } );
var cube = new THREE.Mesh( geometry, material );
var geometry2 = new THREE.CylinderGeometry( 0, 2.3, 4, 4, 1 );
var material2 = new THREE.MeshBasicMaterial( { color: "rgb("+roofcolor1+","+roofcolor2+","+roofcolor3+")" } );
var roof= new THREE.Mesh(geometry2,material2);
cube.position.set(0+x,0+y,0+z);
roof.position.set(0+x,3.5+y,0+z);
roof.rotateY(0.7);
var doorgeo=new THREE.BoxGeometry(1,2,1);
var doormaterial=new THREE.MeshBasicMaterial({color:0xA52A2A});
var door=new THREE.Mesh(doorgeo,doormaterial);
door.position.set(0+x,-0.5+y,1+z)
var house = new THREE.Object3D();
house.add(cube);
house.add(roof);
house.add(door);
scene.add(house);
sendtoserver.push(house);
//fix this
house.rotateY(rotation);
}
renderer.setClearColor(0x00ffff, 1);
var texture = new THREE.TextureLoader().load( "Grass.jpg" );
texture.wrapS = THREE.RepeatWrapping;
texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 600, 600 );
var groundmaterial=new THREE.MeshBasicMaterial({map: texture});
var groundGeo = new THREE.PlaneGeometry(400,400);
ground=new THREE.Mesh(groundGeo,groundmaterial);
ground.position.y = -1.9;
ground.rotation.x = -Math.PI/2;
ground.doubleSided=true;
scene.add(ground);
sendtoserver.push(ground);
var sungeometry = new THREE.SphereGeometry( 1.875*50, 12*50, 12*50 );
var sunmaterial = new THREE.MeshBasicMaterial( {color: 0xffff00} );
var sun = new THREE.Mesh( sungeometry, sunmaterial );
sun.position.y=200;
sun.position.z=-200;
scene.add( sun );
sendtoserver.push(sun);
</script>
<script>
createtown=function(width){
for(var i=-width/2+3.3;i<width/2-3.3;i+=3.3){
house(i,0,0,Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.radians(0));
}
for(var j=3.3;j<width-3.3;j+=3.3){
house(-j,0,-width/2,Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.radians(90));
}
for(var j=3.3;j<width-3.3;j+=3.3){
house(j,0,-width/2,Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.radians(270));
}
for(var j=-width/2+3.3;j<width/2-3.3;j+=3.3){
house(j,0,-width,Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.round(Math.random()*255),Math.radians(180));
}
}
function changedirection(object){
object.rotation.y=getrandomdirection();
}
var villager=function(){
//edit this to draw villager
var villagerfacegeo = new THREE.BoxGeometry( 1, 1, 1 );
var facetexture = new THREE.TextureLoader().load( "villagerface.png" );
var villagerfacematerial=new THREE.MeshBasicMaterial({map: facetexture});
materials=[
villagerfacematerial,
new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} )
]
villagerface=new THREE.Mesh(villagerfacegeo,new THREE.MeshFaceMaterial( materials ));
scene.add(villagerface);
villagerface.position.z=10;
villagerface.position.y=2;
sendtoserver.push(villagerface);
window.setInterval(function(){changedirection(villagerface);},5000);
}
</script>
<!--Actual Program-->
<script>
createtown(99);
//villager();
camera.position.z = 5;
camera.rotation.y=getrandomdirection();
var stevefacegeo = new THREE.BoxGeometry( 1, 1, 1 );
var stevefacetexture = new THREE.TextureLoader().load( "villagerface.png" );
var stevefacematerial=new THREE.MeshBasicMaterial({map: stevefacetexture});
materials=[
stevefacematerial,
new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} ),new THREE.MeshBasicMaterial( {color: 0xffff00} )
]
steveface=new THREE.Mesh(stevefacegeo,new THREE.MeshFaceMaterial( materials ));
scene.add(steveface);
steveface.position.z=5;
steveface.rotation.y=camera.rotation.y;
sendtoserver.push(steveface);
//Below this is non important camera controls
</script>
</body>
</html>
服务器.php
<?php
$myfile = fopen("Server.txt", "r") or die("Unable to open file!");
echo fread($myfile,filesize("Server.txt"));
fclose($myfile);
?>
服务器2.php
<?php
$myfile = fopen("Server.txt", "w") or die("Unable to open file!");
foreach ($_POST[sendtoserver] as $value)
fwrite($myfile,$value);
fclose($myfile);
?>
本网站在线网址为 rotatingcube.site88.net
你需要修改 server2.php 文件中的代码，
首先，不要回显数组，否则会产生转换错误。如果你想检查数组中的内容，也许可以使用print_r（array）或var_dump（array）。
其次，您不能直接将数组写入文件，按照 $_POST['sendtoserver'] 中的数组结构进行循环访问，然后将字符串写入文本文件。您可以使用print_r（$_POST['sendtoserver']）;要查看数组结构，您应该能够在控制台（Firebug/浏览器控制台）中看到该结构，因为它在 Ajax 上。
使用 foreach - http://php.net/manual/en/control-structures.foreach.php
没
关系，这是我的服务器设置错误，我已经修复了。但是，你们修复了我的php代码中存在问题。感谢您的所有帮助。
相关文章：
- Node.js's Buffer.writeFloatBE in Javascript
- Setting default onclick behavior for <img> tag in gene
- Lucene Search in Alfresco
- grep in JQuery to C#
- write HTML in JavaScript
- jQuery setTimeOut: in for-loop
- Snap(）方法导致Uncaught TypeError
- SetTimeout and clearTimeout in Javascript
- lightbox in html 5 and javascript
- HTMLInputElement in IE7
- Mongodb$in以与数组中相同的顺序获取结果
- element.dataset in Internet Explorer
- jQuery parent() in table
- Instagram oauth flow in angularjs
- 使用Snap.SVG设置关于端点的SVG行的动画
- In循环的In运算符前后
- 如何使用for in循环在javascript中显示对象中的对象
- Jquery change onchange in onload
- 重构 jQuery in JS 问题
- XMLHTTPRequest resulting in Aw, snap in chrome
