CODEWITHSUNDEEP
javascriptreactjsreact-reduxhttprequest
Andrew Efurhievwe
Andrew Efurhievwe

Reputation: 101

Issue downloading string as text file

I am trying to download data gotten from a GET request as a .txt file but I keep getting 'undefined' as the content of the downloaded file. I only need the data portion of the response. A sample response is provided below as well as my redux action, reducer and my export function My action:

export const previewLodgements = (id) => (dispatch) => {
  const accessToken = JSON.parse(localStorage.getItem('greenpole_redux_state'));
  dispatch({ type: certificateConstant.PREVIEW_CERTIFICATE_PROGRESS });
  fetch(`${urlConstants.CERTIFICATE_BASE_URL}certificate/lodge/preview/${id}`, {
    method: 'GET',
    headers: {
      Authorization: `Bearer ${accessToken.auth.token}`,
    },
  })
    .then((res) => res.json())
    .then((query) => {
      if (query.status === '00') {
        dispatch({
          payload: query.data,
          type: certificateConstant.PREVIEW_CERTIFICATE_SUCCESS,
          message: 'Preview successful',
        });
      } else {
        dispatch({
          payload: query.data,
          type: certificateConstant.PREVIEW_CERTIFICATE_FAILURE,
          message: query.statusMessage,
        });
      }
    })
    .catch((error) => {
      dispatch({
        payload: null,
        type: certificateConstant.PREVIEW_CERTIFICATE_FAILURE,
        message: 'unable to preview lodgements',
      });
    });
};

my reducer:

import { certificateConstant } from '../../lib/constants/certificateConstants';

const initialState = {
  loading: false,
  previewLodgement: '',
};

const certificateReducer = (state = initialState, action) => {
  switch (action.type) {
        case certificateConstant.PREVIEW_CERTIFICATE_PROGRESS:
      return {
        status: action.status,
        message: action.message,
        loading: true,
      };
    case certificateConstant.PREVIEW_CERTIFICATE_SUCCESS:
      return {
        ...state,
        previewLodgement: action.payload,
        status: action.status,
        message: action.message,
        loading: false,
      };
    case certificateConstant.PREVIEW_LODGEMENT_FAILURE:
      return {
        ...state,
        previewLodgement: action.payload,
        status: action.status,
        message: action.message,
        loading: false,
      };
    default:
      return state;
  }
};

export default certificateReducer;

my download function:

 const previewLodgement = useSelector(
    (state) => state.certificateReducer.previewLodgement,
  );
  const handleExport = () => {
    let id = selectedLodgements[0];
    if (validateCheck()) {
      dispatch(previewLodgements(id));
      var a = document.createElement('a');
      var file = new Blob([previewLodgement], { type: 'text/plain' });
      a.href = URL.createObjectURL(file);
      a.download = 'lodgement.txt';
      document.body.appendChild(a);
      a.click();
    }
  };

response gotten from server after API call:

{
    "status": "00",
    "statusMessage": "",
    "data": "Title: Certificate Lodgement 1\nControl Number: 847834783748738\nDate Lodged: 2020-12-27 00:00:00.0\nStatus: Not Treated\n\nCertificates\n==============\n\nCertificate Number: 1324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Andrew Efurhievwe\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: 2111389645\nOld Holder Arp Account Number: \nIssuing Company: Duff Beer\nchn: 123456789\nclaimed: Yes\n\nCertificate Number: 1324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Andrew Efurhievwe\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: 2111389645\nOld Holder Arp Account Number: \nIssuing Company: Africa Prudential\nchn: \nclaimed: Yes\n\nCertificate Number: 2324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Lisa Simpson\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: Peter\nOld Holder Arp Account Number: \nIssuing Company: Duff Beer\nchn: \nclaimed: Yes\n\n",
    "date": 1609925003880
}

I am trying to download only the string in 'data' as a text file

Upvotes: 3

Views: 152

Answers (1)

Luillyfe
Luillyfe

Reputation: 6862

You are passing query.data to your reducer as a payload, then (on your reducer) your action.payload becomes:

"Title: Certificate Lodgement 1\nControl Number: 847834783748738\nDate Lodged: 2020-12-27 00:00:00.0\nStatus: Not Treated\n\nCertificates\n==============\n\nCertificate Number: 1324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Andrew Efurhievwe\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: 2111389645\nOld Holder Arp Account Number: \nIssuing Company: Duff Beer\nchn: 123456789\nclaimed: Yes\n\nCertificate Number: 1324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Andrew Efurhievwe\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: 2111389645\nOld Holder Arp Account Number: \nIssuing Company: Africa Prudential\nchn: \nclaimed: Yes\n\nCertificate Number: 2324354565656565\nOld Certificate Number: \nVolume Of Bonds: 400\nIssue Date: 2020-09-30 00:00:00.0\nHolder Name: Lisa Simpson\nHolder Address: 12, Springfield\nHolder Email: [email protected]\nHolder Cscs Account Number: 7647637467463746\nOld Holder Cscs Account Number: \nHolder Arp Account Number: Peter\nOld Holder Arp Account Number: \nIssuing Company: Duff Beer\nchn: \nclaimed: Yes\n\n"

there is no action.status property (that is why you are getting undefined) for your action object just one property called payload with an string as a value.

On your reducer try logging action.payload and it will become a lot clear to you.

Upvotes: 2

Related Questions