在 Flutter Web 中嵌入 Youtube 视频

Question

是否可以在 Flutter 网页中嵌入 Youtube 视频？我尝试了以下代码在我的 Flutter 网站中嵌入了一个 Youtube，但页面上没有显示任何错误消息。

import 'package:flutter_html_view/flutter_html_view.dart';

Container(child: HtmlView(data: """
          <iframe src="https://www.youtube.com/embed/xMzkWfIR9Pk" width="560" height="315"></iframe>
          """)),

还尝试了此处推荐的解决方案（Flutter Web 中的 WebView），但这也不起作用。

import 'dart:ui' as ui

//ignore: undefined_prefixed_name
  ui.platformViewRegistry.registerViewFactory(
      'hello-world-html',
      (int viewId) => html.IFrameElement()
        ..width = '640'
        ..height = '360'
        ..src = 'https://www.youtube.com/embed/IyFZznAk69U'
        ..style.border = 'none');

Answer 1

你应该这样走

  import 'dart:html' as html;
  import 'dart:js' as js;
  import 'dart:ui' as ui;

  String viewID = "your-view-id";

  @override
  Widget build(BuildContext context) {
    // ignore: undefined_prefixed_name
    ui.platformViewRegistry.registerViewFactory(
        viewID,
            (int id) => html.IFrameElement()
          ..width = MediaQuery.of(context).size.width.toString()
          ..height = MediaQuery.of(context).size.height.toString()
          ..src = 'https://www.youtube.com/embed/IyFZznAk69U'
          ..style.border = 'none');

    return SizedBox(
      height: 500,
      child: HtmlElementView(
        viewType: viewID,
      ),
    );
  }