（JavaScript）从文件或文件读取器导入外部<object> svg对象

Question

我正在使用Two.js，我想让用户导入一个svg文件并将其显示在我的场景中。

Two.interpret（）可以采取在它SVG数据标签的任何DOM，所以我创造了这个功能从文件模拟标签：

this.m_Two.interpretFromFile = function (two, fname) { 
     //Create an object and load an svg from 'fname' 
     var object = document.createElement("object"); 
     //Set the id to the filename without path or extension 
     object.id = fname; 
     object.id = object.id.replace(/\\/g, '/'); 
     object.id = object.id.substring(object.id.lastIndexOf('/')+1, object.id.lastIndexOf('.')); 
     console.log("Importing " + object.id); 
     object.data = fname; //HTML takes care of the rest 
     object.type = "image/svg+xml"; 
     object.width = 64; //Import from file maybe? 
     object.height = 64; 
     object.style = "visibility:hidden;position:absolute;left:0px;top:0px;"; 
     document.body.appendChild(object); //Add it to the body (invis) that way it loads 
     //When it loads, finish up 
     object.onload = function() { 
      if (!object.contentDocument || object.contentDocument.getElementsByTagName("svg").length < 1) return; 
      var svgObj = object.contentDocument.getElementsByTagName('svg')[0]; 
      var ret = two.interpret(svgObj); 
      document.body.removeChild(object); //Remove it. Use path.clone to duplicate stuff.. 
      return ret; //Return our new svg path 
     } 
    }; 

此功能需要两个实例，和一个文件的url，并返回一个two.path。

当使用控制台时，这一切都可以正常工作，并且与 twoInstance.interpretFromFile（twoInstance，“images/Test.svg”）;

但是，我在本地运行这些文件进行测试，我当然不希望任何人进入浏览器的控制台并使用该功能，已经知道该文件的确切路径，并且知道键入“file：/ /”这条道路...... Yeesh

document.getElementById("dWorkSpace").ondrop = function(e) { 
      e.preventDefault(); //Default event loads the file itself.. KILL IT WITH FIRE. 

      if (!e.dataTransfer || !e.dataTransfer.items.length > 0 || !e.dataTransfer.files[0]) return; 

      var file = e.dataTransfer.files[0]; 

      twoInstance.interpretFromFile(twoInstance, "file://" + file.name); 
    } 

‘file.name’只给出了文件，而不是路径（是的，我知道这是在浏览器中securety的事情了。我已经看了所有的关于这个问题的其他问题..）

因此，现在，我可以使用FileReader来读取svg文件本身，但是如何将该数据读入标签？我需要这种格式的一些点：

  <object data="Test.svg" type="image/svg+xml"></object> 

因为Two.js似乎不喜欢“SVG”标签..只是“对象”标签..

我的enlongated问题非常抱歉正如你所看到的，我在这个兔子洞里很深。我试图只使用相关的代码，但老实说，整个事情是巨大的，我不想发布一切。