Блог

Поэтому я пытаюсь добавить YouTube Oauth на свой веб-сайт. Я использую next.js для моего переднего конца и экспресс для заднего конца.

задняя часть:

 const express = require("express");
const app = express();
const cors = require("cors");
const passport = require("passport");
const passportSetup = require("./passport-setup");

app.use(
    cors({
        origin: ["http://localhost:3000"],
    })
);

app.get(
    "/login/youtube",
    passport.authenticate("google", {
        scope: ["profile", "https://www.googleapis.com/auth/youtube.readonly"],
        accessType: "offline",
    }),
    (req, res) => {
        res.status(200);
    }
);

app.listen(4000, () => console.log("listening on port 4000"));
 

passport-setup.js:

 const passport = require("passport");
const YoutubeStrategy = require("passport-youtube-v3").Strategy;
require("dotenv").config();

passport.use(
    new YoutubeStrategy(
        {
            callbackURL: "http://localhost:3000/success",
            scope: ["https://www.googleapis.com/auth/youtube.readonly"],
            authorizationParams: {
                access_type: "offline",
            },
            clientID: process.env.YOUTUBE_CLIENT_ID,
            clientSecret: process.env.YOUTUBE_CLIENT_SECRET,
        },
        () => {}
    )
);
 

внешний интерфейс:

 const Login = () => {
    const makeOauthRequest = async () => {
        await fetch("http://localhost:4000/login/youtube");
    };
    return (
        <>
            <div>
                <button>Instagram</button>
                <button>Facebook</button>
                <button>Twitter</button>
                <button>Spotify</button>
                <button onClick={makeOauthRequest}>YouTube</button>
            </div>
        </>
    );
};

export default Login;
 

Каждый учебник, который я смотрел, делает это без интерфейсной библиотеки, такой как us react, вместо этого они используют либо необработанный html, либо ejs. Поэтому пути, которые они создают с экспресс передний конец URL-адреса маршрутов, которые видит пользователь на веб-сайте, поэтому я подумал, что, когда они выходят на маршрут они в основном делают запрос GET, поэтому я попытался сделать это с выборки функции, но когда я нажимаю на YouTube-кнопка всплывает эта ошибка Error: Unknown authentication strategy "google" , поэтому я изменил метод от Google в YouTube, и теперь эта ошибка всплывает

Thank You!