一种绘制跨域图像的交互系统及方法技术方案

本发明专利技术公开了一种绘制跨域图像的交互系统及方法，该系统包括：第一服务器；一至多个第二服务器，一至多个所述第二服务器均与所述第一服务器连接；客户端，连接于所述第一服务器，当所述客户端向所述第一服务器发送跨域图像请求时，所述第一服务器依据所述跨域图像请求向一至多个所述第二服务器中的一个或多个请求并获取图片资源，所述第一服务器将所述图片资源回传至所述客户端，所述客户端将所述图片资源载入至Canvas元素。该发明专利技术的有益效果为：通过服务器处理图片转换，前端Canvas绘图可避免跨域问题；对待跨域图像资源可以像同域资源一样，可以更加灵活的处理资源。

【技术实现步骤摘要】
一种绘制跨域图像的交互系统及方法
本技术涉及图像处理、服务器技术，具体涉及一种绘制跨域图像的交互系统及方法。
技术介绍
参见图1，现有技术中，Canvas绘图一般需要同源同域才能进行，由于W3C规范限定网页页面中的Canvas元素绘图只能由同域同源下的图像资源提供，参见图2，当页面与图像处于不同域名，不同端口时，则无法对载入了跨域图像的Canvas元素调用图像处理方法，而在互联网中，提供网页页面与提供图像资源的服务器往往不能满足大规模应用的需求，不同域不同端口的服务器随处可见，但网页页面中对Canvas绘图也同样有较多需求。
技术实现思路
本专利技术的目的在于解决现有技术中当页面与图像处于不同域名、不同端口时，无法对载入了跨域图像的Canvas元素调用图像处理方法的问题，提供一种绘制跨域图像的交互系统及方法。本专利技术解决其技术问题所采用的技术方案是：提供一种绘制跨域图像的交互系统，包括：第一服务器；一至多个第二服务器，一至多个所述第二服务器均与所述第一服务器连接；客户端，连接于所述第一服务器，当所述客户端向所述第一服务器发送跨域图像请求时，所述第一服务器依据所述跨域图像请求向一至多个所本文档来自技高网...

【技术保护点】
一种绘制跨域图像的交互系统，其特征在于，包括：第一服务器；一至多个第二服务器，一至多个所述第二服务器均与所述第一服务器连接；客户端，连接于所述第一服务器，当所述客户端向所述第一服务器发送跨域图像请求时，所述第一服务器依据所述跨域图像请求向一至多个所述第二服务器中的一个或多个请求并获取图片资源，所述第一服务器将所述图片资源回传至所述客户端，所述客户端将所述图片资源载入至Canvas元素。

【技术特征摘要】
1.一种绘制跨域图像的交互系统，其特征在于，包括：第一服务器；一至多个第二服务器，一至多个所述第二服务器均与所述第一服务器连接；客户端，连接于所述第一服务器，当所述客户端向所述第一服务器发送跨域图像请求时，所述第一服务器依据所述跨域图像请求向一至多个所述第二服务器中的一个或多个请求并获取图片资源，所述第一服务器将所述图片资源回传至所述客户端，所述客户端将所述图片资源载入至Canvas元素。2.根据权利要求1所述的交互系统，其特征在于，所述客户端中的前端页面通过JavaScript代码检查URL对应的图片资源是否跨域，若是，则对所述URL进行参数转义，将进行参数转义后的URL发送至所述第一服务器。3.根据权利要求2所述的交互系统，其特征在于，所述第一服务器对进行参数转义后的URL进行解析以向一至多个所述第二服务器中对应的一个或多个请求并获取所述图片资源。4.根据权利要求3所述的交互系统，其特征在于，所述第一服务器对所述图片资源进行同源同域处理之后，返回至所述客户端，所述客户端的前端页面以同源同域策略将所述图片资源载入至Canvas元素。5.根据权利要求1-4任一项所述的交互系统，其特征在于，所述客户端将所述图片资源进行本地缓存。6.一种绘制跨...

【专利技术属性】
技术研发人员：张晓民，王智翔，
申请(专利权)人：广州帕克西软件开发有限公司，
类型：发明
国别省市：广东,44