Flutter网页接收分享意图插件receive_sharing_intent_web的使用

receive_sharing_intent_web

receive_sharing_intent_web 是在网页平台上实现 receive_sharing_intent 的一个插件。

限制

目前仅支持通过 Android Chrome PWA 应用程序接收初始媒体内容（getInitialMedia）。

使用方法

要使用此插件，需要在 pubspec.yaml 文件中添加 receive_sharing_intent_web 和 receive_sharing_intent 作为依赖项。例如：

dependencies:
  receive_sharing_intent: ^1.6.7
  receive_sharing_intent_web: ^0.0.1

网页配置

在 web/manifest.json 文件中添加以下内容：

{
  ...
  "share_target": {
    "action": "/",
    "method": "GET",
    "params": {
      "title": "title",
      "text": "text",
      "url": "url"
    }
  }
}

完整示例代码

以下是完整的示例代码，展示了如何在网页上使用 receive_sharing_intent_web 插件来接收分享内容。

import 'package:flutter/material.dart';
import 'package:receive_sharing_intent/receive_sharing_intent.dart'; // 主插件
import 'package:share_plus/share_plus.dart'; // 用于分享功能

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  static const title = 'Receive Sharing Intent Web Example';

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: title,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: title),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  SharedMediaFile? _media; // 用于存储接收到的共享文件信息

  [@override](/user/override)
  void initState() {
    super.initState();
    // 监听初始共享内容
    ReceiveSharingIntent.getInitialMedia().then(_setMediaText);
    // 监听实时共享流
    ReceiveSharingIntent.getMediaStream().listen(_setMediaText);
  }

  void _setMediaText(List<SharedMediaFile> medias) {
    final media = medias.firstOrNull; // 获取第一个共享文件
    if (!mounted || media == null) return;
    setState(() => _media = media); // 更新 UI
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Container(
        alignment: Alignment.center,
        padding: const EdgeInsets.all(16),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 显示接收到的文本内容
            Text('Text: ${_media?.path}'),
            Text('Type: ${_media?.type.value}'), // 文件类型
            Text('Mime: ${_media?.mimeType}'), // MIME 类型
            const SizedBox(height: 32),

            // 提供输入框用于分享内容
            Form(
              child: TextFormField(
                initialValue: 'https://google.com', // 初始值
                onSaved: (v) => Share.share(v ?? ''), // 分享内容
                decoration: InputDecoration(
                  suffixIcon: Builder(builder: (context) {
                    return IconButton(
                      icon: const Icon(Icons.share), // 分享图标
                      onPressed: () => Form.of(context).save(), // 提交表单
                    );
                  }),
                ),
              ),
            ),
            const SizedBox(height: 16),
          ],
        ),
      ),
    );
  }
}