Блог

Итак, у меня есть форма со следующим тегом script после формы

 <script type="module"> 
    const data = await fetch("/lookup/:url").then(result =>result.json())

    async function onFormSubmit(ev) {ev.preventDefault();
    const EL_form = ev.currentTarget;
    return (await fetch(EL_form.action)).json();
                          }
                                  
    const ELS_form = document.querySelectorAll("form[action]");
    ELS_form.forEach((el) => el.addEventListener("submit", (ev) => {
        onFormSubmit(ev).then(res => console.log(res));
    })); 
                  
</script>
 

Когда форма отправлена, я хочу, чтобы URL-адрес, по которому выполняется поиск, отображался в /:URL части slug и возвращал требуемый JSON.

Однако, похоже, это не работает, и я получаю ошибку 404 при запуске на моем локальном хосте. Страница панели поиска загружается нормально, но не выполняет поиск /:URL

Любой совет?

Вот копия моей формы:

 <form action="/lookup/:url" method="GET">
    <div class="inner-form">
        <div class="input-field first-wrap">
            <div class="svg-wrapper">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
                    <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11"></path>
                </svg>
            </div>
                <input name="search" type="text" placeholder="Paste a domain here" />
            </div>
                    
            <div class="input-field second-wrap">
                <button class="btn-search" type="submit">SEARCH</button>
            </div>
                              
            </div>
                <span class="info">ex. JeepBeef.com</span>
</form>