javascript - 如何在节点后端不使用 multer 将视频上传到 YouTube
问题描述
我想使用 youtube API 上传视频,我正在使用node.js并表示为后端。我使用multer成功地将视频上传到 youtube,但multer所做的是将我的视频作为中间件复制到我的服务器位置。但我不想那样。我想从我的硬盘的原始位置上传一个视频,而不需要任何副本到我的服务器位置。我该怎么做?
这是使用 node.js 和 express 的后端代码
const express = require("express");
const youtube = require("youtube-api");
const uuid = require("uuid").v4;
const cors = require("cors");
const open = require("open");
const multer = require("multer");
const fs = require("fs");
const PORT = 4000;
const credentials = require("./client_secret.json");
const app = express();
app.use(express.json());
app.use(cors());
const storage = multer.diskStorage({
destination: "./",
filename(req, file, callback) {
const newFileName = `${uuid()}-${file.originalname}`;
callback(null, newFileName);
},
});
const uploadVideoFile = multer({
storage: storage,
// single:'recfile',
}).single("VideoFile");
app.post("/upload", uploadVideoFile, (req, res) => {
if (req.file) {
const filename = req.file.filename;
const { title, description } = req.body;
open(
oAuth.generateAuthUrl({
access_type: "offline",
scope: "https://www.googleapis.com/auth/youtube.upload",
state: JSON.stringify({
filename,
title,
description,
}),
})
);
}
});
app.get("/oAuth2CallBack", (req, res) => {
res.redirect("http://google.com");
const fileName = JSON.parse(req.query.state).filename;
const title = JSON.parse(req.query.state).title;
const description = JSON.parse(req.query.state).description;
oAuth.getToken(req.query.code, (err, tokens) => {
if (err) {
console.log(err);
return;
}
oAuth.setCredentials(tokens);
youtube.videos.insert(
{
resource: {
snippet: { title, description },
status: { privacyStatus: "private" },
},
part: "snippet,status",
media: {
body: fs.createReadStream(fileName),
},
},
(err, data) => {
console.log("DONE!");
console.log(data);
console.log(err);
// process.exit();
}
);
});
});
const oAuth = youtube.authenticate({
type: "oauth",
client_id: credentials.web.client_id,
client_secret: credentials.web.client_secret,
redirect_url: credentials.web.redirect_uris[0],
});
app.listen(PORT, (req, res) => {
console.log("app is listening on PORT 4000");
});
这是我使用 react.js 的前端代码:
import React, { useState } from "react";
import axios from "axios";
const YouTubeApiEndpoint = "http://192.168.0.106:4000/upload";
// const YouTubeUploadApi =
const UploadPage = () => {
const [form, setForm] = useState({
title: "",
description: "",
file: null,
});
function handleChange(event) {
// if (event.target.name === "file") {
// console.log(event.target.files);
// }
const inputValue =
event.target.name === "file" ? event.target.files[0] : event.target.value;
setForm({
...form,
[event.target.name]: inputValue,
});
}
function handleSubmit(event) {
event.preventDefault();
console.log({ form });
const videoData = new FormData();
videoData.append("VideoFile", form.file);
videoData.append("title", form.title);
videoData.append("description", form.description);
axios.post(YouTubeApiEndpoint, videoData).then((response) => {
console.log(response.data);
});
}
return (
<div>
<h1>Upload Youtube Video</h1>
<form onSubmit={handleSubmit}>
<div>
<input
onChange={handleChange}
type="text"
name="title"
autoComplete="off"
placeholder="Title"
/>
</div>
<br />
<div>
<textarea
onChange={handleChange}
type="Description"
name="description"
autoComplete="off"
placeholder="Description"
/>
</div>
<br />
<div>
<input
onChange={handleChange}
accept="video/mp4"
type="file"
name="file"
placeholder="Add Video File"
/>
</div>
<br />
<button type="submit">Upload Video</button>
</form>
</div>
);
};
export default UploadPage;
解决方案
推荐阅读
- python - spacy matcher:如果模式匹配,则检测句子的第一个单词
- json - 如何在flutter中从json中获取数据
- python - 在神经网络中获取“神经元边缘神经元”值的有效方法
- html - 如何有选择地应用两个具有重叠元素引用的 CSS 样式块?
- azure-ad-b2c - Azure B2C 自定义策略注册不起作用错误:由于发生内部服务器错误,无法显示该页面
- typescript - React Typescript NPM 包中的外部 CSS
- deep-learning - 为什么使用 one-hot 编码而不是 askii 或 unicode?
- python - 如何并排打印我的 ascii 卡?
- java - 为什么我的方法应该返回 true 以供我理解时返回 false?
- r - 将变量从 Rmd/YAML 标头传递到 before_body .tex