释放双眼，带上耳机，听听看~！
目录
硬件
- PHPoC Blue（+ USB WLAN）或PHPoC Black（+以太网）
- Micro USB转USB线（将源代码上传到PHPoC设备）
快速步骤
此示例的源代码是PHPoC支持包（PSP）的一部分。你需要：
- 下载PHPoC支持包。
- 将示例\ p4s \ 04.html5_text \ 00.hello上传到PHPoC Blue / Black。
- 配置网络参数（例如WiFi SSID，密码，IP地址……）。
- 单击PHPoC Debugger上的“运行”按钮。
- 使用PC或智能手机上的Web浏览器访问PHPoC上的网页
如果您是第一次使用PHPoC，请参阅如何使用PSP。
源代码
源文件包括：
- init.php：当PHPoC系统上电或复位时，运行此文件。它用于指定运行的文件是系统循环。
- task0.php：此文件在PHPoC设备的系统循环中运行。它充当WebSocket服务器并且还与之交互。
- index.php：此文件包含网页的源代码。它仅在响应Web浏览器的请求时运行。它包含网页（用户界面）并充当WebSocket客户端。
init.php
该文件在PHPoC系统上电或复位时运行。它用于指定 task0.php运行是系统循环。
PHP代码：
<?php
system("php task0.php");
?>
task0.php
[完整代码]
PHP代码：
<?php
if(_SERVER("REQUEST_METHOD"))
exit; // avoid php execution via http request
include "/lib/sd_340.php";
include "/lib/sn_tcp_ws.php";
ws_setup(0, "WebConsole", "text.phpoc");
while(1)
{
if(ws_state(0) == TCP_CONNECTED)
{
ws_write(0, "hello, world!\r\n");
sleep(1);
}
}
?>
[说明]
该文件的源代码：
- 设置并初始化WebSocket。
在无限循环中：
- 发送’你好，世界！’ 通过WebSocket访问Web浏览器。
index.php
[完整代码]
PHP代码：
<html>
<head>
<title>PHPoC / <?echo system("uname -i")?></title>
<meta name="viewport" content="width=device-width, initial-scale=0.7">
<style>
body { text-align:center; }
textarea { width:400px; height:400px; padding:10px; font-family:courier; font-size:14px; }
</style>
<script>
var ws;
var wc_max_len = 32768;
function ws_onopen()
{
document.getElementById("ws_state").innerHTML = "OPEN";
document.getElementById("wc_conn").innerHTML = "Disconnect";
}
function ws_onclose()
{
document.getElementById("ws_state").innerHTML = "CLOSED";
document.getElementById("wc_conn").innerHTML = "Connect";
ws.onopen = null;
ws.onclose = null;
ws.onmessage = null;
ws = null;
}
function wc_onclick()
{
if(ws == null)
{
ws = new WebSocket("ws://<?echo _SERVER("HTTP_HOST")?>/WebConsole", "text.phpoc");
document.getElementById("ws_state").innerHTML = "CONNECTING";
ws.onopen = ws_onopen;
ws.onclose = ws_onclose;
ws.onmessage = ws_onmessage;
}
else
ws.close();
}
function ws_onmessage(e_msg)
{
e_msg = e_msg || window.event; // MessageEvent
var wc_text = document.getElementById("wc_text");
var len = wc_text.value.length;
if(len > (wc_max_len + wc_max_len / 10))
wc_text.innerHTML = wc_text.value.substring(wc_max_len / 10);
wc_text.scrollTop = wc_text.scrollHeight;
wc_text.innerHTML += e_msg.data;
}
function wc_clear()
{
document.getElementById("wc_text").innerHTML = "";
}
</script>
</head>
<body>
<h2>
<p>
Web Console : <span id="ws_state">CLOSED</span><br>
</p>
<textarea id="wc_text" readonly="readonly"></textarea><br>
<button id="wc_conn" type="button" onclick="wc_onclick();">Connect</button>
<button id="wc_clear" type="button" onclick="wc_clear();">Clear</button>
</h2>
</body>
</html>
[说明] index.php文件
源代码由HTML，CSS，JavaScript和PHPoC代码组成。 PHPoC代码在PHPoC设备上进行解释。 PHPoC代码可以添加/更新HTML，CSS或JavaScript代码的内容。在PHPoC中解释PHPoC代码后，剩下的代码是客户端代码，并返回到Web浏览器。Web浏览器接收此代码并对其进行解释以显示网页。
- HTML：描述网页的结构
- CSS：描述HTML元素的显示方式
- JavaScript的：这段代码：–通过WebSocket从PHPoC设备接收数据（’hello，world！’）
- –显示’你好，世界！’ 在网页上
