Необходимо скачивать файлы из telegram mini app. Я реализован код, но он работает только на компьютере, через приложение мобильное телеграм, почему то, не скачивается документ.
import { useQuery } from '@tanstack/react-query'
import { UserService } from '../../services/user.service'
import { useTelegramWebApp } from '../../hooks/useTelegram'
import { ReportService } from '../../services/report.service'
const Reports = () => {
const userId = useTelegramWebApp()
const { data: currentUser } = useQuery({
queryKey: ['currentUser', userId],
queryFn: () => UserService.getUserById(userId),
enabled: userId != null,
})
const downloadReport = async (isAuth: string) => {
if (!currentUser?.organizationId) return
try {
const response = await ReportService.generatePdfReportByHRForUsers(
currentUser.organizationId,
'test',
isAuth
)
const url = window.URL.createObjectURL(new Blob([response.data]))
const link = document.createElement('a')
link.href = url
link.setAttribute('download', 'report.xlsx')
document.body.appendChild(link)
link.click()
link.remove()
toast.success('Отчет успешно скачан!')
} catch (error) {
toast.error('Ошибка при скачивании отчета.')
console.error('Error downloading report:', error)
}
}
return (
<div className='w-[90%] max-w-2xl mx-auto mt-8 mb-24'>
<div className='grid grid-cols-1 gap-6 mt-6'>
<button
className='p-6 bg-white shadow-lg rounded-lg flex items-center justify-between hover:bg-blue-50 transition w-full text-left'
onClick={() => downloadReport('false')}
>
<div>
<h2 className='text-lg font-semibold'>
Отчет по неавторизованным пользователям
</h2>
</div>
</button>
<button
className='p-6 bg-white shadow-lg rounded-lg flex items-center justify-between hover:bg-blue-50 transition w-full text-left'
onClick={() => downloadReport('true')}
>
<div>
<h2 className='text-lg font-semibold'>
Отчет по авторизованным пользователям
</h2>
</div>
</button>
<button className='p-6 bg-white shadow-lg rounded-lg flex items-center justify-between hover:bg-blue-50 transition w-full text-left'>
<div>
<h2 className='text-lg font-semibold'>Скачать изображение</h2>
</div>
</button>
</div>
</div>
)
}
export default Reports
Простой
