如何在reactjs应用程序中使用nodejs模块？

Question

我正在尝试使用 React 制作一个 YouTube 视频下载应用程序，并且我找到了一个名为 ytdl-core 的 npm 包来执行此操作，如何在我的 React 应用程序中使用 npm 包？

我使用输入标签创建了我的 React 应用程序来粘贴要下载的视频的 url 并提取输入值，现在我必须将此 url 传递给节点模块

import React, {useState} from 'react'

function Input() {
  const [url, setUrl] = useState("");
  const downloadVideo = () => {
    const downloadURL= url;
  }
  return (
    <div className="p-4">
      <h1 className="text-3xl font-bold mb-4">Youtube Video Downloader</h1>
      <input
        type="text"
        onChange={(e) => setUrl(e.target.value)}
        className="border border-gray-300 rounded px-3 py-2 w-full mb-4"
        placeholder="Enter video URL"
        />
      <button
        onClick={() => downloadVideo()}
        className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600"
      >
        Download
      </button>
    </div>
  
  )
}

export default Input

Answer 1

你不能。您找到的包是一个node.js包，即它在后端运行，而不是在浏览器中运行。你可以这么说，因为：

const fs = require('fs');

即，它使用

fs

（文件系统）包，该包在浏览器中不起作用。

您需要创建一个 Node.js 服务器，让前端 React 应用程序向该服务器发送您要下载的链接，然后使用您在该后端服务器中找到的包。