html 而非 posting/hitting 网站中的表单标签

Question

所以我想为我和我的朋友制作一个 link 起酥油在我们的小型服务中心使用但我有一个小问题。我设置了一个快速服务器来完成这项工作，同时创建了一个文件上传器我用 postman 来测试。两者都工作正常，但这就是我遇到问题的地方。每当我使用下面的代码片段尝试将数据发送到 'api' 它甚至 post/touch 网站都没有 是的，我调试了看它是否触及 只有当我使用表单 post/get 方法时，代码才不起作用

HTML 代码片段

 <form method="POST" action="/shorten" enctype="application/x-www-form-urlencoded">
                <label for="fUrl" class="sronly">URL</label>
                <input class="input"
                    required
                    placeholder="URL"
                    type="url"
                    name="fUrl"
                    id="fUrl"
                />
    <button type="submit">Shrink This!</button>
    </form>

我尝试了很多东西，我不知道是因为我用 EJS 渲染它还是什么我用 HTML 文件自己测试了它，但无济于事如果这 post 中有任何内容我错过了，请告诉我！

Answer 1

客户端和服务器之间的映射似乎有问题。尝试将 action 值更改为您的 API 端点。

 <form method="POST" action="http://myserver.com/shorten" enctype="application/x-www-form-urlencoded">
            <label for="fUrl" class="sronly">URL</label>
            <input class="input"
                required
                placeholder="URL"
                type="url"
                name="fUrl"
                id="fUrl"
            />
<button type="submit">Shrink This!</button>
</form>

Answer 2

浏览器也有点问题fast/slow

修复在这里

// thanks to Vikasdeep Singh for this oddly specific url regex test
function isValidURL(string) {
    var res = string.match(/(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g);
    return (res !== null)
};

var el = document.getElementById("yourButtonID");
el.addEventListener("click", avoidNSErrorWithFirefox, false); //Firefox

function avoidNSErrorWithFirefox() {
    ElementInterval = setInterval(function() {
        var url = document.getElementById("inputURL").value; // input tag
        if (isValidURL(url)) {
            var xhr = new XMLHttpRequest();
            xhr.open("POST", "https://your-url.com/shorten", true);
            xhr.setRequestHeader('Content-Type', 'application/json');
            xhr.send(JSON.stringify({
                "url": url
            }));
        }
        clearInterval(ElementInterval);
    }, 0);
};

在我测试过的所有浏览器上都非常有效

edge chrome opera firefox

希望我和我的朋友们能帮您解决表格/快递问题！

html 而非 posting/hitting 网站中的表单标签

form tag in html not posting/hitting website

html

ejs

node.js

express