Как реализовать возможность прикрепления видео с сайта Rutube (база знаний Outline)?

Ссылка скопирована
1 ответ

Всем привет. Сейчас копаюсь в настройках базы знаний от Outline. Встала острая необходимость добавить функцию добавления видео с сайта rutube. Там реализован функционал добавления с YouTube. То есть ты создаешь новый документ, нажимаешь "+" в выпадающем списке выбираешь с какого сервиса добавить видео или другой материал. Так вот я хочу туда добавить возможность прикреплять видео с RuTube. На просторах интернета ничего путного не нашла, возможно задаю неправильный вопрос. Может кто мне подскажет какие-то ресурсы, статьи на эту тему, может статьи по добавлению видео с YouTube, чтоб я по аналогии могла сделать. За ранее огромное спасибо. Я новичок в этом деле. Строго не судите, пожалуйста.

Дополнительно:

Расскажите немного как у вас реализовано добавление видео с YouTube?

  • Загир Меджидов, Это реализовано не мной, а замечательными людьми, которые создали БЗ Outline. Вот фрагмент кода
    "use strict";  function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } require("core-js/modules/es.object.assign.js"); require("core-js/modules/es.weak-map.js"); require("core-js/modules/esnext.weak-map.delete-all.js"); require("core-js/modules/es.object.define-property.js"); require("core-js/modules/es.object.get-own-property-descriptor.js"); require("core-js/modules/es.symbol.js"); require("core-js/modules/es.symbol.description.js"); require("core-js/modules/es.symbol.iterator.js"); Object.defineProperty(exports, "__esModule", {   value: true }); exports.default = void 0; require("core-js/modules/es.array.iterator.js"); require("core-js/modules/es.object.to-string.js"); require("core-js/modules/es.string.iterator.js"); require("core-js/modules/web.dom-collections.iterator.js"); require("core-js/modules/web.url.js"); require("core-js/modules/web.url-search-params.js"); require("core-js/modules/es.regexp.exec.js"); require("core-js/modules/es.string.search.js"); require("core-js/modules/es.string.replace.js"); require("core-js/modules/es.array.concat.js"); var React = _interopRequireWildcard(require("react")); var _Frame = _interopRequireDefault(require("../components/Frame")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function YouTube(props) {   var matches = props.attrs.matches;   var videoId = matches[1];   var start;   try {     var _searchParams$get;     var url = new URL(props.attrs.href);     var searchParams = new URLSearchParams(url.search);     start = (_searchParams$get = searchParams.get("t")) === null || _searchParams$get === void 0 ? void 0 : _searchParams$get.replace(/s$/, "");   } catch (_unused) {     // noop   }   return /*#__PURE__*/React.createElement(_Frame.default, _extends({}, props, {     src: "https://www.youtube.com/embed/".concat(videoId, "?modestbranding=1").concat(start ? "&start=".concat(start) : ""),     title: "YouTube (".concat(videoId, ")")   })); } YouTube.ENABLED = [/(?:https?://)?(?:www.)?youtu.?be(?:.com)?/?.*(?:watch|embed)?(?:.*v=|v/|/)([a-zA-Z0-9_-]{11})([&?](.*))?$/i]; var _default = exports.default = YouTube;

    "use strict"; function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } require("core-js/modules/es.object.assign.js"); require("core-js/modules/es.weak-map.js"); require("core-js/modules/esnext.weak-map.delete-all.js"); require("core-js/modules/es.object.define-property.js"); require("core-js/modules/es.object.get-own-property-descriptor.js"); require("core-js/modules/es.symbol.js"); require("core-js/modules/es.symbol.description.js"); require("core-js/modules/es.symbol.iterator.js"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; require("core-js/modules/es.array.iterator.js"); require("core-js/modules/es.object.to-string.js"); require("core-js/modules/es.string.iterator.js"); require("core-js/modules/web.dom-collections.iterator.js"); require("core-js/modules/web.url.js"); require("core-js/modules/web.url-search-params.js"); require("core-js/modules/es.regexp.exec.js"); require("core-js/modules/es.string.search.js"); require("core-js/modules/es.string.replace.js"); require("core-js/modules/es.array.concat.js"); var React = _interopRequireWildcard(require("react")); var _Frame = _interopRequireDefault(require("../components/Frame")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function YouTube(props) { var matches = props.attrs.matches; var videoId = matches[1]; var start; try { var _searchParams$get; var url = new URL(props.attrs.href); var searchParams = new URLSearchParams(url.search); start = (_searchParams$get = searchParams.get("t")) === null || _searchParams$get === void 0 ? void 0 : _searchParams$get.replace(/s$/, ""); } catch (_unused) { // noop } return /*#__PURE__*/React.createElement(_Frame.default, _extends({}, props, { src: "https://www.youtube.com/embed/".concat(videoId, "?modestbranding=1").concat(start ? "&start=".concat(start) : ""), title: "YouTube (".concat(videoId, ")") })); } YouTube.ENABLED = [/(?:https?://)?(?:www.)?youtu.?be(?:.com)?/?.*(?:watch|embed)?(?:.*v=|v/|/)([a-zA-Z0-9_-]{11})([&?](.*))?$/i]; var _default = exports.default = YouTube;

  • Lion97icvc, Понял, но не фига не понял. Спасибо )
  • Загир Меджидов, Вот и я нифига не понимаю(
  • Нужно решить такую задачу?

    Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

    Заказать помощь
    Лучший ответ
    1
    Игорь Волков Ответ

    Для реализации возможности прикрепления видео с сайта Rutube на вашем сайте, вам необходимо использовать API Rutube для загрузки видео на сервер и отображения его на странице.

    Вот пример кода на PHP, который позволит вам загрузить видео с Rutube на ваш сервер:

    // URL видео на Rutube
    $video_url = 'https://rutube.ru/video/1234567890/';
     
    // Получаем идентификатор видео из URL
    $video_id = substr($video_url, strrpos($video_url, '/') + 1);
     
    // Получаем информацию о видео с помощью API Rutube
    $api_url = 'https://rutube.ru/api/video/' . $video_id . '/?format=json';
    $response = file_get_contents($api_url);
    $video_info = json_decode($response);
     
    // Загружаем видео на сервер
    $video_file = file_get_contents($video_info->video_url);
    file_put_contents('videos/' . $video_id . '.mp4', $video_file);
     
    // Отображаем видео на странице
    echo '<video controls>';
    echo '';
    echo 'Your browser does not support the video tag.';
    echo '</video>';

    // URL видео на Rutube $video_url = 'https://rutube.ru/video/1234567890/'; // Получаем идентификатор видео из URL $video_id = substr($video_url, strrpos($video_url, '/') + 1); // Получаем информацию о видео с помощью API Rutube $api_url = 'https://rutube.ru/api/video/' . $video_id . '/?format=json'; $response = file_get_contents($api_url); $video_info = json_decode($response); // Загружаем видео на сервер $video_file = file_get_contents($video_info-&gt;video_url); file_put_contents('videos/' . $video_id . '.mp4', $video_file); // Отображаем видео на странице echo '<video controls>'; echo ''; echo 'Your browser does not support the video tag.'; echo '</video>';

    Этот код поможет вам загрузить видео с Rutube на ваш сервер и отобразить его на странице. Помните, что использование API Rutube может потребовать регистрации и получения ключа доступа. Не забудьте также обработать ошибки и добавить дополнительные проверки для безопасности вашего сайта.

    Другие ответы (0)

    Пока нет других ответов. Будьте первым, кто поможет автору.

    Ответить на вопрос

    комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *

    Вам также может быть интересно