如何使用 Laravel + React 检查上传文件的类型?
Posted
技术标签:
【中文标题】如何使用 Laravel + React 检查上传文件的类型?【英文标题】:How can I check the type of an upload file using Laravel + React? 【发布时间】:2020-12-14 12:12:44 【问题描述】:我正在使用 React + Laravel。对于上传文件,我使用 Maatwebsite 库。我只是在学习,所以这一切都是为了一个“家庭项目”:) 有一个表单,其中包含用于选择文件和按钮的输入:
<form>
<input type="file" name="file" onChange=e => preUploadFile(e) />
<Button onClick=importFileHandler disabled=!file>Upload</Button>
</form>
我把选中的文件保存到状态:
const [file, setFile] = useState(null);
const preUploadFile = e =>
const file = e.target.files[0];
setFile(file);
;
然后我将状态“丢弃”到 fetch 中:
// post for import
export const importFileInDataBase = async file =>
try
const formData = new FormData();
formData.append("file", file);
await fetch(`$url/v2/organizations/import`,
method: "POST",
body: formData
).then(response =>
console.log("result", response);
);
catch (error)
console.log(error);
;
之后,我通过单击按钮调用此函数,也通过单击按钮调用该函数,该函数将通过 get 请求从表中请求数据并将其呈现在页面上。
const importFileHandler = () =>
new Promise((resolve, reject) =>
resolve(importFileInDataBase(file));
).then(() =>
getAllOrganizations();
);
;
我的模型在后端:
class ScheduledInspectionModel extends Model
protected $table = 'scheduled_inspection';
protected $fillable = ['name_smp', 'name_control', "verification_start", "verification_end", 'verification_duration'];
public $timestamps = false;
控制器:
class OrganizationsImportController extends Controller
public function import(Request $request)
// return dd($request->file);
Excel::import(new OrganizationsImport, $request->file);
return response()->json('Success upload');
以及带有导入设置的文件:
class OrganizationsImport implements ToModel
/**
* @param array $row
*
* @return \Illuminate\Database\Eloquent\Model|null
*/
public function model(array $row)
return new ScheduledInspectionModel([
'name_smp' => $row[0],
'name_control' => $row[1],
'verification_start' => $row[2],
'verification_end' => $row[3],
'verification_duration' => $row[4],
]);
请告诉我如何\需要检查导入文件的类型(只需要 .xls 文件)? PS:另一个问题,我想显示一些有关导入成功与否的消息。我在控制器中返回消息response () -> json ('Import completed');
我怎样才能使用它? PSS:也许它会派上用场dd($ response);
:
Illuminate\Http\UploadedFile #282
-test: false
-originalName: "test.xls"
-mimeType: "application/vnd.ms-excel"
-error: 0
#hashName: null
path: "/tmp"
filename: "phpzFcBzS"
basename: "phpzFcBzS"
pathname: "/tmp/phpzFcBzS"
extension: ""
realPath: "/tmp/phpzFcBzS"
aTime: 2020-08-25 14:39:02
mTime: 2020-08-25 14:39:02
cTime: 2020-08-25 14:39:02
inode: 318670
size: 6144
perms: 0100600
owner: 1000
group: 1000
type: "file"
writable: true
readable: true
executable: false
file: true
dir: false
link: false
【问题讨论】:
FWIW:security.stackexchange.com/questions/57856/… 【参考方案1】:您可以只使用文件输入的accept
属性。
<input type="file" name="file" accept=".xls,application/vnd.ms-excel" onChange="..." />
这将只允许您在单击按钮时选择 .xls 文件。
【讨论】:
是的,看起来他的后端已经被覆盖了。如果Excel::import()
能够导入电子表格以外的其他内容,我会感到惊讶。
是的,有道理。我仍然会提到未来访客的危险:)
同意。检查扩展名,检查 mime 类型,尽可能地限制,但永远不要相信。 OWASP 一直是这些主题的好来源:owasp.org/www-community/vulnerabilities/…
@ficuscr - 您的应用发送到服务器的所有内容都是一种信任练习。您无法保证浏览器发送给客户端的任何内容的安全性。客户端上的任何 Jaavscript 代码或其他任何东西都无法改变这一点。这无助于解决潜在的安全问题,而是对用户体验的改进。他的后端被文件的解析方式所覆盖。以上是关于如何使用 Laravel + React 检查上传文件的类型?的主要内容,如果未能解决你的问题,请参考以下文章
Laravel 5.3,检查上传的文件是不是大于upload_max_filesize(可选上传)
Laravel Controller:如何使用函数存储和创建