Отправить токен с помощью window.location

У меня есть кнопка в моем приложении 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.info('export success')
            },
        }

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

        });
    }

Есть ли причина, по которой вы не загружаете файл с помощью AJAX?

Nift 03.04.2018 13:56

Ajax не скачивает файл. Он выполняется успешно, но загрузка не выполняется. Пожалуйста, посмотрите мой обновленный код.

EdG 03.04.2018 14:01

Возможный дубликат Добавление заголовка HTTP-запроса к ссылке href

CBroe 04.04.2018 13:47
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
3
3 456
2

Ответы 2

Вы можете попробовать отправить его как параметр запроса:

exportObjectReport(){

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

а затем проверьте его на сервере.

Это очень распространенный шаблон в различных общедоступных API

взято отсюда: stackoverflow.com/questions/35236874/… - вы не можете ничего передать через заголовки во время перенаправления.

silicakes 03.04.2018 14:09

Во-первых, можно использовать JQuery с React, но это не рекомендуется, поскольку это две библиотеки, которые делают одно и то же (манипулируют DOM). Вместо этого используйте библиотеку, созданную специально для выполнения запросов, или используйте запросы XHR.

Ответ на ваш вопрос уже существует здесь: https://stackoverflow.com/a/23797348/2668734

Ответ содержит как решение XHR, так и решение JQuery.

Другие вопросы по теме