开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >在React应用程序的客户端保存文件

问在React应用程序的客户端保存文件
EN

Stack Overflow用户

提问于 2018-09-03 15:51:17

回答 1查看 1.6K关注 0票数 1

我正在尝试在react应用程序的客户端保存一个文件。数据是从我的名为DownloadDocument的API Controller中获得的。我从我的DownloadDocument方法返回FileSreamResult。FileStreamResult读取数据并将其写入到react API中的响应。network选项卡得到一个响应，但当我记录该响应时，我得到的响应为null。我正在使用文件保护程序来尝试保存该文件。https://www.npmjs.com/package/file-saver。

有没有人对这个问题有什么建议，或者有没有更好的方法？

我在控制器中的操作：

我遇到的问题是，我对react api的响应返回为空。

[HttpGet("{documentId}")]
    [AcceptVerbs("OPTIONS", "GET")]
    [AllowAnonymous]
    public async Task<IActionResult> DownloadDocument(int documentId)
    {
      if (documentId != 0)
      {
        var document = await service.DownloadDocumentAsync(documentId);

        var documentResponse = File(document, "application/octet-stream");             
        return documentResponse;
      }
      return BadRequest("Document id is not valid");
    }

react应用程序。

api.indexes.downloadDocument(clones)
    .then(response=>{
    console.log(response)
    let FileSaver = require('file-saver');
    let blob = new Blob([response], {type: "application/octet-stream"});
    let filename ="testdownload"
    FileSaver.saveAs(blob, filename)

谢谢你的帮助。

EN

回答 1

Stack Overflow用户

发布于 2018-09-04 08:33:45

我需要将这个添加到头文件中。responseType：'blob‘

这篇文章很好地解释了https://medium.com/@fakiolinho/handle-blobs-requests-with-axios-the-right-way-bb905bdb1c04。

票数 0

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/52152964

复制

相关文章

在Linode上部署React应用程序

React是一个用于构建用户界面的流行JavaScript库。虽然React经常被用作更复杂应用程序的前端，但它也足够强大，可以单独用于完整的客户端应用程序。

selinayu

2018/09/21

2.7K0

React Native在美团外卖客户端的实践

打包 json javascript android ios

美团研发团队基于React Native开源框架，并结合美团业务场景，定制化开发了一套动态化方案。本文主要分享该动态化方案在美团外卖业务场景中的实践，希望能给大家一些启发。

美团技术团队

2019/12/23

2.2K0

React Native在美团外卖客户端的实践

在React应用程序中用RegEx测试密码强度

正则表达式 react 编程算法 regex javascript

尽管一些组织认为应该由用户选择健壮的用户名和密码来保护自己，但是开发人员可以通过将规则包含在程序的设计中来帮助进行良好的密码选择。例如，开发人员可以通过加入进度条、百分比或颜色，来帮助用户在输入密码时规定密码的质量。

疯狂的技术宅

2020/02/18

2.7K0

【React】377- 实现 React 中的状态自动保存

https 网络安全 react github git

移动端中，用户访问了一个列表页，上拉浏览列表页的过程中，随着滚动高度逐渐增加，数据也将采用触底分页加载的形式逐步增加，列表页浏览到某个位置，用户看到了感兴趣的项目，点击查看其详情，进入详情页，从详情页退回列表页时，需要停留在离开列表页时的浏览位置上

pingan8787

2019/10/15

2.9K0

【React】377- 实现 React 中的状态自动保存

关于React中状态保存的研究

在使用react搭配react-router做应用的时候，你可能遇到这样的问题，当我从第一个页面过渡到第二个页面，然后返回之后，发现之前的页面的状态全部不见了，即回到了初始的状态。这点在页面存在多个TAB页或者多条件筛选的时候体验会更加明显，这时候我又不得不点击我之前选择的页签，重新选择筛选条件，然后再进行搜索。因此，在这种情况下，保存之前的状态显得尤为亟待解决，下面是自己实践出来的几种方法，做一下分享，同时希望和各位一起探讨，看能不能有什么更好的办法。代码：github 解决方案一：子路由方式 //

糊糊糊糊糊了

2018/05/09

4.3K0

关于React中状态保存的研究

layui的文件上传跟文件保存

{tabs-pane label="layui前段写法"} 选取的文件进行预加载并展示，根据表单提交后进行数据文件保存操作，图片文件存在当前项目的目录下

await

2021/11/17

2.4K0

[翻译]Android教程-保存数据-保存文件

http://developer.android.com/training/basics/data-storage/files.html

LeoXu

2018/08/15

2.7K0

在SQL Server中保存和输出任意类型的文件

编程算法 c#actionscript

我们可以把任意类型的文件保存到SQL Server中，在进行例子之前，先建立测试用表格，TestFile.sql：

Java架构师必看

2021/03/22

9350

使用Flash Cookie技术在客户端永久保存HTTP Cookie「建议收藏」

flash http https 网络安全编程算法

大家好，又见面了，我是你们的朋友全栈君。前言：　　在我负责的一个项目中，为了实现一个特殊的需求，要求在客户端的Cookie中长久保存一份数据，但是我们知道在客户端Cookie里保存数据是不稳定的，因为用户可能随时会清除掉浏览器的Cookie，在这种情况下，一般的解决方案是重新向服务器端发送一个请求，以获得一个新的HTTP Cookie数据，并将其保存－－就一般的交互需求而言，这是没有问题的。但是，倘若我的需求是：要求恢复到原来的Cookie里保存数据呢？呵呵，这种情况，倘若服务器端没有做特殊的处理的话，显然是很难实现的。在尝试了许多方法之后，我们最后选择使用FlashCookie技术来做。

全栈程序员站长

2022/09/06

2.2K0

文件保存搜索技巧

文件存储 windows word 备份搜索

最好是大项目-小标题-日期-版本例如潘鑫博客-网站备份-20160301-1.0.rar 还有下载的文件，许多命名更是和乱码一样，规范命名，只是暂时麻烦点，但以后找起来方便不止一倍

P轴

2022/11/18

1.3K0

Flash Cookie【使用Flash Cookie技术在客户端永久保存HTTP Cookie 】（一）

http https javascript actionscript 存储

前言：　　在我负责的一个项目中，为了实现一个特殊的需求，要求在客户端的Cookie中长久保存一份数据，但是我们知道在客户端Cookie里保存数据是不稳定的，因为用户可能随时会清除掉浏览器的Cookie，在这种情况下，一般的解决方案是重新向服务器端发送一个请求，以获得一个新的HTTP Cookie数据，并将其保存－－就一般的交互需求而言，这是没有问题的。但是，倘若我的需求是：要求恢复到原来的Cookie里保存数据呢？呵呵，这种情况，倘若服务器端没有做特殊的处理的话，显然是很难实现的。在尝试了许多方法之后，我们最后选择使用FlashCookie技术来做。

全栈程序员站长

2022/09/14

3.2K0

Jmeter保存下载的文件

Jmeter下载文件测试，如果是常见的文本、图片，可以直接用保存响应到文件组件保存下载的文件如果是其他类型文件，二进制流数据，jmeter本身并未提供组件，需要手写代码完成在文件下载的HTTP请求上添加：后置处理器--BeanShell后置处理器，写入以下代码： import java.io; byte[] result = prev.getResponseData(); //获取请求的响应内容 String path= "d:/liuke.xlsx"; //文件保存路径，使用‘/’或者‘//’ F

流柯

2020/08/02

1.3K0

QT应用编程: 应用程序的配置保存与恢复

qt 编程算法

应用程序运行时，用户经常会对程序做一些个性化设置; 关闭程序之后，下次打开还原上次的设置。程序里可以将这些设置保存到本地文件了存放，下次打开程序时，再加载进来即可。

DS小龙哥

2022/01/07

1K0

Python保存json_python保存json文件

json https 网络安全存储 html

json文件是一种常见的数据存储文件，比txt看着高级点，比xml看着人性化一点。

全栈程序员站长

2022/11/04

2.9K0

urql实现GraphQL的react客户端

通过createClient创建一个客户端，url指定服务端地址，fetchOptions提供一个函数，返回要添加到请求中的参数信息，比如token 利用react的上下文来传递客户端给子组件，则接下来在Todos组件中可以直接使用query而不需要再次创建客户端

歪歪梯

2020/06/19

1.8K0

Android将应用程序的崩溃信息如何保存到本地文件，并上传至服务器

导语：最近实在是太忙了，没有怎么更新公众号，也没有怎么认真去写一些内容，在这里先给关注我的朋友说一声抱歉，可能在接下来的一段时间，还是很忙，但是我会争取抽空多分享一下技术文章，给大家看，共同进步，也希望有能力的人可以一起出来分享。我们在做应用开发的时候，需要程序的崩溃信息，来进行bug的修复和版本的更新，每一个应用程序都会有bug，所以都需要在后台纪录这些bug日志，然后上传到服务器，让程序员看，并进行修复。现在也有很多第三方的jar包能实现这种功能，比如友盟统计等，但是终究不如自己写的方便。好了，废话不

非著名程序员

2018/02/02

2K0

python保存文件的几种方法

python java https 网络安全

import pickle pickle.dump(data,open(‘file_path’,’wb’)) #后缀.pkl可加可不加若文件过大 pickle.dump(data,open(‘file_path’, ‘wb’),protocol=4) 读取该文件： data= pickle.load(open(‘file_path’,’rb’))

全栈程序员站长

2022/06/29

1.5K0

QT新建文件、打开文件、保存文件

一、首页布局界面，如图所示的界面及对象名称：二、在头部文件中添加槽： private slots: void calcSlot(); //新建文件 void createNewFile(); //打开文件 void openFileSlot(); //保存文件三、实现槽函数： //新建文件 void MainWindow::createNewFile(){ //如果当前文档的内容已经改变了 if(ui->textAreaInput

Sindsun

2018/07/06

4.8K0

【专业技术】Android数据保存之文件保存

前言：上一篇文章写了在Android中利用SharedPreferences保存数据，SharedPreferences在保存数据的时候主要是保存一些应用程序的设置信息或者少量的用户信息，并且是以key-value形式保存的String类的信息，比较有局限性。比如你需要保存从网络获取的图片到本地作为缓存数据，并且数量比较大，SharedPreferences就不能满足你的需求了，这个时候就要用到基本上所有平台都会用到的文件保存。 Android中以文件形式把数据保存到磁盘上与其他平台基本上都是类似的，本篇

程序员互动联盟

2018/03/13

2.2K0

VSCode自动保存文件设置

很多时候敲了一大堆代码，结果手贱或者电脑没电或者电脑突然崩溃，如果没有保存，只能说GG。好在VSCode有自动保存代码的功能，而且有好几种自动保存的模式选择，设置方法如下：

marsggbo

2019/08/14

3.6K0

相似问题

仅在客户端加载和保存JSON文件react

12

在远程客户端上保存文件

10

在react js中下载/保存文件

226

在客户端创建和保存文件

12

使用react Native保存文件

12

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例