Bild-zu-Text-OCR-Webbild-URL-Upload

Question

Bezogen auf die funktionierende Codepen-Demo hier: Wenn Sie auf die Schaltfläche „Datei auswählen“ klicken, um ein Bild von Ihrem lokalen Computer hochzuladen und den Text aus dem Bild zu extrahieren, funktioniert die Anwendung einwandfrei. Aber wie lade ich eine Webbild-URL wie diese anstelle einer lokalen Computerdatei hoch und gebe die OCR-Textergebnisse mit Hilfe der -Schaltfläche aus, die ich in der Demo markiert habe? Wenn ich Hilfe bekommen kann, wäre ich dankbar :)

<div class="内容额外"><input id="文件" type="文件" onchange="proccess(window.lastFile=this.files[0])"></div>Ich habe versucht, onchange in onclick zu ändern, aber es hat nicht funktioniert.

Answer 1

您可以添加这样的输入：

  


  Or paste image url : 
  

并检查您的流程函数，参数是否为字符串，如果是，则意味着我们有一个 URL，因此我们只需将此 url 定义为 src 值：

function proccess(inputData){
  $(".result").html("");
  var src;
  if(typeof(inputData) == 'string') {
    src = inputData
  } else {
    src = (window.URL ? URL : webkitURL).createObjectURL(inputData);
  }
  //do what you want after that...
  //...
}