如何使用 javascript 将图像发送到 discord webhook

Question

const params = new URLSearchParams(window.location.search);
$(document).ready(_ => {
  if (params.get("url") != null) {
    $("input")[0].value = params.get("url");
  }
  if (params.get("img") != null) {
    $("input")[1].value = params.get("img");
  }
});

let url;
let img;

let submit = _ => {
  url = $("input")[0].value;
  img = $("input")[1].value;

  if (!url.length) {
    return alert('Please enter URL');
  }

}

let send = _ => {

  $.ajax({
    type: "POST",
    url: url,
    async: true,
    data: {
      file: (img)
    },
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<div class="box">
  <p title="Webhook url to send spam message">Webhook URL</p><input required name="inp1" placeholder="https://discord.com/api/webhooks/........." type="url" autocomplete></input>
</div>
<div class="box">
  <p title="Message you want to spam it">Image</p><input required name="inp2" placeholder="Image Link" type="file"></input>
</div>

<a onclick="submit()"><button id="button" >Send</button></a>

我希望通过不和谐聊天中的 API 发送附件。我试过这样做，但没有用。我认为 file:() 可能是问题所在，但也是我不知道的输入类型

Answer 1

没有 jQuery 你可以尝试使用 fetch api in conjunction with the FormData interface and the FileList

const d=document;
const q=(e,n=d)=>n.querySelector(e);

d.addEventListener('DOMContentLoaded', ()=>{
  q('button#button').addEventListener('click', e=>{
    e.preventDefault();

    let url = q('input[name="inp1"]').value;
    let files = q('input[name="inp2"]').files;

    if (!url.length) return alert('Please enter URL');

    let fd = new FormData();
        fd.set('url', url);
        fd.set('img', files.item(0));

    fetch( url, { method:'post', body:fd } )
      .then(r=>r.text())
      .then(text=>{
        alert(text)
      })
  })
});

<div class="box">
  <p title="Webhook url to send spam message">Webhook URL</p>
  <input required name="inp1" placeholder="https://discord.com/api/webhooks/........." type="url" autocomplete />
</div>

<div class="box">
  <p title="Message you want to spam it">Image</p>
  <input required name="inp2" placeholder="Image Link" type="file" />
</div>

<button id="button">Send</button>

jQuery 版本很可能不太正确，因为该片段使用 $.post 方法产生错误并且不熟悉 jQuery 我看不出错误

const params = new URLSearchParams( window.location.search );
$(document).ready(() => {
  let url;
  let img;
  let fd=new FormData();

  if( params.get("url") != null ) {
    $("input[name='inp1']")[0].value = params.get("url");
  };

  $('#button').click(e=>{
    url = $("input[name='inp1']")[0].value;
    img = $("input[name='inp2']")[0]; 


    if( !url.length ) {
      return alert('Please enter URL');
    }
    
    fd.set('url',url);
    fd.set('img',img.files.item(0));

    $.ajax({
      type:"POST",
      url:url,
      data:fd,
      success:r=>{console.log(r)},
      error:e=>{console.warn(e)}
    });
  });
});

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<div class="box">
  <p title="Webhook url to send spam message">Webhook URL</p>
  <input required name="inp1" placeholder="https://discord.com/api/webhooks/........." type="url" autocomplete />
</div>

<div class="box">
  <p title="Message you want to spam it">Image</p>
  <input required name="inp2" placeholder="Image Link" type="file" />
</div>

<button id="button">Send</button>

也许值得注意的是，您无法以编程方式设置 file input 元素的值 - 只有用户可以通过浏览并选择文件来设置此值。

如何使用 javascript 将图像发送到 discord webhook

How to send img to discord webhook with javascript

html

javascript