总需求:我方开发的webim需要通过sdk的方式交给第三方内嵌进web页面。
需求分析:我方使用vuejs开发,通过webpack打包成js文件。所以问题在于把js文件嵌进第三方页面。
实现方案:生成一个js文件,里面实现一个渲染div的方法,这个div到时候就是我们webim在第三方页面显示的容器(需要新建一个css文件,根据需求实现webim在第三方页面的样式。这个css文件一并交给第三方),给div添加<app></app>的innerHtml值。这个app和我们自己vue挂载的元素id一致。
vardiv=document.createElement('div');
div.setAttribute('class','nid');
div.innerHTML='';
document.body.appendChild(div);
将此js文件复制到第三方文件的根目录,同时将生成的build文件夹一并复制过去,就实现了嵌入方案。详见github => web嵌入