是否有可能 - 在 Flutter Web 应用程序中插入 google AdSense?

ale*_*607 4 adsense flutter flutter-web

我尝试在我的网站上插入下一个代码 (Google AdSense),但现在没有成功。代码是:

            <script type="text/javascript">var nend_params={"media":00000,"site":000000,"spot":000000,"type":1,"oriented":1};0</script>
            <script type="text/javascript" src="https://js1.nend.net/js/nendAdLoader.js"></script>
Run Code Online (Sandbox Code Playgroud)

1.有一段时间我尝试了一个带有类似句子的“dart:js”

    js.context.callMethod(..
Run Code Online (Sandbox Code Playgroud)

但是,认为它不起作用,因为我们需要展示广告,而不仅仅是执行 javascript 代码..

2.next,我想它可以是一个WebView(一个webview,在webapp..)并尝试使用next:

依赖项:webview_flutter: ^0.3.14 但它与

“错误:PlatformException(未注册的工厂,没有为视图类型'plugins.flutter.io/webview'注册工厂”...

可能有人有积极的经验或可以给我任何建议。

Abh*_*ran 5

如果您只需要在您的网页中使用这些脚本,您可以尝试将其web/Index.html直接包含在页面中。

否则,您将不得不使用ui.platformViewRegistry.registerViewFactory此处所示的PlatFormView 示例。以下代码将向您的页面添加脚本元素。

import 'package:flutter/material.dart';
import 'dart:ui' as ui;
import 'dart:html';

class MyHomePage extends StatelessWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  Widget build(BuildContext context) {
    ui.platformViewRegistry.registerViewFactory("add_script", (int viewId) {
      ScriptElement element = ScriptElement()
        ..src = "https://js1.nend.net/js/nendAdLoader.js"
        ..type = "text/javascript";
      return element;
    });
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Directionality(
            textDirection: TextDirection.ltr,
            child: SizedBox(
              width: 640,
              height: 360,
              child: HtmlElementView(viewType: 'add_script'),
            ),
          ),
        ],
      ),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

注意:此代码需要一个托管小部件,例如 MaterialApp 内的脚手架或类似的东西。对于脚本中的代码,尝试使用不同的视图类型字符串创建一个类似的小部件,并使用setInnerHtml或 类似的方法。

但是你应该知道这个元素是作为 shadow dom 元素添加到你的页面中的。本期就此展开讨论。

在此处输入图片说明

  • @alex89607 目前只有 IDE 会抱怨 `dart:html`,但当您使用 flutter master 通道时,编译器会正常工作。请检查 [此 wiki](https://github.com/flutter/flutter/wiki/Upgrading-from-package:flutter_web-to-the-Flutter-SDK) 将现有的基于 flutter_web 的项目迁移到新的基于 flutter 的 Web 项目。 (2认同)