文章詳情頁(yè)
javascript - 前端怎樣實(shí)現(xiàn)圖片剪切一部分上傳呢？像微信或者QQ上傳那樣呢？用的啥技術(shù)
瀏覽：191日期：2022-06-24 11:47:26
問(wèn)題描述
前端怎樣實(shí)現(xiàn)圖片剪切一部分上傳呢？像微信或者QQ上傳那樣呢？用的啥技術(shù)
問(wèn)題解答
回答1：這個(gè)問(wèn)題分前后端兩塊。
Web前端這塊，可以用JCrop來(lái)做圖片裁剪，實(shí)際上并不是真正的裁剪，而是在圖片上選擇一個(gè)區(qū)域，真正的裁剪是后端來(lái)做。JCrop DEMO：http://deepliquid.com/project...
后端這塊，不同的語(yǔ)言都有圖片裁剪的api，可以查看相關(guān)文檔。另外還可以使用一些云存儲(chǔ)的裁剪功能，阿里云、七牛這些都有圖片裁剪功能，例如七牛：https://developer.qiniu.com/d...
回答2：你可以通過(guò)canvas的drawImage來(lái)實(shí)現(xiàn)相關(guān)操作
回答3：推薦這個(gè)庫(kù)：PhotoClip
Demo地址：http://htmlpreview.github.io/...具體效果如下圖：
相關(guān)文章：
1. javascript - 怎么看網(wǎng)站用了什么技術(shù)框架？2. javascript - vue 怎么渲染自定義組件3. mysql - 記得以前在哪里看過(guò)一個(gè)估算時(shí)間的網(wǎng)站4. 請(qǐng)教各位大佬，瀏覽器點(diǎn) 提交實(shí)例為什么沒(méi)有反應(yīng)5. 學(xué)習(xí)這個(gè)是不是要先學(xué)下css？6. javascript - 單個(gè)頁(yè)面執(zhí)行多個(gè)jsonp的ajax請(qǐng)求，如何判斷一個(gè)ajax請(qǐng)求執(zhí)行完畢執(zhí)行再另一個(gè)？7. php md5 16字符二進(jìn)制格式 用JAVA寫(xiě)8. javascript - [MUI 子webview定位]9. javascript - angular最基礎(chǔ)的表單驗(yàn)證10. javascript - node服務(wù)端渲染的困惑
排行榜
熱門標(biāo)簽
網(wǎng)公網(wǎng)安備