无法加载资源：在我代理域名后，服务器在 Hostinger 中响应状态为 404 () 错误

Question

这是托管商的目录，我在 public*html 中上传了我的代码，我上传了构建文件夹的文件，并且我还为 public_*html 中的后端创建了另一个目录，即在这个文件夹中的后端我上传了后端文件。

当我点击获取书籍按钮时，它应该从后端获取 pdf，但我收到 404 错误。

import React, { useState } from 'react';
import logo from '../assets/images/book.png';
import { Link } from 'react-router-dom';

const ClassCard = (props) => {
  const { url, bookname, classNameForPdf } = props;
  const [pdfUrl, setPdfUrl] = useState('');

  const encodedClassName = encodeURIComponent(classNameForPdf);
  const encodedSubjectName = encodeURIComponent(bookname);

  const fetchPdfUrl = async () => {
    try {
        // https://oneducateeducation.com/
        const response = await fetch(`https://oneducateeducation.com/backend/api/pdfUrl?className=${encodedClassName}&subjectName=${encodedSubjectName}`);
        // const response = await fetch(`http://localhost:5000/api/pdfUrl?className=${encodedClassName}&subjectName=${encodedSubjectName}`);
    //   console.log(response)
      if (response.ok) {
        const pdfUrl = response.url;
        window.open(pdfUrl, '_blank');
      } else {
        console.error('Error fetching PDF URL:', response.status);
      }
    } catch (error) {
      console.error('Error fetching PDF URL:', error);
    }
  };

  return (
    <>
      <div className="card mx-auto">
        <div className="container before:content-[''] after:content-[''] shadow-xl shadow-gray-400 rounded-md w-[210px] px-4 py-4 relative flex flex-col items-center">
          <div className='img'>
            <img src={logo} className='h-52 w-full' alt="" />
          </div>
          <p className='uppercase text-[11px] font-medium mt-2 w-full h-8 text-center'>{bookname}</p>

          <Link to={`/videos/${url}`} className='w-full px-2 py-2 my-2 rounded-3xl text-xs round-md text-white bg-blue-900 hover:bg-white hover:shadow-md hover:shadow-blue-900 hover:text-[13px] hover:transition-all hover:duration-200 hover:outline-none hover:ease-linear text-center hover:text-blue-900 hover:font-bold hover:bg-gradient-to-r to-blue-100 from-yellow-200'>
            View by Chapter/Video
          </Link>
          {
            pdfUrl ? (
              <Link to={`/books/pdf/${encodedClassName}/${encodedSubjectName}`} target='_blank' className=' text-center w-full px-5 py-2 rounded-3xl text-sm round-md text-white bg-blue-900 hover:bg-white hover:shadow-md hover:shadow-blue-900 hover:text-[14px] hover:transition-all hover:duration-200 hover:outline-none hover:ease-linear hover:text-blue-900 hover:font-bold hover:bg-gradient-to-r from-blue-100 to-yellow-200'>Read E-Book</Link>) :
              <button className='text-center w-full px-5 py-2 rounded-3xl text-sm round-md text-white bg-blue-900 hover:bg-white hover:shadow-md hover:shadow-blue-900 hover:text-[14px] hover:transition-all hover:duration-200 hover:outline-none hover:ease-linear hover:text-blue-900 hover:font-bold hover:bg-gradient-to-r from-blue-100 to-yellow-200' onClick={fetchPdfUrl}>Fetch PDF</button>}
        </div>
      </div>
    </>
  );
}

export default ClassCard;

服务器.js

const express = require('express');
const app = express();
const port = process.env.PORT || 5000;
const cors = require('cors');

app.use('/pdfs', express.static(__dirname + '/pdfs'));
app.use(cors());

app.get('/', (req, res) => {
  res.send("Hello");
});

app.get('/backend/api/pdfUrl', (req, res) => {
  const { className, subjectName } = req.query;
  const encodedSubjectName = encodeURIComponent(subjectName);
  const pdfFileName = `${encodedSubjectName}_${className}.pdf`;
  const pdfPath = `${__dirname}/pdfs/${className}/${pdfFileName}`;

  res.setHeader('Content-Type', 'application/pdf');

  res.setHeader('Content-Disposition', `inline; filename=${pdfFileName}`);

  res.sendFile(pdfPath);
});

app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});

我试图找到为什么我的 pdf 无法获取的答案，即使我已将本地主机更改为域名。

Answer 1

我想知道您正在使用哪种托管计划