ThinkPHP官網頭像上傳原理

2021-06-17 22:01:35 字數 734 閱讀 3683

目前,thinkphp官網的上傳頭像涉及到上傳以及裁剪

在html裡使用的是jquery.uploadify.js外掛程式,可以實時顯示上傳的進度條,並且無重新整理顯示,使用者體驗很好(當然,你也可以什麼外掛程式都不用,那樣就得進行頁面跳轉了)。

在php裡使用官方的

uploadfile.class.php類庫,不過改寫了下。因為頭像的命名最好用同乙個名字和字尾,便於讀取。

上傳到伺服器後,就將位址用ajax返回給頁面,進行接下來的裁剪。

在html裡獲取到了上傳後的,顯示在頁面上。然後就用到js裁剪外掛程式jquery.jcrop.js。裁剪的具體方法可以檢視原始碼。

裁剪的最終目的是獲取裁剪區域相對於的四個角的座標,然後再傳給php端進行裁剪,外掛程式所做的也就是獲取座標並實時顯示效果。

為什麼要裁剪兩次呢?因為在js端裁剪是為了實時的顯示效果,而在php端才是真正的儲存裁剪後的。

頁面裡的效果:

真正儲存後效果:

在php端獲取到裁剪區域的座標後,就可以對原圖進行裁剪了。這裡用到了

thinkimage類庫。

詳細過程請看原始碼,無非就是通過gd庫對進行的一系列處理而已(

相信大家看了上面的介紹,對頭像上傳這一塊流程和原理有了大概的了解。大家可以在例子的基礎上進行擴充套件,如儲存進資料庫,以符合業務需要。

thinkphp官網瀑布流實現分享

很多人都想做瀑布流的效果,這裡告訴大家官網使用的方法。裡面包含的很多示例,但是都是英文的。我給大家寫個小例子吧1,頁面初始化時,呼叫外掛程式進行一次排版 2,當使用者將滾動條拖到底部時,用ajax載入一次資料,並排版顯示 3,重複2,直到無資料 瀑布流下來了 載入中,請稍後.我是頁尾 class u...

ThinkPHP實現ajax仿官網搜尋功能例項

具體實現方法如下 後台 複製 如下 搜尋,如果在1不在0 function search else 前端 複製 如下 document ready function else,datatype json success function data html items.goods id items....

10 10 010 簡介 官網 官網翻譯

netty是 乙個非同步事件驅動的網路應用程式框架,用於快速開發可維護的高效能協議伺服器和客戶端。netty是乙個nio客戶端伺服器框架,可以快速輕鬆地開發協議伺服器和客戶端等網路應用程式。它極大地簡化並簡化了tcp和udp套接字伺服器等網路程式設計。快速簡便 並不意味著最終的應用程式會受到可維護性...