h5页面生成分享海报(保存图片、分享)

一、案例简介

最近遇见了h5分享页面,就是自己写的整页内容(内含二维码)可以长按保存到手机里,然后发给别人。
其实就是h5生成分享海报,以前的时候写过这个东西,但是太久了都忘了,然后上网去搜索,答案也是五花八门,也很不简洁,自己理解起来也很费劲,好不容易把代码搬到自己这边,运行不起来是一方面,另一方面是改成自己的比较费劲…所以我写了一个很简洁的小案例,也算是给自己留一份笔记。在第三模块会将完整代码整份贴出。
移动端(手机端)演示:

电脑模拟手机:

二、案例详解

1.说明:

页面是普通的html代码,该怎么写就怎么写,让他变成图片这块是借助 html2canvas 这个第三方 js 库实现的。
那这个html2canvas 东西是啥呢?下面进入网址自行查看:
他的中文网址:https://allenchinese.github.io/html2canvas-docs-zh-cn/
英文网址࿱

你可能感兴趣的:(知识点,步骤,javascript,前端,开发语言)