协助在本地主机应用程序上下载文件 [英] Assistance with downloading a file on my localhost application

问题描述

我有一个reactjs网络应用程序。在其中一页上，我希望用户点击一个下载按钮，然后能够下载我在资产文件夹中的pdf文件。我似乎遇到了一些问题，试图做到这一点。这里是我试过的。

作为参考，我尝试了这个问题

答案要做到这一点：

 < a href =path_to_filedownload =proposed_file_name>下载< / a> 
  

因此，对于第一次尝试，我有一个如下所示的按钮：

 < a href =../ assets / resume.pdfdownload =简历>下载< / a> 
  

我在浏览器上收到的错误是失败 - 没有文件。我认为我的路径是错误的，所以我尝试了很多变体，甚至是绝对路径，结果也是一样的。在第二次尝试时，我发现这个其他堆栈溢出 question

这个问题的答案声明了这个答案：

 < a href =file：/// C：\Programs \sort.mw>连结1< / a> 
  

当我尝试用我自己的目录路径实现第二个答案时，我收到一个失败 - 网络错误问题。有什么我失踪的。

很久以前，我可以在线托管文件，但似乎应该很容易做到这一点目录系统中的文件就像图像和样式表一样。我在这里错过了什么吗？帮助将不胜感激。

------编辑-----

文件结构看起来像这样：

  react-site 
  -  node_modules 
  -  package.json 
  -  index.html 
  -  resume.pdf 
  -  README.md 
  -  src 
 | 
 | - 一堆文件
 | - 资产
 | 
 | - 模块
 | 
  -  skill.js *这是我参考下载的地方
  

----- - EDIT＃2 ------

skills.js：

  40 class技能扩展组件{
 41 render（）{
 42 return（
 43< div> 
 44< ReactHighcharts config = {highchartConfig} domProps = {{id：'chartId'}}>< / ReactHighcharts> 
 45< div> 
 46< a href =resume.pdfdownload =Resume> a> 
 47< RaisedButton label =下载继续primary = {true} /> 
 48< / div> 
 49< / div> 
 50） ; 
 51} 
 52} 
 53 
 54出口{技能}; 
  

解决方案

您必须指定相对于您的HTML的文件位置文件，即，

 < a href =src / assets / resume.pdfdownload =Resume> Download< / A> 
  

确保该文件夹在Web服务器上公开可用。您可能还想将其移出 src 文件夹，因为这可能会引起误解。

I have a reactjs web app. On one of the pages, I want a user to click on a download button and then be able to download a pdf file that I have in my assetsfolder. I seem to be having some problems trying to do this. Here is what I've tried.

For reference, I have tried the solution proposed in this question

The answer states to do this:

<a href="path_to_file" download="proposed_file_name">Download</a>

So for my first attempt I have a button that looks like this:

<a href="../assets/resume.pdf" download="Resume">Download</a>

The error I receive on my browser is Failed- No file. I figured that my path was wrong so I've tried many variations even an absolute path and the result is the same. The file cannot be found.

In the second attempt I found this other stack overflow question

This question's answer declares this answer:

<a href="file:///C:\Programs\sort.mw">Link 1</a>

When I try to implement the second answer with my own directory paths, I receive a Failed - Network error problem. Is there something I'm missing.

A long time ago, I was able to host the file online but it seems like it should be an easy thing to do to have the file in your directory system the way images and stylesheets are. Am I missing something here? Help would be appreciated.

------EDIT-----

The file structure looks like this:

react-site
  -- node_modules
  -- package.json
  -- index.html
  -- resume.pdf
  -- README.md
  -- src
     |
     | -- a bunch of files
     | -- assets
     |     
     | -- modules
          |
           - skill.js * This is where I reference the download

------- EDIT #2 ------

skills.js:

40   class Skills extends Component {
 41   render() {
 42     return (
 43       <div>
 44         <ReactHighcharts config={highchartConfig} domProps={{id: 'chartId'}}></ReactHighcharts>
 45         <div>
 46           <a href="resume.pdf" download="Resume">Download</a>
 47           <RaisedButton label="Download Resume" primary={true}/>
 48         </div>
 49       </div>
 50     );
 51   }
 52 }
 53
 54 export { Skills };

解决方案

You have to specify the file location relative to your HTML file, i.e.

<a href="src/assets/resume.pdf" download="Resume">Download</a>

Make sure that this folder is publicly available on the web server. You may also want to move it out of the src folder, as this may be misleading.

这篇关于协助在本地主机应用程序上下载文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！