在用戶發表留言之前，需要進入登錄狀態。在微信平臺中，登錄應該是一個自動的過程：用戶只需要進行一次授權，往后的登錄都由后臺自己來處理。

在 client 文件夾下新建 index.php ：

登錄流程

首先要處理自動登錄這一流程，在沒有接入微信平臺之前，我們可以先這樣做：用戶進入客戶端時自動登錄我們的測試帳號 abcdefg，方法很簡單，直接給 session 賦值即可。

session_start();

if(!isset($_SESSION['wall_open_id'])){

//未登錄時自動登錄abcdefg

$_SESSION['wall_open_id']='abcdefg';

//預留：后期需要跳轉到微信授權頁

}

$openid=$_SESSION['wall_open_id'];

提取用戶信息

登錄之后，我們就可以用 openid 從數據庫拉取當前用戶的信息：

//獲取當前用戶數據

require('../util/database.class.php');

$db=Db::getInstance();

$user=$db->find("SELECT * FROM user where openid='$openid'");

if(empty($user))

die('用戶不存在');

構造界面

將之前的 php 語句塊封閉，在下面直接編寫 html 代碼。初步的界面只有三個部分：

用戶的昵稱

輸入文本域

提交按鈕

由于我們的界面是要在手機上跑的，所以要加上移動顯示屏的適配：

整體HTML代碼：

歡迎使用微信墻

歡迎您：<?php echo $user['nickname'];?>

留言

圖3-1 Chrome瀏覽器開發者工具中的效果

將數據發送給服務器

導入 jQuery

在 head 部分導入 jQuery CDN，也可以下載到本地服務器上引用：

編寫 post 腳本

在 body 中編寫 javascript 語句，當按鈕被觸發時，將文本域的數據發送給服務器，并 alert 返回的信息：

$(document).ready(function(){

$('#post-button').click(function(){

$.post('../server/new.php',{

content:$('#message').val()

},function(response){

var data=JSON.parse(response); //解析json數據

alert(data.message);

})

});

});

圖3-2 發送消息測試

圖3-3 消息已經顯示在數據庫

完整代碼

/client/index.php

session_start();

if(!isset($_SESSION['wall_open_id'])){

//未登錄時自動登錄abcdefg

$_SESSION['wall_open_id']='abcdefg';

//預留：后期需要跳轉到微信授權頁

}

$openid=$_SESSION['wall_open_id'];

//獲取當前用戶數據

require('../util/database.class.php');

$db=Db::getInstance();

$user=$db->find("SELECT * FROM user where openid='$openid'");

if(empty($user))

die('用戶不存在');

?>

歡迎使用微信墻

歡迎您：<?php echo $user['nickname'];?>

留言

$(document).ready(function(){

$('#post-button').click(function(){

$.post('../server/new.php',{

content:$('#message').val()

},function(response){

var data=JSON.parse(response); //解析json數據

alert(data.message);

})

});

});

至此，我們完成了從數據庫提取用戶信息、向消息服務端發送留言兩大過程。

圖3-3 已經完成的部分

下一步我們將完成消息的推送功能。

總結

以上是生活随笔為你收集整理的微信墙服务器地址,一面微信墙的诞生(3) 用户端界面的创建的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。