vue对于ntko的应用经验

本来生活过的美滋滋，突然告知要用ntko写一个操作word文档的界面，看到后立马提起兴致看了下ntko的基本文档，安装ntko，研究小demo。研究完后心里立刻妈卖批了，这个ntko居然限制游览器与word版本，可把我研究苦了。chrome45后就限制了插件入口，firfox跟chrome差不多，所以只能用一些特定的进行开发。

1.开发环境

2.单页面的ntko嵌入到vue项目中去

if (browser=="IE"){ 
    if(window.navigator.platform=="Win32"){ 
    document.write(' 
    '); document.write(' 
    '); document.write('classid+'"'); document.write('codebase="'+codebase+'" width="'+width+'" height="'+height+'"> '); document.write('+MakerCaption+'"> '); document.write('+MakerKey+'"> '); document.write('+ProductCaption+'"> '); document.write('+ProductKey+'"> '); document.write('+NoExpireKey+'"> '); document.write(' '); document.write(' '); document.write(' '); document.write('  不能装载文档控件。请在检查浏览器的选项中检查浏览器的安全设置。  '); document.write(''); } if(window.navigator.platform=="Win64"){ 
    document.write(' 
    '); document.write(' 
    '); document.write('classidx64+'"'); document.write('codebase="'+codebase64+'" width="'+width+'" height="'+height+'"> '); document.write('+MakerCaption+'"> '); document.write('+MakerKey+'"> '); document.write('+ProductCaption+'"> '); document.write('+ProductKey+'"> '); document.write('+NoExpireKey+'"> '); document.write(' '); document.write(' '); document.write(' '); document.write('  不能装载文档控件。请在检查浏览器的选项中检查浏览器的安全设置。  '); document.write(''); } } else if (browser=="firefox"){ 
    document.write('codebase+'" width="'+width+'" height="'+height+'" ForOnSaveToURL="ntkosavetourl" ForOndocumentopened="ntkoondocumentopened"'); document.write('ForOnpublishAshtmltourl="ntkopublishashtml"'); document.write('ForOnpublishAspdftourl="ntkopublishaspdf"'); document.write('ForOnSaveAsOtherFormatToUrl="ntkosaveasotherurl"'); document.write('_MakerCaption="'+MakerCaption+'" '); document.write('_MakerKey="'+MakerKey+'" '); document.write('_ProductCaption="'+ProductCaption+'" '); document.write('_ProductKey="'+ProductKey+'" '); document.write('_NoExpireKey="'+NoExpireKey+'" '); document.write('clsid="{'+classid+'}" >'); document.write('  尚未安装NTKO Web FireFox跨浏览器插件  '); document.write(' '); }else if(browser=="chrome"){ 
    document.write('classid+'}" ForOnSaveToURL="ntkosavetourl" ForOndocumentopened="ntkoondocumentopened"'); document.write('ForOnpublishAshtmltourl="ntkopublishashtml"'); document.write('ForOnpublishAspdftourl="ntkopublishaspdf"'); document.write('ForOnSaveAsOtherFormatToUrl="ntkosaveasotherurl"'); document.write('_IsUseUTF8URL="-1" '); document.write('_IsUseUTF8Data="-1" '); document.write('_MakerCaption="'+MakerCaption+'" '); document.write('_MakerKey="'+MakerKey+'" '); document.write('_ProductCaption="'+ProductCaption+'" '); document.write('_NoExpireKey="'+NoExpireKey+'" '); document.write('_ProductKey="'+ProductKey+'" '); document.write('codebase="'+codebase+'" width="'+width+'" height="'+height+'" type="application/ntko-plug" '); document.write('  尚未安装NTKO Web Chrome跨浏览器插件  '); document.write(''); }else if (Sys.opera){ 
    alert("sorry,ntko web印章暂时不支持opera!"); }else if (Sys.safari){ 
    alert("sorry,ntko web印章暂时不支持safari!"); } 

str = ' 
    ' + ' 
    '+ 'classid+'"')+ 'codebase="'+codebase+'" width="'+width+'" height="'+height+'"> ' + '+MakerCaption+'"> '+ '+MakerKey+'"> ' + '+ProductCaption+'"> ' + '+ProductKey+'"> ' + '+NoExpireKey+'"> ' + ' ' + ' ' + ' '+ '  不能装载文档控件。请在检查浏览器的选项中检查浏览器的安全设置。  ' + ''); document.getElementById('container').innerHTML = str; 

<script event="OnDocActivated(isActivated)" for="TANGER_OCX"> document.getElementById('aaaaa').onD(isActivated); </script> 

在Vue项目中进行定义onD属性

export default({ 
    mounted(){ 
    document.getElementById('aaaaa').onD = function(){ 
    } } }) 

这样算是完成了事件的传递工作，还有一个坑就是OnDocActivated不执行完毕好像没有ActiveWindow这个属性，所以当时利用了一个定时器延迟执行。

总结

这个ntko的项目写的人挺绝望的，IE游览器用的让人绝望，ntko每次加载还会出现页面卡顿的情况，开发时间大多数是用在等待IE游览器运行，挺考验人的耐心的。