今天写一个php的表单提交接口,除了基本的字符串数据,还带文件上传,不用说前端form标签内应该有这些属性

<form  enctype="multipart/form-data" action="http://s6tr4y.natappfree.cc/basic/web/index.php?r=dao/upload"  target="frame1" method="post">

enctype:上面该属性值使得此表单可以上传文件;

action:地址指向后台DaoController.php类中的actionUpload()方法,方法体稍后贴出;

target:指向一个name值为frame1的空iframe标签,用来处理表单提交之后页面跳转的问题;

method:form表单提交数据的方式。

move_uploaded_file($_FILES["file"]["tmp_name"],"uploads/".$_FILES["file"]["name"]);

如上就是方法体内将文件转存到uploads目录下的代码,只有一行,但是注意了!!!

事实上,如果后台不作任何处理,这样在使用Yii2框架提交表单数据(包括文件)到controller,是会报400错误的(Bad Request (#400)---Unable to verify your data submission)。

然而如果将如上代码写到一个php文件内,例如:uploads.php文件

<?php
/**
* Created by PhpStorm.
* User: Administrator
* Date: 2018/4/9
* Time: 15:39
*/
move_uploaded_file($_FILES["file"]["tmp_name"], "upload/" . $_FILES["file"]["name"]);
echo $_FILES["file"]["name"];

然后form表单action到这个php文件(一个单纯的php文件,不依赖Yii2),是可以实现文件上传到uploads目录的,其实我刚开始也是这么做的,

但是在接收表单其他字符串数据的时候出现了这样那样的错误,例如我用\Yii::$app->request->post("id"),报错Yii类没有发现,但是我在controller

的方法里面直接这么写是不会报错的,哎,没办法,最后放弃这种方法(因为不是单纯的上传文件,还要获取文件的路径添加到数据库)

于是,选择采用r=dao/upload的方式来处理文件上传和表单数据获取,但是,这种方法可以获得数据,但在文件转存时会报错之前也提到了。

几经波折,找到了问题的所在:Yii2针对post提交的防csrf问题,没有csrftoken是提交不成功的。具体参考这篇博客:Yii2的csrf验证

该篇博客提到,方法有两种,这里我们选择粗暴一点的,直接禁用csrf验证。

<?php
namespace app\controllers;
use yii\web\Controller;
//解决ajax跨域问题设置的header
header('Access-Control-Allow-Origin:*');
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept"); class DaoController extends Controller{
//禁用Yii2的csrf验证
public $enableCsrfValidation = false;
//表单上传
public function actionUpload(){
//表单文件上传转存到uploads目录下
move_uploaded_file($_FILES["file"]["tmp_name"],"uploads/".$_FILES["file"]["name"]);
echo $_FILES["file"]["name"];
//随机数生成ID
$id = rand(,time());
//从表单拿数据
$name =\Yii::$app->request->post('name');
$tel =\Yii::$app->request->post('tel');
//拼接文件路径
$url ='http://s6tr4y.natappfree.cc/basic/web/uploads/'.$_FILES["file"]["name"];
//开启数据库连接
$conn = \Yii::$app->db;
//向数据库插入一条数据
$conn->createCommand()->insert('showshow', [
'id' => $id,
'name' => $name,
'tel'=> $tel,
'url'=> $url,
'number'=> '',
])->execute();
}
}

如此,便可以实现表单数据提交以及文件上传了,并且在后台实现将表单数据以及文件的存储路径作为一条记录存到数据库中了。

为了防止有人会觉得看的没头没脑的,这里贴上前端的form表单,至于数据库连接的配置我就不多说了,具体可参照博客:Yii2数据接口

<form class="T"  id="myForm" enctype="multipart/form-data" action="http://s6tr4y.natappfree.cc/basic/web/index.php?
r=dao/upload" target="frame1" method="post">
<div class="signForm">
<label>姓名:</label>
<input placeholder="请输入您的真实姓名" name="name" id="name"/>
</div>
<div class="signForm">
<label>手机:</label>
<input placeholder="请输入您的手机号" name="tel" id="tel"/>
</div>
<div class="signForm">
<label>产品:</label>
<input placeholder="请输入您购买的产品" name="pro" id="pro"/>
</div>
<input type="file" name="file" id="file"><br>
<input type="submit" name="submit" value="提交" id="btn" class="btn">
</form>
<iframe name="frame1" frameborder="" height=""></iframe>

Yii2表单提交(带文件上传)的更多相关文章

  1. jquery mobile 表单提交 图片/文件 上传

    jquerymobile 下面 form 表单提交 和普通html没区别,最主要是 <form 要加一个 data-ajax='false' 否则 上传会失败 1  html代码 <!do ...

  2. node07---post请求、表单提交、文件上传

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. ajax方式提交带文件上传的表单,上传后不跳转

    ajax方式提交带文件上传的表单 一般的表单都是通过ajax方式提交,所以碰到带文件上传的表单就比较麻烦.基本原理就是在页面增加一个隐藏iframe,然后通过ajax提交除文件之外的表单数据,在表单数 ...

  4. 【ASP.NET Web API教程】5.3 发送HTML表单数据:文件上传与多部分MIME

    原文:[ASP.NET Web API教程]5.3 发送HTML表单数据:文件上传与多部分MIME 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面 ...

  5. JavaScript实现form表单的多文件上传

    form表单的多文件上传,具体内容如下 formData对象可以使用一系列的键值对来模拟一个完整的表单,然后使用Ajax来发送这个表单 使用<form>表单初始化FormData对象的方式 ...

  6. [Nginx 2] form表单提交,图片上传

    导读:昨晚恶补了一些Nginx服务器的东西,从整体上对Nginx有一个初步的了解.上午去找师哥问了问目前项目中的使用情况,然后就开始上传图片了.这里就简单总结整理一下今天的成果,以后接着提升.简单粗暴 ...

  7. 基于hi-nginx的web开发(python篇)——表单处理和文件上传

    hi-nginx会自动处理表单,所以,在hi.py框架里,要做的就是直接使用这些数据. 表单数据一般用GET和POST方法提交.hi-nginx会把这些数据解析出来,放在form成员变量里.对pyth ...

  8. (27) java web的struts2框架的使用-基于表单的多文件上传

    和单个文件上传配置都是一样的,只是在action中接受参数时候,接受的是数组,不再是单个的文件. 一,action的实现: public class MutableFilesUpload extend ...

  9. 学习SpringMVC必知必会(7)~springmvc的数据校验、表单标签、文件上传和下载

    输入校验是 Web 开发任务之一,在 SpringMVC 中有两种方式可以实现,分别是使用 Spring 自带的验证 框架和使用 JSR 303 实现, 也称之为 spring-validator 和 ...

  10. (转)WebApi发送HTML表单数据:文件上传与多部分MIME

    5.3 Sending HTML Form Data5.3 发送HTML表单数据(2) 本文引自:http://www.cnblogs.com/r01cn/archive/2012/12/20/282 ...

随机推荐

  1. C#中的泛型化方法的实现

    在一个基本数据类型的方法中求解最大值或者最小值是一件很方便,同时也是很简单的事.但是如果你想复用这个方法,我们就需要使用到泛型编程的概念了.这就好比是C++中的模板函数,或者java中的泛型操作.相比 ...

  2. Linux多线程实践(3) --线程属性

    初始化/销毁线程属性 int pthread_attr_init(pthread_attr_t *attr); int pthread_attr_destroy(pthread_attr_t *att ...

  3. ECMAScript中所有的函数的参数都是按值传递的

    看下面一段代码 function setName(obj){ obj.name='Nicholas'; obj=new Object(); obj.name="Greg"; } v ...

  4. Android通过编译源代码提供系统服务-android学习之旅(85)

    通过编译android4.1.2的源代码,添加一个FregServer的系统服务,以及一个服务代理FregClient 具体分为三部分,client,common,server,common中规定了c ...

  5. android数据保存之greendao

    有时我们的数据属于保存到数据库,对于Android应用和IOS应用,我们一般都会使用SQLite这个嵌入式的数据库作为我们保存数据的工具.由于我们直接操作数据库比较麻烦,而且管理起来也非常的麻烦,以前 ...

  6. Obj-C中内存的管理一瞥

    注意,ARC仅仅(自动)释放你手工管理的Objective-C类实例的内存, 但是不会释放由C函数或者Core Foundation(Cocoa的底层,C语言的变体)申请的内存.

  7. AngularJS进阶(十)AngularJS改变元素显示状态

    AngularJS改变元素显示状态 前言 本文描述使用AngularJS提供的ng-show和ng-hide指令实现自动监听某布尔型变量来改变元素显示状态. 控制html元素显示和隐藏有n种方法:ht ...

  8. 【面试笔试算法】Program 2:Amusing Digits(网易游戏笔试题)

    时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 网易成立于1997年6月,是中国领先的互联网技术公司.其相继推出了门户网站.在线游戏.电子邮箱.在线教育.电子商务等多种服 ...

  9. Gradle 1.12用户指南翻译——第二十四章. Groovy 插件

    其他章节的翻译请参见: http://blog.csdn.net/column/details/gradle-translation.html 翻译项目请关注Github上的地址: https://g ...

  10. Xcode出现may cause a leak非忽略的解决方法

    前面提到可以把may cause a leak当成安静的美代码忽略掉,但其实还是有另一种方法滴. 你可以用如下代码替换以消除該警告: [xxx performSelector:_cmd withObj ...