目錄
到Github獲取源碼請點擊此處
一. 商品類目查詢
- 功能分析: 在后天管理頁面可以添加商品, 添加商品時首先需要選擇類目. 在本項目中, 商品的類目選擇使用的是異步加載, 當我們點擊選擇類目時會彈出一級類目, 進一步選擇時會彈出二級類目. 這里涉及到
tb_item_cat表. 下面進行編碼實現
- 首先和商品上下架一樣, 我們需要在Dubbo中發布遠程服務.
- 先到
ashop-rpc-service模塊中編寫服務接口類
- 編寫對應的實現類.
- 然后在Dubbo配置文件中進行配置, 發布Dubbo服務.
- 自此, 商品類目節點查詢的遠程服務已經編寫好.
- 下面在
ashop-manager-web模塊中編寫和前端交互部分代碼. - 首先, 我們需要封裝響應給前端的數據模型, 需要三個參數: 節點id, 內容text, 狀態status
- 接下來編寫
Service接口及其實現類(調用遠程服務)
- 編寫controller
- 到spring配置文件中注冊遠程代理對象
- 然后重新打包啟動項目: 對整體項目進行install, 然后啟動之前在
ashop-rpc-service-impl模塊中編寫好的測試程序啟動Dubbo服務, 然后啟動Tomcat. 最后到瀏覽器查看運行結果.
二. FTP圖片服務器的搭建
圖片上傳思路介紹
Linux中安裝vsftpd
- 執行安裝命令
yum install vsftpd -y - 安裝完畢后添加vsftpd用戶, 輸入命令:
useradd ftpuser - 這時進入home目錄(
cd /home), 會看見多了一個ftpuser用戶
- 接下來分配ftp密碼
- 輸入命令:
passwd ftpuser, 然后連續兩次輸入密碼
- 限定用戶不能通過ssh登陸到linux系統
- 輸入命令:
vi /etc/passwd - 把
.../ftpuser:/bin/bash修改為.../ftpuser:/sbin/nologin
- 配置防火牆開放21端口.
- 輸入命令
vi /etc/sysconfig/iptables
- 接着重啟防火牆:
service iptables restart, 使打開防火牆21端口操作生效.
接着配置ftp服務, 讓外網可以訪問
- 查看ftp狀態:
getsebool -a | grep ftp, 會看到所有選項都是關閉狀態:
- 接下來修改ftp狀態, 就修改其中兩項:
setsebool -P allow_ftpd_full_access on和setsebool -P ftp_home_dir on- 修改后的狀態如下:
- 接下來關閉ftp的匿名訪問:
vi /etc/vsftpd/vsftpd.conf
- 設置vsftpd服務開機啟動:
chkconfig vsftpd on - 最后測試ftp鏈接:
- 啟動ftp服務:
service vsftpd start - 進入windows的命令行工具, 輸入
ftp ftp服務所在的ip地址, 然后依次輸入用戶名和密碼即可
- 配置vsftpd的被動模式(默認是開啟的, 需要配置端口號的范圍)
- 首先進入vsftpd的配置文件:
vi /etc/vsftpd/vsftpd.conf - 下拉到配置文件的最后, 配置端口號的范圍(最大值, 最小值)
- 接下來需要在防火牆打開相應范圍的端口:
vi /etc/sysconfig/iptables
- 改完記得重啟:
service iptables restart - 至此, 圖片服務器的配置和安裝已經完成.
Http服務器搭建
- 我們使用Nginx搭建http服務器, Nginx是一個高性能的http和反向代理服務, 占有內存少, 並發能力強.
Nginx安裝
- 安裝編譯環境:
yum install gcc gcc-c++ - 安裝Pcre庫:
yum -y install pcre-devel - 安裝壓縮工具:
yum install zlib-devel - 接下來上傳Nginx的安裝包
- 上傳安裝包的常用套路是在根目下創建一個文件夾, 讓后使用工具把安裝包傳到linux機上, 這里就暫不演示.
- 然后創建Nginx的安裝目錄:
mkdir /usr/local/nginx - 回到安裝包的目錄, 對壓縮了的安裝包進行解壓:
tar -zxvf 文件名 - 進入解壓后的nginx安裝包, 可以看見一個
configure可執行文件, 這個是用來檢測環境的. - 接着把下面這段代碼復制到linux命令窗口進行檢測, (注意是進入nginx安裝包后的目錄, 也就是
configure文件所在的目錄)
./configure \
--prefix=/usr/local/nginx \
--pid-path=/var/run/nginx/nginx.pid \
--lock-path=/var/lock/nginx.lock \
--error-log-path=/var/log/nginx/error.log \
--http-log-path=/var/log/nginx/access.log \
--with-http_gzip_static_module \
--http-client-body-temp-path=/var/temp/nginx/client \
--http-proxy-temp-path=/var/temp/nginx/proxy \
--http-fastcgi-temp-path=/var/temp/nginx/fastcgi \
--http-uwsgi-temp-path=/var/temp/nginx/uwsgi \
--http-scgi-temp-path=/var/temp/nginx/scgi
- 檢測完畢后同樣在進入到安裝包的目錄后進行編譯:
make
- 接着執行
make install命令
- 安裝成功后, 到之前預設好的安裝目錄
/usr/local/nginx中可以看到如下文件
- 然后我們需要配置防火牆, Nginx的默認端口是80端口.
- 進入防火牆配置文件:
vi /etc/sysconfig/iptables.
-
完成后記得重啟防火牆
service iptables restart -
接下來啟動nginx:
-
進入到nginx的安裝目錄中
- 進入sbin:
cd sbin, 執行nginx:./nginx
-
提示說缺少一個目錄. 我們按照錯誤提示創建缺少的文件:
mkdir -p /var/temp/nginx/client -
重新執行
./nginx, 沒有報錯說明啟動成功. -
補充: 重啟nginx:
./nginx -s reload -
最后我們訪問一下Nginx, 在瀏覽器中直接輸入Nginx所在的ip地址, 可以看到以下內容
- 至此, Nginx的安裝已經結束.
配置Nginx
- 先進入Nginx安裝目錄, 然后進入conf目錄, 修改nginx.conf文件
- 配置Nginx用戶名, 照上面的操作打開配置文件進行操作, 在首行添加ftpuser
- 保存退出並重啟Nginx(到sbin目錄下):
./nginx -s reload - 最后給Host配置域名
- 什么叫配置域名呢? 首先我們進入C盤, 然后進入Windows目錄, 然后進入System32目錄, 然后進入drivers目錄, 然后進入etc目錄, 里面有個host配置文件, 打開該配置文件, 我們在這里為nginx配置域名
- 把開啟nginx服務的機器ip對應
image.taotao.com, 這個域名是我們數據庫中的數據寫好的. - 嘗試訪問
- 我們給服務器上傳一張圖片試試.
- 在/home/ftpuser目錄下創建一個
jd目錄, 並在里面放一張圖片
- 然后重新到瀏覽器中進行訪問.
- 我們返回Nginx的安裝目錄, 查看html目錄, 可以看見之前訪問Nginx時的首頁html就保存在這里
FtpClient實現文件上傳
- 上傳圖片的思路這樣: 瀏覽器先上傳到Tomcat服務器, 然后再從Tomcat容器上傳到Nginx圖片服務器.
- 現在先實現后半部分, 把圖片從Tomcat容器上床到Nginx服務器.
- 首先到
ashop-common模塊中添加相應的依賴
- 然后封裝上傳圖片的方法
- 這里要記錄一個編碼時遇到的問題.
- 上面的代碼驗證過其實是沒錯的, 但是第一次寫的時候一直上傳不了. 網上說Nginx調試可以使用
getReplyString()打印錯誤. 我得到的是553, could not create file不能創建文件. 查看了Nginx的配置文件也都沒有問題. 網上還有提示說添加一些額外的代碼, 也不奏效. 最后考慮是linux系統不讓寫, 也就是說對/home/ftpuser/jd這個目錄根本沒有寫的權利. - 通過查看權限發現確實只有讀的權限, 修改后即正常上傳.
- 修改權限的語句是
chmod 數字 文件名, 數字對應的是權限比如-rwxr--r--對應x111 100 100, 也就是744, 要改為-rwxrw-rw-:766要輸入命令:chmod 766 文件名.
- 繼續.
- 查看前端代碼看看圖片提交的上傳路徑和提交圖片的參數.
- 封裝圖片上傳后返回給瀏覽器的數據模型
- 下面開始實現圖片從本地上傳到Tomcat容器, 然后再上傳到圖片服務器.
- 創建ftp.properties文件: 在
web模塊中的main/resource目錄下創建resources目錄, 在里面創建ftp.properties文件. 並存儲連接FTP服務器的信息.
- 接着創建工具類IDUtils, 封裝了兩個方法:
- 一個是對上傳圖片的名字進行重命名
- 另一個是封裝了一個方法用於生成商品的組件.
- 這個類已經給出, 直接復制到項目中即可.
- 然后編寫商品圖片上傳的Service接口及其實現類
- 編寫響應的controller方法
- 自此圖片上傳功能已經完成了, 對整體項目進行打包, 照例啟動Dubbo服務, 然后啟動Tomcat容器.
- 問題記錄: 這次連接Dubbo服務的時候出現了問題, 老是超時連接不上.
INFO [main-SendThread(192.168.117.129:2183)] - Opening socket connection to server 192.168.117.129/192.168.117.129:2183. Will not attempt to authenticate using SASL (unknown error)
INFO [main-SendThread(192.168.117.129:2183)] - Client session timed out, have not heard from server in 10006ms for sessionid 0x0, closing socket connection and attempting reconnect
INFO [main-SendThread(192.168.117.129:2181)] - Opening socket connection to server 192.168.117.129/192.168.117.129:2181. Will not attempt to authenticate using SASL (unknown error)
INFO [main-SendThread(192.168.117.129:2181)] - Client session timed out, have not heard from server in 10001ms for sessionid 0x0, closing socket connection and attempting reconnect
INFO [main-SendThread(192.168.117.129:2182)] - Opening socket connection to server 192.168.117.129/192.168.117.129:2182. Will not attempt to authenticate using SASL (unknown error)
- 后來發現是沒有在linux上開放zookeeper的端口. 之前關閉了防火牆所以沒有問題, 后來對防火牆一頓操作重啟后忘記關了, 所以出現了這樣的錯誤, 可以考慮把zookeeper的端口也開放.
- 測試成功后, 進入下一個環節
實現商品新增
- 引入富文本編輯器kindeditor, 商品的描述信息將在富文本編輯器中進行編輯, 最終會以html格式保存到數據庫. 使用該富文本編輯器需要在jsp中引入該資源.
- 而且需要在表單中添加一個文本域(已經添加好了). 文本域的作用: 我們在富文本編輯器編輯的內容最終會轉化為html的形式放在文本域中, 向后台提交的時候商品的描述信息從該文本域中獲取, 也就是根據
desc參數接收
- 首先還是編寫提供遠程服務的方法. 保存商品信息需要用到兩張表, 一張是商品的詳細信息表, 一張是商品的描述信息表.
- 編寫實現方法
- 接着在
ashop-manager-web模塊中也完成響應的service接口與實現類
- 編寫實現類
- 編寫controller
- 重新打包, 發布測試.
實現商品的回顯
- 接下來要實現的功能是, 在后台點擊編輯商品的時候要把商品的信息回顯出來
- 首先完成商品描述信息回顯的遠程方法, 創建
ItemDescService接口
- 編寫實現類.
- 發布為遠程服務
- 接着到
web-manager-web模塊中實現service接口與實現類. - 首先在配置文件中注冊已經發布的遠程服務對象.
- 編寫service接口
- 編寫實現類
- 編寫Controller
- 最后打包測試.
商品信息修改
- 編寫遠程服務service接口與實現類(和添加商品差不多)
- 編寫實現類
- 繼續到
ashop-manager-web中編寫service接口和實現類
- 編寫實現類
- 最后編寫controller
- 最后項目打包, 測試, 本階段完成.