tiktok_sdk_login_share 1.0.2

A Flutter plugin that lets developers access TikTok's native SDKs in Flutter apps with Dart

example/lib/main.dart

import 'dart:io';
import 'dart:math';
import 'dart:math' as math;

import 'package:file_picker/file_picker.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:ph_picker_view_controller/ph_picker_view_controller.dart';
import 'package:image_picker/image_picker.dart';
import 'package:tiktok_sdk_login_share/tiktok_sdk_login_share.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await dotenv.load(fileName: ".env");
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String loginResult = '';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'TikTok SDK Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MediaPickerPage(),
    );
  }
}

class MediaPickerPage extends StatefulWidget {
  const MediaPickerPage({super.key});

  @override
  State<MediaPickerPage> createState() => _MediaPickerPageState();
}

class _MediaPickerPageState extends State<MediaPickerPage> {
  List<String> _selectedMediaUri = [];
  final ImagePicker _picker = ImagePicker();
  final _phPickerViewControllerPlugin = PhPickerViewController();
  late String clientKey;
  late String redirectUri;
  @override
  void initState() {
    super.initState();
    clientKey = dotenv.env['TIKTOK_CLIENT_KEY'] ?? '';
    redirectUri = kIsWeb ? dotenv.env['TIKTOK_WEB_REDIRECT_URL'] ?? '' : dotenv.env['TIKTOK_REDIRECT_URL'] ?? '';
  }

  
  Future<void> _pickImage() async {
    try {
      final XFile? image = await _picker.pickImage(source: ImageSource.gallery);
      if (image != null) {
        setState(() {
          _selectedMediaUri.add(image.path);
          print('选择的图片 URI: $_selectedMediaUri');
        });
      }
    } catch (e) {
      print('选择图片时出错: $e');
    }
  }

  Future<void> _pickVideo() async {
    try {
      if (Platform.isIOS) {
        var result = await _phPickerViewControllerPlugin.pick(
          filter: {
            'any': ['videos']
          },
          preferredAssetRepresentationMode:
              PHPickerAssetRepresentationMode.current,
          selection: PHPickerSelection.ordered,
          selectionLimit: 3,
          appendLiveVideos: true,
        );
        result?.forEach((element) {
          print('element: ${element.toString()}');
          _selectedMediaUri.add(element.id ?? '');
        });
      } else {
        FilePickerResult? result = await FilePicker.platform
            .pickFiles(allowMultiple: true, type: FileType.video);

        if (result != null) {
          List<String> files =
              result.files.map((file) => file.identifier ?? '').toList();
          _selectedMediaUri.addAll(files);
        } else {
          // User canceled the picker
        }
      }

      print('选择的视频: $_selectedMediaUri');

      // final XFile? video = await _picker.pickVideo(source: ImageSource.gallery);
      // if (video != null) {
      //   setState(() {
      //     _selectedMediaUri = video.path;
      //     print('选择的视频 URI: $_selectedMediaUri');
      //   });
      // }
    } catch (e) {
      print('选择视频时出错: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('选择媒体文件'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            if (_selectedMediaUri != null) ...[
              // if (_selectedMediaUri!.toLowerCase().endsWith('.mp4') ||
              //     _selectedMediaUri!.toLowerCase().endsWith('.mov'))
              //   const Text('已选择视频文件')
              // else
              //   Image.network(
              //     _selectedMediaUri!,
              //     height: 200,
              //     width: 200,
              //     fit: BoxFit.cover,
              //   ),
              const SizedBox(height: 20),
            ],
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                ElevatedButton(
                    onPressed: () async {
                      try {
                        final state = generateCsrfState();
                        final result = await TikTokSDK.instance.login(
                          clientKey: clientKey,
                          permissions: {
                            TikTokPermissionType.userInfoBasic,
                            TikTokPermissionType.userInfoProfile,
                            TikTokPermissionType.userInfoStats,
                            // TikTokPermissionType.userSettingList,
                            // TikTokPermissionType.userSettingsUpdate,
                            // TikTokPermissionType.videoList,
                            TikTokPermissionType.videoPublish,
                            TikTokPermissionType.videoUpload,
                          },
                          redirectUri: redirectUri,
                          browserAuthEnabled: kIsWeb,
                          state: state,
                        );
                        print('state: $state');
                        print('登录结果: $result');

                        if (result.status == TikTokLoginStatus.success) {
                          ScaffoldMessenger.of(context).showSnackBar(
                            const SnackBar(content: Text('登录成功！')),
                          );
                        } else if (result.status ==
                            TikTokLoginStatus.cancelled) {
                          ScaffoldMessenger.of(context).showSnackBar(
                            const SnackBar(content: Text('用户取消了登录')),
                          );
                        } else {
                          ScaffoldMessenger.of(context).showSnackBar(
                            SnackBar(
                                content: Text('登录失败: ${result.errorMessage}')),
                          );
                        }
                      } catch (e) {
                        print('登录错误: $e');
                        ScaffoldMessenger.of(context).showSnackBar(
                          SnackBar(content: Text('登录错误: $e')),
                        );
                      }
                    },
                    child: const Text('登录')),
                ElevatedButton(
                  onPressed: _pickImage,
                  child: const Text('选择图片'),
                ),
                const SizedBox(width: 20),
                ElevatedButton(
                  onPressed: _pickVideo,
                  child: const Text('选择视频'),
                ),
              ],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                ElevatedButton(
                    onPressed: () async {
                      if (_selectedMediaUri != null) {
                        await TikTokSDK.instance.share(
                            clientKey: clientKey,
                            mediaUrls: _selectedMediaUri,
                            isSharingImage: false,
                            greenScreenEnabled: false,
                            redirectURI: 'your_redirect_uri');
                      }
                    },
                    child: const Text('发布')),
                ElevatedButton(onPressed: () {}, child: const Text('上传图片')),
              ],
            )
          ],
        ),
      ),
    );
  }

   String generateCsrfState() {
    final random = Random();
    // 生成随机数，转换为36进制，然后去掉前两位
    final randomNumber = random.nextDouble();
    final base36String = randomNumber.toString().substring(2);
    return base36String.substring(0, math.min(10, base36String.length));
  }

}