先记住这个答案
type="url" 的校验是浏览器在表单提交时自动进行的约束验证：值为空字符串时视为有效（除非加 required），非空时必须是书写正确的绝对 URL，即必须包含 scheme（协议部分），常见形式如 scheme://rest。这意味着协议部分是必需的，只输入 example.com 或 www.example.com 会被判定为无效并阻止提交。校验只检查格式，不检查域名是否存在、scheme 是否真实注册，foo://bar 也可能通过。需要更严格限制时可叠加 pattern 或服务端校验。
- 非空值必须是带 scheme 的绝对 URL
- 空值默认有效，required 才强制填写
- 只校验书写格式，不验证地址存在
url 类型的内置约束校验机制
type="url" 属于约束验证体系的一部分。表单提交时，浏览器按 WHATWG URL 标准解析输入值：空字符串被特殊放行，表示用户未填写；非空值必须能解析为一个绝对 URL，即包含 scheme（协议）部分，整体结构接近 scheme://rest-of-url。缺少协议的 example.com 会被解析为相对引用，因此校验失败，浏览器显示内置错误提示并阻止提交。
值得强调的是校验的宽松面：scheme 不要求真实注册，foo://example 这类自定义协议也能通过，因为校验只确认「书写上像绝对 URL」。它不会发起网络请求验证域名是否存在，也不区分 http 与 https。想限制协议范围，需要叠加 pattern 属性，例如要求以 https:// 开头，浏览器会先跑内置 URL 过滤再跑自定义正则，两者都通过才算有效。
官网收集用户主页链接的场景
一个社区站点让用户填写个人主页。产品上希望用户直接粘贴完整链接，于是使用 <input type="url" name="site" required placeholder="https://example.com">。假设大量用户习惯输入 zhangsan.github.io 这类缺少协议的值，因此会被内置校验拦截。决策：保留 required 保证必填，加 pattern="https?://.+" 把协议限制在 http/https，并在 title 中写明「请以 http:// 或 https:// 开头」，错误提示因此可读。
这样处理的原因在于分层：内置校验负责排除 not a url 这类纯文本，自定义 pattern 负责收窄协议范围，required 负责非空约束，三者职责清晰。提交到服务端后，后端再解析 URL、校验域名白名单并做 SSRF 防护，因为前端校验可以被绕过，任何安全判断都不能依赖 type="url" 本身。结果是无效输入在提交前被拦截，合法链接正常入库。
内置校验失效与不够的边界
容易失效的第一种情况是绕过手段：用户可以修改 DOM 把 type 改回 text、给表单加 novalidate，或直接构造 HTTP 请求提交数据，内置校验全部失效。第二种情况是误判：校验不验证可达性，写 https://this-domain-does-not-exist.example 照样通过；也不验证国际化域名的实际含义。第三种是移动端差异，虚拟键盘会给出 URL 布局，但校验规则不变。
对应处理是把前端校验定位为输入体验优化而非安全防线。服务端必须用成熟的 URL 解析库重新校验，检查 scheme 白名单、域名、长度和是否指向内网地址。代价是双端各维护一份规则，可能出现前后端不一致：例如某些浏览器接受的特殊 scheme 后端拒绝。可操作的判断是：前端只管「能不能提交」，后端才管「该不该接受」，两层缺一不可。
容易答错的地方
- 认为不带协议的域名也能通过
type="url"要求绝对 URL，example.com缺少 scheme 会被视为相对引用而校验失败。只有空字符串和书写正确的绝对 URL 能通过，协议部分不可省略。- 认为通过校验代表 URL 真实可用
- 内置校验只做语法层面的格式检查，不发起请求、不查 DNS，
https://不存在的域名也可能通过。需要确认可达性或归属时，必须在服务端做额外验证。
面试官还会怎么问？
想让 url 输入允许不填，但填了必须合法，怎么做？
不加 required 即可：空字符串天然通过校验，非空时仍按绝对 URL 规则检查。若加 required，空值也会被拦截，两者按需组合。
pattern 与内置 url 校验是替代关系吗？
是叠加关系。浏览器先执行内置 URL 过滤，再用 pattern 正则匹配完整值，两者都通过才有效。pattern 无效时会被整体忽略，只剩内置校验。
用户输入缺协议时能否自动补全再校验？
内置校验不会自动补全，会直接判定无效。可在 blur 或提交前用脚本为缺少 :// 的值补上 https://，让修正后的值参与校验，体验更友好。
参考资料
示例用于理解所注明的运行环境与边界；延伸学习可结合原文中的更多案例。