如何通过Web3Forms实现HTML表单附件发送？附件显示为纯文本无法打开

你的表单存在两个关键问题，导致附件以纯文本形式发送无法正常打开：

1. 缺少文件上传必需的表单编码类型属性
2. 文件输入字段的名称不符合Web3Forms的处理要求

修改后的完整代码 #

<form action="https://api.web3forms.com/submit" method="post" enctype="multipart/form-data">
    <input type="hidden" name="access_key" value="261987ac-8575-439e-8b44-14d9896905b8">
    <div class="form-group">
        <label for="firstName">Name <span>(required)</span></label>
        <div class="name-inputs">
            <input type="text" id="firstName" name="firstName" placeholder="First Name" required>
            <input type="text" id="lastName" name="lastName" placeholder="Last Name" required>
        </div>
    </div>
    <div class="form-group">
        <label for="email">Email <span>(required)</span></label>
        <input type="email" id="email" name="email" placeholder="Email" required>
    </div>
    <div class="form-group">
        <label for="subject">Something about yourself<span>(required)</span></label>
        <input type="text" id="Description" name="Description" placeholder="Description" required>
    </div>
    <div class="form-group">
        <label for="file">Upload your CV <span>(required)</span></label>
        <input type="file" id="myFile" name="file" required>
    </div>
    <button type="submit">Send</button>
</form>

关键修改说明 #

• 给<form>标签添加enctype="multipart/form-data"：该属性指定浏览器以二进制编码格式提交表单数据，是文件上传的必要条件，缺失时文件会被当作普通纯文本处理。
• 将文件输入的name属性从filename改为file：Web3Forms的API仅识别名称为file的文件字段，否则无法正确解析附件。
• 给文件输入补充required属性：匹配标签标注的必填要求，确保用户必须上传文件才能提交表单。

内容的提问来源于stack exchange，提问作者lulryeheej