Question

我的reactjs应用程序中有一个按钮，单击该按钮时应下载文件。我需要发送一个带有请求的令牌，让用户下载文件。我该如何发送令牌呢？如果它是一个ajax，我会在标题中发送令牌。

这是我的代码

<div className="btn btn-default obj-export-btn" onClick={this.exportObjectReport.bind(this)}><span className="fa fa-download"></span></div>


exportObjectReport(){

        window.location = url + "get_labels/";
    }

exportObjectReport是下载文件。

我尝试使用ajax。但文件无法下载。 Ajax获得成功但没有下载。

exportObjectReport(){
       // window.location = this.props.video_file_selected.file_url + "get_labels/";

        var that = this;
        var existing_face_array = [];
        var settings = {
            "async": true,
            "crossDomain": true,
            "url": url + "get_labels/",
            "method": "GET",
            "headers": {
                Authorization: "Token " + that.props.token_Reducer.token
            },
            success: function (response, textStatus, jQxhr) {
                console.log('export success')
            },
        }

        $.ajax(settings).done((response) => {

        });
    }

Answer 1

您可以尝试将其作为查询参数发送：

exportObjectReport(){

        window.location = url + "get_labels/" + "?token=YOUR_TOKEN";
    }

然后在服务器上验证它。

这是各种公共API的一种非常常见的模式

Answer 2

首先，可以将JQuery与React一起使用，但不推荐使用，因为它是两个库做同样的事情（操纵DOM）。而是使用专门用于发出请求或使用XHR请求的库。

您的问题的答案已存在于此处：https://stackoverflow.com/a/23797348/2668734

答案包含XHR解决方案和JQuery解决方案

使用window.location发送令牌

2 个答案: