import {  View as ViewFile} from '@/api/SafetyRule';
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的更多相关文章

  1. yii2自带的backend,frontend不够用,添加一个后台模块怎么做?

    在复杂项目里,高级模板中的fontend.backend application明显不够,可以再添加另外的application. 例如添加一个seller application .步骤如下: 1, ...

  2. Csharp:WebClient and WebRequest use http download file

    //Csharp:WebClient and WebRequest use http download file //20140318 塗聚文收錄 string filePath = "20 ...

  3. Pattern: API Gateway / Backend for Front-End

    http://microservices.io/patterns/apigateway.html Pattern: API Gateway / Backend for Front-End Contex ...

  4. 抽取一部分服务端做BFF(Backend For Frontend服务于前端的后端)

    Flutter+Serverless端到端研发架构实践 · 语雀 https://www.yuque.com/xytech/flutter/kdk9xc 2019-12-19 13:14 作者:闲鱼技 ...

  5. [Powershell] FTP Download File

    # Config $today = Get-Date -UFormat "%Y%m%d" $LogFilePath = "d:\ftpLog_$today.txt&quo ...

  6. FTP Download File By Some Order List

    @Echo Off REM -- Define File Filter, i.e. files with extension .RBSet FindStrArgs=/E /C:".asp&q ...

  7. Download file using libcurl in C/C++

    http://stackoverflow.com/questions/1636333/download-file-using-libcurl-in-c-c #include <stdio.h&g ...

  8. httpClient download file(爬虫)

    package com.opensource.httpclient.bfs; import java.io.DataOutputStream; import java.io.File; import ...

  9. Spring boot download file

    Springboot对资源的描述提供了相应的接口,其主要实现类有ClassPathResource.FileSystemResource.UrlResource.ByteArrayResource. ...

  10. Springboot Download file

    @RequestMapping(value = "/downloadSvt") public ResponseEntity<FileSystemResource> ex ...

随机推荐

  1. Windows 11在使用AMD时,CPU占用率持续100%的解决方案

    一.现象 Windows 11在使用AMD时,CPU占用率持续100%,持续好几个系统版本都是如此 二.系统版本: 版本 Windows 11 专业工作站版版本 22H2安装日期 ‎2022/‎10/ ...

  2. EF和dapper

    EF:重量级ORM的代表 优点: 1.不关心sql怎么写, 2.开发速度快,和linq结合,有效提高开发效率 3.code first,代码优先,不用关心数据库结构,代码先行. 4.跨数据库,只需要把 ...

  3. react native SectionList组件实现多选

    如下图所示: 代码如下: import React, { useRef, Component } from 'react'; import { Platform, Text, View, TextIn ...

  4. Cisco——ASA和winserver2016配置l2tp over ipsec连接

    Cisco--ASA和winserver2016配置l2tp over ipsec连接 L2tp over ipsec vpn配置 网络拓扑图: 配置vpn时要确保Winserver15能够ping通 ...

  5. Ansible 实记

    自动化运维工具 Ansible ansible是基于模块工作的,本身没有批量部署的能力.真正具有批量部署的是ansible所运行的模块,ansible只是提供一种框架.主要包括: (1).连接插件co ...

  6. Linux系统Shell脚本第四章:shell函数

    目录 一.shell函数 1.函数的作用 2.函数使用步骤 3.定义函数基本格式 4.函数变量 5.退出函数 6.函数位置变量与脚本位置变量区别 一.shell函数1.函数的作用定义较为复杂的但是需要 ...

  7. django操作WEB涉及的几个命令

    1)创建项目bysms django-admin startproject bysms 2)创建应用sales (在bysms目录下执行) python manage.py startapp sale ...

  8. Python学习的第二次总结

    有限循环 for   i   in range()# i自动加一   # for语句中若有break被执行,则跟着for后面的else语句就不会被正常执行:反之亦然 for i in range(3) ...

  9. HIVE 调优思路和实践

    1,数据存储调优 1.1 设置压缩: 设置中间数据/输出结果压缩传输,使用snappy格式. hive-site.xml: set hive.exec.compress.output = true # ...

  10. vue学习之-----组件递归调用

    1.关键点 2.父组件 <template> <div> <div class="btn-title"> <el-button @clic ...