CN112328140A - 图像输入方法及其装置、设备、介质 - Google Patents

Abstract

本申请公开一种图像输入方法及其装置、设备、介质，所述方法包括：响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供选定图像对象；响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而显示相应的图像；响应用户发送指令，向服务器提交输入框中的聊天信息，其中的图像对象被表述为其引用标识；接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中的引用标识解析显示为图像。本申请实现了在聊天界面输入框中输入图像并直观显示的技术手段，可以改善聊天工具的通信效率，优化整体用户体验。

Description

图像输入方法及其装置、设备、介质

技术领域

本申请属于互联网技术领域，具体涉及一种图像输入方法，及其相应的装置、电子设备、非易失性存储介质。

背景技术

即时通信软件作为一种聊天工具，需要提供各种类型的非音频信息的输入功能，以便丰富用户通信时的表达方式。这些非音频信息通常包括文字、图片、表情、动画、视频等等，其中除文字之外的其他类型的信息可以因均承载图像内容而可概括为图像，这些图像对于计算机程序而言，可视为一个可被独立处理的图像对象。聊天工具提供的不同的表达方式，因应不同开发语言、不同开发环境，可能需要采用不同的业务逻辑来实现，不同的业务逻辑反映到用户聊天过程中，往往相应导致用户体验有差异，由此造成不便。

例如，参阅图1，移动终端使用原生系统语言开发的各种即时通信软件，具体可参阅IOS系统的“微信”、“支付宝”等聊天工具，其聊天界面输入框主要用于输入文字信息，当聊天过程中用户需要输入表情图元(emoji)时，调用表情选择器选定一个表情之后，选定的表情图元会被转换为转义标识插入到输入框中。一方面，转义标识也以文字信息的形式呈现，因此，用户无法在输入框中看到其选定的表情的真实效果，不知道自身输入的表情是否正确，更是无法在输入框中以表情为像素单元自行编辑各种丰富的图案，其沟通表达方式大大受阻。另一方面，由于转义标识往往占用多个字符单位，用户如果要删除一个已选定但待发送的表情，便需要调用输入法的退格键多次触控，稍有不慎即发生误删，其操作效率较低。

除emoji这种标准化表情的输入，其他非emoji即非标准表情的输入，包括图片、Gif动画、短视频等不同形式，更是无法通过输入框来做进一步的编辑。对于非标准表情，用户通过聊天界面提供的入口选定发送非标准表情后，相应的图片不经输入框，即被提交给服务器更新到聊天界面的聊天记录消息区中，不为用户留下任何犹豫编辑的空间，遑论调出相应的图片编辑工具进行图片的前期加工。

可见，当前移动终端中聊天工具在用户进行基于图像的沟通时，无法为各种不同形式的图像的输入提供统一、高效、直观的编辑功能，影响即时通信效率，导致整体用户体验不佳。

发明内容

本申请的目的，旨在提供一种图像输入方法，及其相应的装置、电子设备、非易失性存储介质。

为满足本申请的各个目的，本申请采用如下技术方案：

适应于本申请的目的之一而提供的一种图像输入方法，包括如下步骤：

响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象；

响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像；

响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识；

接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中所包含的引用标识解析显示为所述的图像。

为适应标准化表情的输入而提出的实施例中：弹出图像选择器的步骤中，所述图像选择器的界面覆盖经该输入框唤出的输入法界面，图像选择器的界面中包含多个供用户选定的表情图元作为所述的图像对象。

在该实施例的基础上进一步丰富的实施例中，该方法包括如下步骤：

响应作用于所述输入框的聊天信息的用户删除指令，将所述光标位置之前的一个编辑位的内容删除，重新记录新的光标位置，其中所述编辑位的内容为文本字符或所述的图像。

为方便用户操控而在前一实施例的基础上进一步完善的实施例中，所述响应作用于所述输入框的聊天信息的用户删除指令的步骤中，该用户删除指令由所述图像选择器的界面中提供的删除控件响应用户触控操作而触发。

为适应非标准表情的输入而提出的实施例中：弹出图像选择器的步骤中，所述图像选择器为本地图像文件或远程图像文件定位界面，用户选定的图像文件被上传至所述服务器并生成对应的所述引用标识。

为统一用户输入不同类型图像的操作入口而提供的实施例中，所述响应聊天界面状态下产生的用户调用指令的步骤中，该用户调用指令由聊天界面提供的插图控件响应用户触控操作而触发。

为完善应用环境而提出的实施例中，所述聊天界面为基于HTML5协议而实现的网页界面，所述输入框由被赋予了contenteditable＝true属性的用于展示信息的标签所实现。

适应于本申请的目的之一而提供的一种图像输入装置，其包括：

图像选择模块，用于响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象；

图像插入模块，用于响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像；

信息上传模块，用于响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识；

信息更新模块，用于接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中所包含的引用标识解析显示为所述的图像。

适应于本申请的目的之一而提供的一种电子设备，包括中央处理器和存储器，所述中央处理器用于调用运行存储于所述存储器中的计算机程序以执行所述的图像输入方法。

适应于本申请的目的之一而提供一种非易失性存储介质，其以计算机可读指令的形式存储用依据所述的图像输入方法所述实现的计算机程序，该计算机程序被计算机调用时，执行该方法所包括的步骤。

相对于现有技术，本申请具有如下优势：

首先，本申请先响应用户调用指令而为用户提供图像选择器给用户选定图像对象，将图像对象相对应的引用标识封装为引用代码，通过将引用代码插入输入框中在编辑的聊天信息，由聊天工具的解析执行所述引用代码而使相应的图像显示在输入框中，由此在聊天界面中实现“所选即所得”的图像输入直观编辑效果，可供用户准确把握正在编辑的聊天信息中的图像元素，甚至方便用户以这些图像元素为图案的像素单位进行图案设计以承载其想表达的思想，因此，本申请直观和高效的特点，可以高效协助用户提升聊天过程中的沟通效率。

其次，本申请在通过聊天工具的解析机制实现在输入框中直观显示用户插入的图像的基础上，不同于现有技术中的转义标识占用多个字符的情况，而将图像视为一个单独的编辑单元，与单个字符同理仅占一个编辑位，因此，当需要删除图像时，仅需单次触控相关控件便可将已插入的图像删除，或者在输入框中移动光标需经过已插入的图像时，也仅需一次触控便可跳过已插入的图像，因此，本申请技术方案直观且高效的特点，可以有效提升用户在输入框中输入图像的编辑效率。

此外，本申请技术实现逻辑，藉由可解析执行的引用代码封装引用标识而实现在编辑过程中的图像显示，利用服务器本聊天界面之间对所述引用标识的共同认知又可实现消息通知时的图像显示，因此，可以确保聊天过程中用户输入的图像在聊天界面输入框中的输入显示以及最终在聊天界面消息区中的解析显示，这一技术实现逻辑显然可以适用各种不同类型的图像，相同的技术实现逻辑便于统一程序开发逻辑，有助于提升聊天工具的软件工程开发效率。

附图说明

本申请上述的和/或附加的方面和优点从下面结合附图对实施例的描述中将变得明显和容易理解，其中：

图1为现有技术中一种聊天工具的聊天界面的示意图，其中下方弹出了表情选择器，且其输入框中显示若干与表情选择器中的表情相对应的转义标识；

图2为实施本申请的技术方案相关的一种典型的网络部署架构示意图。

图3为本申请的图像输入方法的典型实施例的流程示意图。

图4为实施了本申请的技术方案的聊天工具的聊天界面的示意图，其输入框中显示若干从图像选择器中选定的表情所对应的图像及相关文字信息。

图5为本申请的图像输入装置的典型实施例的原理框图。

具体实施方式

下面详细描述本申请的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的，仅用于解释本申请，而不能解释为对本申请的限制。

本技术领域技术人员可以理解，除非特意声明，这里使用的单数形式“一”、“一个”、“所述”和“该”也可包括复数形式。应该进一步理解的是，本申请的说明书中使用的措辞“包括”是指存在所述特征、整数、步骤、操作、元件和/或组件，但是并不排除存在或添加一个或多个其他特征、整数、步骤、操作、元件、组件和/或它们的组。应该理解，当我们称元件被“连接”或“耦接”到另一元件时，它可以直接连接或耦接到其他元件，或者也可以存在中间元件。此外，这里使用的“连接”或“耦接”可以包括无线连接或无线耦接。这里使用的措辞“和/或”包括一个或更多个相关联的列出项的全部或任一单元和全部组合。

本技术领域技术人员可以理解，除非另外定义，这里使用的所有术语(包括技术术语和科学术语)，具有与本申请所属领域中的普通技术人员的一般理解相同的意义。还应该理解的是，诸如通用字典中定义的那些术语，应该被理解为具有与现有技术的上下文中的意义一致的意义，并且除非像这里一样被特定定义，否则不会用理想化或过于正式的含义来解释。

本技术领域技术人员可以理解，这里所使用的“客户端”、“终端”、“终端设备”既包括无线信号接收器的设备，其仅具备无发射能力的无线信号接收器的设备，又包括接收和发射硬件的设备，其具有能够在双向通信链路上，进行双向通信的接收和发射硬件的设备。这种设备可以包括：蜂窝或其他诸如个人计算机、平板电脑之类的通信设备，其具有单线路显示器或多线路显示器或没有多线路显示器的蜂窝或其他通信设备；PCS(PersonalCommunications Service，个人通信系统)，其可以组合语音、数据处理、传真和/或数据通信能力；PDA(Personal Digital Assistant，个人数字助理)，其可以包括射频接收器、寻呼机、互联网/内联网访问、网络浏览器、记事本、日历和/或GPS(Global PositioningSystem，全球定位系统)接收器；常规膝上型和/或掌上型计算机或其他设备，其具有和/或包括射频接收器的常规膝上型和/或掌上型计算机或其他设备。这里所使用的“客户端”、“终端”、“终端设备”可以是便携式、可运输、安装在交通工具(航空、海运和/或陆地)中的，或者适合于和/或配置为在本地运行，和/或以分布形式，运行在地球和/或空间的任何其他位置运行。这里所使用的“客户端”、“终端”、“终端设备”还可以是通信终端、上网终端、音乐/视频播放终端，例如可以是PDA、MID(Mobile Internet Device，移动互联网设备)和/或具有音乐/视频播放功能的移动电话，也可以是智能电视、机顶盒等设备。

本申请所称的“服务器”、“客户端”、“服务节点”等名称所指向的硬件，本质上是具备个人计算机等效能力的电子设备，为具有中央处理器(包括运算器和控制器)、存储器、输入设备以及输出设备等冯诺依曼原理所揭示的必要构件的硬件装置，计算机程序存储于其存储器中，中央处理器将存储在外存中的程序调入内存中运行，执行程序中的指令，与输入输出设备交互，借此完成特定的功能。

需要指出的是，本申请所称的“服务器”这一概念，同理也可扩展到适用于服务器机群的情况。依据本领域技术人员所理解的网络部署原理，所述各服务器应是逻辑上的划分，在物理空间上，这些服务器既可以是互相独立但可通过接口调用的，也可以是集成到一台物理计算机或一套计算机机群的。本领域技术人员应当理解这一变通，而不应以此约束本申请的网络部署方式的实施方式。

请参阅图2，本申请相关技术方案实施时所需的硬件基础可按图中所示的架构进行部署。本申请所称的服务器80部署在云端，主要提供即时通信服务，其可充当业务服务器，进一步连接起其他诸如媒体服务器、数据库服务器以及其他提供相关支持的服务器等，以此构成逻辑上相关联的服务机群，来为相关的终端设备例如图中所示的智能手机81和个人计算机82提供服务。所述的智能手机和个人计算机均可通过公知的网络接入方式接入互联网，与云端的服务器80建立数据通信链路，以便运行所述服务器所提供的服务相关的应用程序，包括由网页内嵌的应用程序。

本申请相关的技术方案中的聊天工具，作为即时通信软件，推荐基于HTML5协议进行开发，由此所开发的应用程序适宜于支持HTML5和Javascript的环境中运行。基于HTML5开发的应用程序可以做到与操作系统无关，包括IOS、HMS(鸿蒙)、Android以及其他提供同等功能的操作系统均可运行此类应用程序，通过这些应用程序的运行而协助用户实现即时通信。

本申请的应用程序的表现形式多种多样，其本质上是用于实现各种计算机功能，因此，其功能既可以是通过调用第三方浏览器访问网页，执行网页中植入的程序模块来表现，也可以是开发成适于在终端设备中安装的各种APP，在APP中内嵌浏览器的相关功能逻辑，通过这些APP运行时调用远程网页、执行各种代码来表现。因此，某种意义上，浏览器与应用程序并不是截然区别的概念，对于基于网页开发的在线服务而言，应用程序可能内建了浏览器用于访问网页，而通过独立的浏览器来访问网页则也可实现应用程序的同等功能。在基于页面技术开发终端应用的技术浪潮面前，本领域技术人员对此应当理解。

本申请所涉及的网页通常被发布到所述的服务器80中，终端设备通过浏览器调用该网页，或者通过运行所述功能相当的应用程序而调用该网页，均可发起对所述网页的访问。对网页的访问将被浏览器(或应用程序,下同)视为一个对于该目标网页的访问请求，由此便向所述服务器80发送请求以获取对应的目标网页，所述服务器80响应该请求后推送目标网页的HTML代码，浏览器对其进行解析执行，最终将目标网页的内容展示到浏览器所在的终端设备81、82的图形用户界面中。

本申请涉及的网页中的部分功能逻辑可能采用Javascript之类的脚本语言来编写，这些功能逻辑在目标网页被加载的过程中，随着浏览器的解析而运行。通过这些功能逻辑的运行，可以协助网页实现更为丰富的程序功能。

HTML5协议规定了多个标签可用于指示其对应的网页页面展示相关可视化信息，包括文字、图像等，这些标签主要包括：

<code>：是一个短语标签，用来定义计算机代码文本。

<div>：用于定义HTML文档中的一个分隔区块或者一个区域部分。

<p>：用于定义一个段落。

<h1>-<h6>：用于对应定义1-6中任意一种类型的标题。

<span>：用于对文档中的行内元素进行组合。

诸如此类的标签均可用于定义在网面的页面中显示的可视化信息。

HTML5还为其各种标签定义了一个contenteditable属性，该属性为基于布尔值的枚举类型，当该属性设置为true时，相应的标签便可以在页面中被编辑，反之，当其设置为false时，便不可编辑。

本申请中，可以利用上述的一种标签或多种标签例如<div>、<p>的结合来定义输入框，并将相应的标签设置为contenteditable＝true以便显示到网页的可视化信息可编辑，由此，当这些标签所携带的可视化信息被输出至页面后，便可由用户或程序对相关可视化信息进行编辑。

本申请对于HTML5协议的相关内容的引用，仅为示例性说明。本领域技术人员应当知晓，任何与此相当的已知技术手段，均可被替换使用。其中适于构造输入框的标签，随着HTML语言版本的发展，也可能被适应性修改、扩展、丰富，而只要这些变化能够满足本申请的需求，也应当将其替换应用理解为不超脱本申请的创造精神所涵盖的范围。

在理解上述所揭示的与本申请技术方案相关的相关应用环境和开发环境的基础上，请参阅如下说明继续了解本申请的多种实施方式。

本申请的一种图像输入方法，可被编程实现基于网页的程序，通过浏览器调用运行，或者将其集成为应用程序(APP)进行运行，运行于个人计算机或智能手机之类的终端设备中。请参阅图3，该方法典型实施例包括如下步骤：

步骤S11，响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象：

请结合图4所示的基于该方法所构造的一个聊天工具运行实例的聊天界面6，该聊天界面6包括用于展示正在实施即时通信的各方用户的聊天记录的消息区65、用于输入本机用户的聊天信息的输入框60。输入框60的左侧设置有一插图控件605，其右侧显示一发送控件603，用于发送输入框60中的聊天信息。当前，该聊天界面6正处于编辑聊天信息可插入图像的状态，该状态由作用于该聊天界面6的用户调用指令而触发切换，具体而言，在聊天界面6中，用户通过触控所述的插图控件605产生用户调用指令，便可触发弹出图像选择器68，进入当前聊天界面6。

所述图像选择器68主要用于显示预先配备的各种图像，这些图像占据图像选择器68的较大版面，可以是基于emoji的标准表情，也可以是其他类型的非标准表情，如Gif动画表情、静态图片表情、短视频表情等自定义表情，这些图像以表情图元的形式被罗列于图像选择器68的界面中，以便用户通过点选其中之一向输入框60中插入相应的图像。

图像选择器68被弹出之前，如果聊天界面6的输入框60处于失焦状态，通常此时会将聊天界面6最大化显示，因而聊天界面6下方将不能见到任何其他类型的界面；如果聊天界面6的输入框60处于非失焦状态，通常便会自动唤出系统默认输入法，于是聊天界面6便被收卷至顶部，而其底部则显示输入法的界面。

图像选择器68被弹出之后，无论聊天界面6此先处于何种状态，此时，图像选择器68的界面将置于所述输入法的界面所占据的版面，而聊天界面6同理被收卷至屏幕的顶部。可以理解，如果此前聊天界面6下方正显示输入法界面，当所述插图控件605被用户触控而唤出图像选择器68后，图像选择器68的界面将覆盖系统默认输入法正在显示的界面。可以理解，在显示图像选择器68的界面期间，应避免非人为事件导致输入框60被选中，以避免重新弹出系统默认输入法界面反过来覆盖图像选择器界面。

此外应当理解，可以采用手势触控操作的方式来触发所述的用户调用指令，从而替换所述的插图控件605，留出更为丰富的版面空间供设计其他用途的控件。

一方面，由于聊天界面6的输入框60需要失焦才能正常显示图像选择器68，一旦输入框60失焦则用户正在编辑的当前光标位置的信息便会丧失；另一方面，当用户需要在聊天信息中插入图像时，一般均是希望在当前光标位置处插入其所期望的图像。为了处理这一矛盾，在用户触发所述的用户调用指令之后，可通过一个内存变量先行记录输入框60中的当前状态下光标所处的具体位置，即光标位置，以便后续可以利用该光标位置的定位作用将需要插入的图像插入到聊天信息的正确位置。

步骤S12，响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像：

请继续参阅图4，图像选择器界面所列示的图像，每个图像都被计算机程序理解为一个图像对象加以调用，而每个图像对象均被赋予一个引用标识以便实施内存调用，以便通过该引用标识可以识别和确定相应的图像。所述的引用标识，在本实施例中，可以被表述为转义符，只要聊天工具本身可以通过该转义符唯一性地确定相应的图像对象从而输入相应的图像即可。

当用户在图像选择器68中选定一个表情图元时，意味着用户需要向输入框60中插入其对应的图像，因此，可按如下具体步骤实现将所述图像插入到输入框60的聊天信息中：首先，依据图像选择器界面中的表情图元与其引用标识之间的关系，确定用户选定的表情图元的引用标识；然后，生成包含该引用标识的引用代码，引用代码主要包括可被解析执行的用于显示所述表情图元对应的图像的标签，例如HTML5中的<picture>、<img>标签等，此类标签将引用标识理解为图像的资源引用地址，后续在被解析执行时，便能依据引用标识调用显示相应的图像；最后，依据此前存储的光标位置信息，将所生成的引用代码插入到输入框60中聊天信息的相应光标位置处，由此完成引用代码的插入。当引用代码被插入后，依据网页解析机制，会自动被解析执行，从而在所述光标位置处显示用户选定的相应的表情图元的图像，实现用户“所选即可见，所见即所得”。

被插入至聊天信息中的图像，与单个文本字符同理，占用一个编辑位，将被作为一个独立的可编辑单元对待。可见，聊天信息中一个编辑位所包含的内容既可能是文本字符也可能是所述的图像。当图像被插入聊天信息中后，将导致输入框60中光标位置顺序下移一个编辑位，此时光标位置发生变动，因此，为便于后续正确定位，此时需要适应所述光标位置的变动更新内存中记录的光标位置信息，以便后续紧接插入的图像能够紧随其后，实现连续插入图像。

为了便于用户删除聊天界面6输入框60内聊天信息中已经插入的图像，所述的图像选择器68在其界面中提供了一个删除控件680，该删除控件680被用户触控时，便触发用户删除指令，此时，响应于该用户删除指令，便按照内存中存储的光标位置信息，确定聊天信息中相应的光标位置，然后将光标位置之前的一个编辑位的内容删除，无论这个内容是文本字符还是所述已插入的图像，从而实现通过图像选择器68删除聊天信息中的内容的目的，而不必重新唤出系统默认输入法，方便连续输入图像，避免用户来回切换繁琐操作。可以理解，当聊天信息中的一个编辑位被删除后，其光标位置将退格前移一位而发生变动，此时也应及时重新记录内存中的光标位置信息实现其更新，以便后续正确进行光标定位。需要指出的是，所述用户删除指令也可通过识别手势触控操作来实现，由此避免提供所述的删除控件680，为图像选择器68提供更大的页面布局空间。

当响应用户删除指令而将聊天信息中的一个编辑位的内容删除时，可以理解，如果该编辑位的内容是所述已插入的图像，则在后台程序处理时，需要将该图像所对应的整段引用代码删除，以便确保输入框60中的聊天信息的正确显示，避免因后台程序删除不全而导致聊天信息中出现乱码。

步骤S13，响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识：

当用户完成输入框60中的聊天信息的编辑之后，便可通过聊天界面6中提供的发送控件603发出所述的聊天信息，当然，其他实施例中也不排除可以采用手势触控操作代替所述的发送控件603以便为聊天界面6预留更多界面布局空间。

响应于触控所述发送控件603产生的用户发送指令，本步骤中，便将所述输入框60中的聊天信息相对应的内存数据封装于信息发送通知中提交给为本申请的聊天工具提供聊天服务的服务器，提交给服务器的信息发送通知中，对应已插入的图像部分，可以处理成仅包含该图像相对应的引用标识，也可处理成包含包含整段引用代码从而包含所述的引用标识。无论以何种方式表述所述的引用标识，只要本申请的聊天工具在经服务器接收到该用户提交的聊天信息后可以将其对应解析显示为对应的正确图像即可。

服务器接收所述信息发送通知后，会提取出用户的聊天信息将其封装成通知消息发送给该用户所参与的会话的各方，如果该用户的聊天界面6属于群组聊天会话，则群发给包括用户自身在内的相关群成员；如果该用户的聊天界面6属于一对一的聊天会话，则也群发给包括该用户自身在内的对话双方。此外，服务器还可将该聊天信息存储为该用户相关的聊天记录，以便该用户或该些聊天会话的参与成员后续调用。

步骤S14，接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面6的聊天记录消息区65，将其中所包含的引用标识解析显示为所述的图像：

当前用户与参与会话各方同理，其将接收到服务器发送的所述通知消息，该通知消息中包含该用户此前提交的所述聊天信息，当接收到该通知消息后，后台程序将从中提取出所述的聊天信息，然后将其添加至所述聊天界面6的消息区65中。对于包含所述图像的引用标识的聊天信息，当其被添加至消息区65中后，在被解析执行显示时，将依据其中的引用标识调用相应的图像对象，在消息区65的相应记录中显示该聊天信息，并且确保该聊天信息中的图像对象以其相应的图像显示。由此，用户自身在聊天界面6输入框60中发出的包含图像的聊天信息，最终也将发布到其聊天界面6的消息区65中原样显示，确保最终发布到聊天会话中的聊天信息与用户编辑的内容一致。其中，服务器推送其通知消息时，无论其中的聊天信息中对应所包含的图像的表达是以图像的引用标识的形式，还是以图像的包含引用标识的引用代码的形式，只要聊天工具在开发时遵守预设的格式化机制，均可将其还原为与输入框60中编辑的内容一致的形态。

以上，便构造了本申请的图像输入方法的典型实施例及其变化实施例。以上实施例中，图像选择器68将各个图像对象以列表的形式给出，较为适用于一些已经由聊天工具自身配置的或者预先自定义或下载的图像对象的选定，但本申请的技术方案所能实现的功能远不止于此。本申请还允许用户在输入框60中输入其他未经预定的图像对象，为进一步丰富本申请的内涵，以下继续介绍本申请的其他实施例。

本申请的图像输入方法的另一实施例中，请继续参阅图3和图4，其技术实现逻辑同于前一实施例，但主要用于为在聊天界面6输入框60中输入未经预先定义的本地图像文件或远程图像文件提供服务。具体而言，在本实施例中，所述图像选择器68被实现为一个用于打开各种指定格式的本地图像文件的定位界面，或者被实现为一个用于搜索获取远程在线图像文件的定位界面，当其通过所述的用户调用指令触发弹出时，用户可以从中查找到相应的图像文件，选择确定后，即被视为用户选定了指定的图像文件作为所述的图像对象。

由于所述图像对象并非存储于为本申请提供聊天服务的所述服务器中，不便于参与聊天会话的成员获取，因此，当用户选定所述图像对象后，本实施例便将该图像对象上传或提交给所述的服务器，服务器于是获取到相应的图像文件进行存储，然后生成相应的统一资源定位符(URL)作为其引用标识，将该引用标识返回给当前用户。

可以理解，合法用户只需通过访问该URL，便可获取并显示服务器已经存储的所述图像文件。因此，当前用户获得该引用标识即URL后，便可以该URL生成所述的引用代码，在引用代码中包含对该URL的引用，然后将引用代码插入至光标位置信息所指向的输入框60聊天信息中的相应光标位置处。当插入至聊天信息中的引用代码被解析执行时，便可加载该URL所指向的存储于服务器中的相应的图像文件而在输入框60中以一个编辑位为单元显示相应的图像，实现在输入框60中插入图像。关于光标位置变动引用的处理则与在前的实施例同理，恕不赘述。

当用户发出其编辑好的包含已插入图像的聊天信息时，其中的插入图像同理将以包含URL作为引用标识的方式发送给服务器，同时服务器向会话各方发送的通知消息所包含的聊天信息中，也可以同种方式表述该图像，最终，会话各方用户接收到该聊天信息后，进行解析显示时，对于其中的图像，以聊天信息中所包含的URL作为引用标识而从服务器下载相应的图像文件，将其还原显示为相应的图像，实现将聊天消息发布到用户所在的聊天界面6的聊天记录消息区65中。

综合以上各实施例可知，本申请的图像输入方法，得益于HTML5中contenteditable提供的可编辑能力，将非表单标签实现为可编辑内容的效果，采用相对应的技术实现逻辑，解决了网页聊天界面6的输入框60中直观输入图像的问题，便于用户在聊天过程中高效编辑沟通内容，且便于程序开发人员以统一的程序开发逻辑提供适于在输入框60中直观输入各种不同类型图像的解决方案。

以本申请的技术方案所构造的网页，与终端设备与操作系统均无关，只要终端设备的操作系统支持对应的网页协议和相关脚本语言，例如HTML5、Javascript(或python之类，视网页中脚本语言之需要而定)等，理论上便可用于运行以本申请的技术方案所构造的网页，通过该网页的运行而体现本申请的各项优势。

进一步的，可以通过将上述的图像输入方法中的各个实施例进行功能化，构造出本申请的一种图像输入装置，按照这一思路，请参阅图5，其典型实施例中，该装置包括：

图像选择模块11，用于响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象；

图像插入模块12，用于响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像；

信息上传模块13，用于响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识；

信息更新模块14，用于接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中所包含的引用标识解析显示为所述的图像。

为了便于本申请的执行，提供一种电子设备，包括中央处理器和存储器，所述中央处理器用于调用运行存储于所述存储器中计算机程序以执行如前述的一种图像输入方法的步骤。

可以看出，存储器适宜采用非易失性存储介质，通过将前述的方法实现为计算机程序，安装到手机之类电子设备中，相关程序代码和数据便被存储到电子设备的非易失性存储介质中，进一步通过电子设备的中央处理器运行该程序，将其从非易性存储介质中调入内存中运行，便可实现本申请所期望的目的。因此，可以理解，本申请的一个实施例中，还可提供一种非易失性存储介质，其以计算机可读指令的形式存储有依据所述的图像输入方法的各个实施例所实现的计算机程序，该计算机程序被计算机调用运行时，执行该方法所包括的步骤。

综上所述，本申请为聊天工具实现了在聊天界面输入框中输入图像并直观显示的技术手段，为各种不同形式的图像的输入提供统一、高效、直观的编辑功能，可以改善聊天工具的通信效率，优化整体用户体验。

本技术领域技术人员可以理解，本申请包涉及用于执行本申请中所述操作、方法中的一项或多项的设备。这些设备可以为所需的目的而专门设计和制造，或者也可以包括通用计算机中的已知设备。这些设备具有存储在其存储器之内的计算机程序，这些计算机程序选择性地激活或重构。这样的计算机程序可以被存储在设备(例如，计算机)可读介质中或者存储在适于存储电子指令并分别耦联到总线的任何类型的介质中，所述计算机可读介质包括但不限于任何类型的盘(包括软盘、硬盘、光盘、CD-ROM、和磁光盘)、ROM(Read-Only Memory，只读存储器)、RAM(Random Access Memory，随即存储器)、EPROM(ErasableProgrammable Read-Only Memory，可擦写可编程只读存储器)、EEPROM(ElectricallyErasable Programmable Read-Only Memory，电可擦可编程只读存储器)、闪存、磁性卡片或光线卡片。也就是，可读介质包括由设备(例如，计算机)以能够读的形式存储或传输信息的任何介质。

本技术领域技术人员可以理解，可以用计算机程序指令来实现这些结构图和/或框图和/或流图中的每个框以及这些结构图和/或框图和/或流图中的框的组合。本技术领域技术人员可以理解，可以将这些计算机程序指令提供给通用计算机、专业计算机或其他可编程数据处理方法的处理器来实现，从而通过计算机或其他可编程数据处理方法的处理器来执行本申请公开的结构图和/或框图和/或流图的框或多个框中指定的方案。

本技术领域技术人员可以理解，本申请中已经讨论过的各种操作、方法、流程中的步骤、措施、方案可以被交替、更改、组合或删除。进一步地，具有本申请中已经讨论过的各种操作、方法、流程中的其他步骤、措施、方案也可以被交替、更改、重排、分解、组合或删除。进一步地，现有技术中的具有与本申请中公开的各种操作、方法、流程中的步骤、措施、方案也可以被交替、更改、重排、分解、组合或删除。

以上所述仅是本申请的部分实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本申请原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也应视为本申请的保护范围。

Claims (10)

1.一种图像输入方法，其特征在于，包括如下步骤：

响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象；

响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像；

响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识；

接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中所包含的引用标识解析显示为所述的图像。

2.如权利要求1所述的方法，其特征在于：弹出图像选择器的步骤中，所述图像选择器的界面覆盖经该输入框唤出的输入法界面，图像选择器的界面中包含多个供用户选定的表情图元作为所述的图像对象。

3.如权利要求2所述的方法，其特征在于，其包括如下步骤：

响应作用于所述输入框的聊天信息的用户删除指令，将所述光标位置之前的一个编辑位的内容删除，重新记录新的光标位置，其中所述编辑位的内容为文本字符或所述的图像。

4.如权利要求3所述的方法，其特征在于，所述响应作用于所述输入框的聊天信息的用户删除指令的步骤中，该用户删除指令由所述图像选择器的界面中提供的删除控件响应用户触控操作而触发。

5.如权利要求1所述的方法，其特征在于：弹出图像选择器的步骤中，所述图像选择器为本地图像文件或远程图像文件定位界面，用户选定的图像文件被上传至所述服务器并生成对应的所述引用标识。

6.如权利要求1所述的方法，其特征在于，所述响应聊天界面状态下产生的用户调用指令的步骤中，该用户调用指令由聊天界面提供的插图控件响应用户触控操作而触发。

7.如权利要求1所述的方法，其特征在于：所述聊天界面为基于HTML5协议而实现的网页界面，所述输入框由被赋予了contenteditable＝true属性的用于展示信息的标签所实现。

8.一种图像输入装置，其特征在于，其包括：

图像选择模块，用于响应聊天界面状态下产生的用户调用指令，记录该聊天界面内聊天信息输入框中的光标位置，弹出图像选择器以供用户选定图像对象；

图像插入模块，用于响应图像对象被选定而生成包含其引用标识的引用代码，将该引用代码插入至所述光标位置中，使其被解析执行而在该输入框中显示相应的图像；

信息上传模块，用于响应用户发送指令，向服务器提交输入框中的聊天信息，其中已插入的图像对象被表述为其引用标识；

信息更新模块，用于接收服务器的包含所述聊天信息的通知消息，将该聊天信息发布至该聊天界面的聊天记录消息区，将其中所包含的引用标识解析显示为所述的图像。

9.一种电子设备，包括中央处理器和存储器，其特征在于，所述中央处理器用于调用运行存储于所述存储器中的计算机程序以执行如权利要求1至7中任一项所述的方法的步骤。

10.一种非易失性存储介质，其特征在于，其以计算机可读指令的形式存储有依据权利要求1至7中任意一项所述的方法所实现的计算机程序，该计算机程序被计算机调用运行时，执行该方法所包括的步骤。

Images