項目總結(jié)-谷粒學(xué)院

1、項目總結(jié)-谷粒學(xué)院谷粒學(xué)院項目總結(jié)-谷粒學(xué)院（前后端分離）1、項目描述在線教育系統(tǒng)，分為前臺網(wǎng)站系統(tǒng)和后臺運營平臺，B2c模式。前臺用戶系統(tǒng)包括課程、講師、問答、文章幾大大部分，使用了微服務(wù)技術(shù)架 構(gòu)，前后端分離開發(fā)。后端的主要技術(shù)架構(gòu)是：SpringBoot + SpringCloud + MyBatis-Plus + HttpCIient + MySQL + Maven+EasyExcel+ nginx 前端的架構(gòu)是：Node.js + Vue.js +element-ui+NUXT+ECharts其他涉及到的中間件包括Redis、阿里云OSS、阿里云視頻點播業(yè)務(wù)中使用了 ECharts做

2、圖表展示，使用EasyExcel完成分類批量添加、注冊分布 式單點登錄使用了 JWT 項目前后端分離開發(fā)：后端采用SpringCloud微服務(wù)架構(gòu)，持久層用的是MyBatis-Plus,微服務(wù)分庫設(shè)計, 使用Swagger生成接口文檔接入了阿里云視頻點播、阿里云OSS系統(tǒng)分為前臺用戶系統(tǒng)和后臺管理系統(tǒng)兩部分：前臺用戶系統(tǒng)包括：首頁、課程、名師、問答、文章。后臺管理系統(tǒng)包括：講師管理、課程分類管理、課程管理、統(tǒng)計分析、Banner 管理、訂單管理、權(quán)限管理等功能。前端我是用vue進(jìn)行開發(fā)的使用日ement-UI快速搭建模板樣式使用了 Nuxt輕量級框架使用node成為js的一個運行環(huán)境，將前端部

3、署在node上為什么使用Nuxt呢? Nuxt有什么特點會讓你使用？答：Nuxt也就是服務(wù)器渲染技術(shù)也可以充當(dāng)靜態(tài)站點引擎，它可以很好的解決 SEO問題，SEO簡稱（搜索引擎優(yōu)化）比如說我前端顯示一張圖片，是通過ajax 異步請求得到數(shù)據(jù)的，抓取工具并不會等待異步完成后才對頁面內(nèi)容進(jìn)行抓取。 而用服務(wù)器渲染技術(shù)，我們無需等待所有的js加載完后執(zhí)行，而是在服務(wù)端中 通過node.js將我們查詢出來的數(shù)據(jù)全部封裝，然后一次性返回到前端獲得更快 的內(nèi)容到達(dá)時間，這就是NUXT的簡單操作流程，而且都是在服務(wù)端中實現(xiàn)的。模塊1Redis做緩存，什么樣的數(shù)據(jù)適合使用Redis做緩存？ 經(jīng)常訪問，但不經(jīng)常修

4、改的數(shù)據(jù)；如主頁 項目遇到的問題跨域問題：I跨域問題Ihttp:/localhost:p528/ 不一樣http：/localhost 18001/17、跨域解決方式(1)在后端接口control)CrossOrigin 解決善之 public class EduLoginCo(2)使用網(wǎng)關(guān)解決(后Ivue不管路由跳轉(zhuǎn)了幾次created。方法只會執(zhí)行一次解決方法：vue監(jiān)聽watch:$route(to,from)init()mybatisPuls的xml問題：打包時不會將xml文件也打包解決：_!-項目打包時會將java目錄中的*.xml文件也進(jìn)行打包src/main/java*/*.xm

5、lfalse酉己置文件：mybatis-plus.mapper-locations=classpath:com/atguigu/edu/mapper/xml/*.xml用f4呢5181丫接受數(shù)據(jù)必須用PostMapping提交否則報missnginx也會限制文件上傳大小總結(jié)：服務(wù)器大多都會限制文件上傳大小，上傳前要設(shè)置 文件上傳大小配置nginx上傳文件大小，否則上傳時會有413 (Request Entity Too Larg(月T開nginx主酉己置文件nginx.conf,找至！Jhttp,添加通過一個地埴去訪問另外一個地址，這個過程中如果有三個地方任何一個不一樣訪問協(xié)議http htt

6、psip 地址192. 168.1. 1 172.11. 11.11盛口號95288001搭建或Fl前臺系般環(huán)境使用用ITT他架搭建防臺環(huán)境 聯(lián)多端溶染拉術(shù)服務(wù)器官戶褚缺點，不利于SEOaxios攔截器axios的攔截器特性request請求攔截當(dāng)我們請求的時候會檢查cookie中是否有token如果有就將token設(shè)置進(jìn)request 的head當(dāng)中，發(fā)送到服務(wù)端做單點登錄的邏輯處理。response響應(yīng)攔截做一個全局異常處理攔截每一個響應(yīng)信息，判斷狀態(tài)碼是否正常，如果返回報錯狀態(tài)碼，用彈窗的 形式給用戶展現(xiàn)友好的信息，如果正常就將response返回給后面業(yè)務(wù)使用。/創(chuàng)建axios實例co

7、nst service = axios.create(/baseURL: HYPERLINK /api /api, / api 的 base_url/baseURL: , HYPERLINK http:/localhost:8210 http:/localhost:8210, / api 的 base_urlbaseURL:33:9001，timeout:15000/請求超時時間)/ http request 攔截器erceptors.request.use(config =/debuggerif(cookie.get(guli_token)config.headerstoken= cooki

8、e.get(guli_token);) return config,err =return Promise.reject(err);)/ http response 攔截器erceptors.response.use(response =/debuggerif( response.data.code =28004)console.Iog(response.data.resultCode 是 28004)返回錯誤代碼-1清除ticket信息并跳轉(zhuǎn)到登錄頁面/debuggerwindow.location.href=7loginreturnelseif(response.data.code !=2

9、0000)25000 ：訂單支付中，不做任何提示if(response.data.code !=25000)Message(message: response.data.message | |error,typeierror,duration:5*1000) _return Promise.rejectCerror)只要報錯前直接拋出錯誤，就不會執(zhí)行成功方法 了elsereturn response;) ) , error = return Promise.reject(error) )； NPM包管理工具，類似Maven后曬使用spring boot來搭建項目的環(huán)境和部署(注解開發(fā))。持久層

10、用的是MyBatis-Plus用到了自動填充邏輯刪除(未實現(xiàn))和樂觀鎖(未實現(xiàn)) 自動填充創(chuàng)建時間和修改時間還有每當(dāng)數(shù)據(jù)修改時，會將修改時間自動填充 其他的就是調(diào)用mp的api實現(xiàn)增刪改查嘛。使用Swagger生成接口文檔后端采用SpringCloud微服務(wù)架構(gòu)1)注冊中心使用了 nacos將每個微服務(wù)注冊進(jìn)去。2)使用fegin來實現(xiàn)每個模塊之間的遠(yuǎn)程調(diào)用。3)使用ribbon實現(xiàn)負(fù)載均衡，因為導(dǎo)入fegin-start的依賴會將ribbon也導(dǎo)入，因為 fegin 封裝了 ribbono4)后臺使用gateway網(wǎng)關(guān)，解決跨越問題，還有使用gateway的過濾器檢測用戶是否登 錄，gate

11、way過濾器通過攔截request請求看head中是否用token,如果沒有就不放通 過。Springsecurity實現(xiàn)登錄和授權(quán)后端重點功能實現(xiàn)JWT令牌：(三部分)請求頭、有效載荷、簽名哈希 單點登錄(SSO) ： (token+cookie)用戶先進(jìn)行登錄，如果登錄成功我們將用戶名用JWT隨機生成字符串也就是token,再 將token放到cookie當(dāng)中，當(dāng)發(fā)送請求時通過axios攔截器來攔截我們的request請求， 如果cookie中有token,我們會將他放到request的head當(dāng)中再進(jìn)行發(fā)送,后端通過 request的head得到token然后用JWT解析得到用戶名然后到

12、數(shù)據(jù)庫查找對應(yīng)的用戶信 息，并且將用戶信息返回給前端。session. setAttribusession. getAttribu集群部署分布式單點登錄SSO(single signI實現(xiàn)登錄Iservice-edu登錄session. setAttribute(user user)復(fù)制session*單點登錄三種常見方式:單一服務(wù)器模式登錄(1)使用session對象實現(xiàn)*登錄成功之后,把用戶數(shù)據(jù)放到session里面第一種；session廣播機制實現(xiàn)session復(fù)制第一種；session廣播機制實現(xiàn)session復(fù)制*判斷是否登錄，從session獲取數(shù)據(jù),可以獲取到登錄 微信掃碼登錄：

13、第一步：先訪問微信二維碼的頁面，在手機上確定登錄后會調(diào)用我們的callback （回調(diào) 方法）得到一個code （相當(dāng)于手機驗證碼）。第二步：利用httpclient攜帶上這個code請求一個微信固定的地址得到access_token（訪問憑證）和openjd （微信號的唯一標(biāo)識）。第三步：利用httpclient攜帶上access_token和open_id請求一個微信固定的地址,這時 微信返回以json形式的用戶信息再用json轉(zhuǎn)換工具自其轉(zhuǎn)換為用戶對象，我們會先判 斷用戶表的是否有重復(fù)的opend如果有就說明注冊了，如果沒有就將當(dāng)?shù)挠脩粜畔⒓?入到我們的用戶表中，第四步：當(dāng)插入成功后mp

14、會返回用戶名給我們，我們將用戶名使用JWT加密生成 token放到url參數(shù)的位置，重定向到首頁。課程詳細(xì)視頻在線播放功能：上傳視頻：當(dāng)我們在創(chuàng)建小節(jié)的時候向數(shù)據(jù)庫保存的不是視頻的地址，而是我們請求阿里云播放器提供的第三方接口的videoldo播放視頻：通過小節(jié)id到數(shù)據(jù)庫中查找對應(yīng)的videold,然后通過videold再訪問阿里云的第三方接口得到訪問憑證通過videold和訪問憑證播放視頻。為什么通過videold和訪問憑證播放視頻？答：如果說通過視頻地址訪問視頻，只能訪問未加密視頻，但是不能訪問加密視頻，如果用videold和訪問憑證，就能訪問加密視頻。Autowiredprivate

15、VODProperties vodProperties;通過vid拿到視頻憑證public R getVODvid（ String vid）throws Exception（DefaultAcsClientclient=lnitObject.initVodClient(vodProperties.getKeyid(),vod Properties.getKeysecret(); 請求 GetVideoPlayAuthRequest request =new GetVideoPlayAuthRequest(); request.setVideold(vid); 響應(yīng) GetVideoPlayAu

16、thResponse response = null; response = client.getAcsResponse(request); 得到播放憑證 String playAuth = response.getPlayAuth(); 返回結(jié)果 return 。1().0165$州6(”獲取憑證成功).|313(七匕113 playAuth); ) /* *流式上傳接口 *param accessKeyldparam accessKeySecretparam titleparam fileName * param inputstream */ private static String t

17、estUploadStream(String accessKeyld, String accessKeySecret, String title, String fileName, Inputstream inputStream)UploadStreamRequest request =new UploadstreamRequest(accessKeyld, accessKeySecret, title, fileName, inputstream); UploadVideoImpI uploader =new UploadVideolmpl();UploadStreamResponse re

18、sponse = uploader.uploadStream(request); if( response.isSuccess() return response.getVideold();else如果設(shè)置回調(diào)URL無效，不影響視頻上傳，可以返回Videold同時會返回錯誤碼。 其他情況上傳失敗時，Videold為空，此時需要根據(jù)返回錯誤碼分析具體錯誤原因 return response.getVideold(); ) ) 微信支付功能：(建議將訂單加入到redis當(dāng)中緩存，設(shè)置過期時間) 根據(jù)用戶id到訂單表查詢是否有和當(dāng)前課程對應(yīng)的消費的記錄，如果有說明已購買和 立即觀看 如果沒有，會提醒

19、支付觀看我們會轉(zhuǎn)跳到二維碼支付頁面，然后將訂單信息加入到訂 單表 前端設(shè)置定時器每三秒訪問我們的接口訪問訂單狀態(tài)，如果支付成功將訂單狀態(tài)改為 支付成功，并且將支付信息保存的訂單日志表中。前臺熱點信息，使用redis緩存：原理：設(shè)置常量key比如說如果我們要存課程的熱點信息，那我們就將key設(shè)置course,每次 查詢前使用key查詢在redis中先查詢是否存在信息，如果存在就直接從redis當(dāng)中獲取。從redis中獲取的是二進(jìn)制字節(jié)，然后利用對象流反序列化返回對象。如果redis中不存在，那么我們就向數(shù)據(jù)庫中查詢數(shù)據(jù)，先利用對象流將我們的對象序 列化成二進(jìn)制字節(jié)，然后存入redis當(dāng)中，這樣下一次我們用就會直接從redis當(dāng)中查詢 了。如果進(jìn)行序列化有就返第一次先訪問re看是否有數(shù)據(jù)先集成 spring-boot-starter-data-redis 然后在查詢的方法上打上*Cacheable(va