比如这个应用 http://m.bb2b2bb.com/
实现的原理是什么。。。
业精于勤,荒于嬉;行成于思,毁于随。
通过抓包,你可以发现他是怎么实现的。
他的实现方案:
user1_head 表示 im 用户1 头像 user1_head 同理
user1_head
user1, user2 表示用户名
user1
user2
text_arr:123456789,987654321,hello,world,foo,baruser_arr:user1,user2,user1,user2,user1,user2
text_arr:123456789,987654321,hello,world,foo,bar
user_arr:user1,user2,user1,user2,user1,user2
用逐一匹对的方式,记录两个人的对话。 最后通过一个post请求,发送到服务器端,生成图片。
至于服务器是如何生成图片的方法很多。 这个网站后端使用的是 php 的 codeigniter 框架做的。可能使用的是gd2绘图类库。
php
codeigniter
不知道你后端使用的是什么编程语言。因为这种功能放在前后端都能做。
缺点是:兼容性查,需要高级浏览器支持,因为需要支持 canvas 绘图,还有就是会操作 html5 canvas api。(如果不会使用canvas的话,要么去学,要么这条方案当我没说) 优点是:用户体验性很赞,很流畅。
canvas
大体实现方法:使用canvas。最终可将绘制的图像生成成图片。用户可以另存为保存,也可以将生成的二进制图片,上传服务器,生成连接。
另存为
缺点是:体验性会差很多,因为需要和服务器交互,体验流畅度会差一点。 优点:客户端兼容性好,基本支持所有浏览器。
大体方法:前端负责组织数据。后端负责根据数据生成图片。后端解决的话就比较简单了,有了数据买就是把位置对好,生成图片,就行了。 nodejs, python, java, php 都用很多绘图库。
nodejs
python
java
具体实现流程这里就不废话了。点到为止。
如果以上方法,题主都不太清楚该怎么操作,那该去补习一下了。
推荐用html2canvas, 不需要服务器端处理
点击生成图片后给服务器发了一个post请求,所以,图片是后端生成的。
一个精简的渲染引擎 (browser-side), 可以处理常见的样式, minify 后 60 KB. http://html2canvas.hertzen.com/
很显然,你需要 phantomjs
这里有一个简单的例子,利用phantomjs保存网页截图
通过抓包,你可以发现他是怎么实现的。

帮你分析分析他的实现方法
他的实现方案:
user1_head
表示 im 用户1 头像user1_head
同理user1
,user2
表示用户名text_arr:123456789,987654321,hello,world,foo,bar
user_arr:user1,user2,user1,user2,user1,user2
用逐一匹对的方式,记录两个人的对话。

最后通过一个post请求,发送到服务器端,生成图片。
至于服务器是如何生成图片的方法很多。
这个网站后端使用的是
php
的codeigniter
框架做的。可能使用的是gd2绘图类库。推荐你使用的方法
不知道你后端使用的是什么编程语言。因为这种功能放在前后端都能做。
前端实现
缺点是:兼容性查,需要高级浏览器支持,因为需要支持
canvas
绘图,还有就是会操作 html5 canvas api。(如果不会使用canvas的话,要么去学,要么这条方案当我没说)优点是:用户体验性很赞,很流畅。
大体实现方法:使用canvas。最终可将绘制的图像生成成图片。用户可以
另存为
保存,也可以将生成的二进制图片,上传服务器,生成连接。后端实现
缺点是:体验性会差很多,因为需要和服务器交互,体验流畅度会差一点。
优点:客户端兼容性好,基本支持所有浏览器。
大体方法:前端负责组织数据。后端负责根据数据生成图片。后端解决的话就比较简单了,有了数据买就是把位置对好,生成图片,就行了。
nodejs
,python
,java
,php
都用很多绘图库。具体实现流程这里就不废话了。点到为止。
如果以上方法,题主都不太清楚该怎么操作,那该去补习一下了。
推荐用html2canvas, 不需要服务器端处理
点击生成图片后给服务器发了一个post请求,所以,图片是后端生成的。
一个精简的渲染引擎 (browser-side), 可以处理常见的样式, minify 后 60 KB. http://html2canvas.hertzen.com/
很显然,你需要 phantomjs
这里有一个简单的例子,利用phantomjs保存网页截图