react backend and frontend download file
const Handler_DownLoadFile = (Id:number,IsEnglish:boolean)=>{
sfParam.Id=Id;
sfParam.IsEnglish=IsEnglish;
setSFParam(sfParam);
console.log(JSON.stringify(sfParam))
ViewFile(sfParam as SafetyRuleParamPO)
.then((res)=>{
if (res.StatusCode == 200 && res.Data){
if(res.Data.FileContent!=undefined){
const blob = UtilFile.ConvertBase64UrlToBlob(res.Data.FileContent);
const url = window.URL.createObjectURL(
new Blob([blob],{type:'application/pdf'})
);
const link = document.createElement('a');
link.href = url;
link.setAttribute(
'download',
"FileName.pdf",
);
// Append to html link element page
document.body.appendChild(link);
// Start download
link.click();
window.URL.revokeObjectURL(url);
}
}else{
alert("error")
}
})
}
export function ConvertBase64UrlToBlob(base64Data):Blob {
const byteCharacters = atob(base64Data);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], {type: 'application/pdf'});
return blob;
}
import Request from '@/api/request';
import ApiResponsePO from "@/model/ResponseDTO/ApiResponseDTO"; import SafetyRuleViewPO from '@/model/PO/SafetyRuleViewPO' const http = new Request(); export const urlViewFile = '/api/SafetyRule/View' export const View = (params: SafetyRuleParamPO): Promise<ApiResponsePO<SafetyRuleViewPO>> => {
return http.get<object, ApiResponsePO<SafetyRuleViewPO>>(urlViewFile,params);
}
recommen a :base64 to blob Code Example (codegrepper.com)
backend
public SafetyRuleViewVO ReadFile(int Id,bool IsEnglish) {
var safetyVO = GetById(Id);
var viewVO = new SafetyRuleViewVO();
if (safetyVO != null) {
string filePath = IsEnglish ? safetyVO.EnglishVersionFileSharePointPath : safetyVO.ChineseVersionFileSharePointPath;
byte[] fileContent = File.ReadAllBytes(filePath);
viewVO = new SafetyRuleViewVO {
FileContent = fileContent
};
}
return viewVO;
}
public class SafetyRuleViewVO {
public byte[] FileContent { get; set; }
}
react backend and frontend download file的更多相关文章
- yii2自带的backend,frontend不够用,添加一个后台模块怎么做?
在复杂项目里,高级模板中的fontend.backend application明显不够,可以再添加另外的application. 例如添加一个seller application .步骤如下: 1, ...
- Csharp:WebClient and WebRequest use http download file
//Csharp:WebClient and WebRequest use http download file //20140318 塗聚文收錄 string filePath = "20 ...
- Pattern: API Gateway / Backend for Front-End
http://microservices.io/patterns/apigateway.html Pattern: API Gateway / Backend for Front-End Contex ...
- 抽取一部分服务端做BFF(Backend For Frontend服务于前端的后端)
Flutter+Serverless端到端研发架构实践 · 语雀 https://www.yuque.com/xytech/flutter/kdk9xc 2019-12-19 13:14 作者:闲鱼技 ...
- [Powershell] FTP Download File
# Config $today = Get-Date -UFormat "%Y%m%d" $LogFilePath = "d:\ftpLog_$today.txt&quo ...
- FTP Download File By Some Order List
@Echo Off REM -- Define File Filter, i.e. files with extension .RBSet FindStrArgs=/E /C:".asp&q ...
- Download file using libcurl in C/C++
http://stackoverflow.com/questions/1636333/download-file-using-libcurl-in-c-c #include <stdio.h&g ...
- httpClient download file(爬虫)
package com.opensource.httpclient.bfs; import java.io.DataOutputStream; import java.io.File; import ...
- Spring boot download file
Springboot对资源的描述提供了相应的接口,其主要实现类有ClassPathResource.FileSystemResource.UrlResource.ByteArrayResource. ...
- Springboot Download file
@RequestMapping(value = "/downloadSvt") public ResponseEntity<FileSystemResource> ex ...
随机推荐
- Windows 11在使用AMD时,CPU占用率持续100%的解决方案
一.现象 Windows 11在使用AMD时,CPU占用率持续100%,持续好几个系统版本都是如此 二.系统版本: 版本 Windows 11 专业工作站版版本 22H2安装日期 2022/10/ ...
- EF和dapper
EF:重量级ORM的代表 优点: 1.不关心sql怎么写, 2.开发速度快,和linq结合,有效提高开发效率 3.code first,代码优先,不用关心数据库结构,代码先行. 4.跨数据库,只需要把 ...
- react native SectionList组件实现多选
如下图所示: 代码如下: import React, { useRef, Component } from 'react'; import { Platform, Text, View, TextIn ...
- Cisco——ASA和winserver2016配置l2tp over ipsec连接
Cisco--ASA和winserver2016配置l2tp over ipsec连接 L2tp over ipsec vpn配置 网络拓扑图: 配置vpn时要确保Winserver15能够ping通 ...
- Ansible 实记
自动化运维工具 Ansible ansible是基于模块工作的,本身没有批量部署的能力.真正具有批量部署的是ansible所运行的模块,ansible只是提供一种框架.主要包括: (1).连接插件co ...
- Linux系统Shell脚本第四章:shell函数
目录 一.shell函数 1.函数的作用 2.函数使用步骤 3.定义函数基本格式 4.函数变量 5.退出函数 6.函数位置变量与脚本位置变量区别 一.shell函数1.函数的作用定义较为复杂的但是需要 ...
- django操作WEB涉及的几个命令
1)创建项目bysms django-admin startproject bysms 2)创建应用sales (在bysms目录下执行) python manage.py startapp sale ...
- Python学习的第二次总结
有限循环 for i in range()# i自动加一 # for语句中若有break被执行,则跟着for后面的else语句就不会被正常执行:反之亦然 for i in range(3) ...
- HIVE 调优思路和实践
1,数据存储调优 1.1 设置压缩: 设置中间数据/输出结果压缩传输,使用snappy格式. hive-site.xml: set hive.exec.compress.output = true # ...
- vue学习之-----组件递归调用
1.关键点 2.父组件 <template> <div> <div class="btn-title"> <el-button @clic ...