從中獲取src值的圖像 <img> 標記並提交給 <input type=“file”> 通過JavaScript

Question

我有一個HTML表單，允許用戶上傳圖像，如下所示：

    <form method="POST" action="/somewhere">
    <input type="file" />
    <input type="submit" />
    </form>

我的問題是：

i）如何選擇html（img）標記中的圖像，並僅使用javascript在類型為“ file”的輸入元素中選擇圖像，然后提交表單，而無需用戶填寫並單擊任何內容？

或者，要理解我的問題，請假設您要在value =“”中嵌入文件。 [編輯]

Answer 1

出於安全原因，您不能為input [type =“ file”]設置默認值

Answer 2

這將取決於該圖像的來源。 如果您來自其他國家，那您一定會被困住，否則，

fetch(img.src) // fetch the image resource
  .then(r => r.blob()) // as blob
  .then(blob =>{
    cont form = new FormData(); // create a FormData
    form.append('file', blob, filename); // add the blob, I let you define the filename
    // post it to your server
    return fetch('/somewhere', {method:'POST', body:form});
  }).then(r => console.log('sent'));

在這里，我使用ES6語法和訪存API ，但可以使用XHR進行相同的操作。
FormData上的文檔。