React Native共享映像

jm81lzqq  于 2022-12-24  发布在  React
关注(0)|答案(8)|浏览(144)

我试图通过各种可用设备的应用程序(如whatsApp,skype,电子邮件等)分享图像,无论是从相机或从画廊,到其他设备,我发现提供的"分享"功能,但根据我的知识和研究,它只允许分享文本数据。
有没有人有任何想法,通过一个React原生应用程序共享图像。
先谢了。

kupeojn6

kupeojn61#

溶液:

  • 获取要转换base64的图像的路径。
  • 用于共享映像:React Native共享lib share
  • 要访问设备目录,建议使用:rn-fetch-二进制大对象. Wikki lib
dwFile(file_url) {
      let imagePath = null;
      RNFetchBlob.config({
          fileCache: true
      })
      .fetch("GET", file_url)
      // the image is now dowloaded to device's storage
      .then(resp => {
          // the image path you can use it directly with Image component
          imagePath = resp.path();
          return resp.readFile("base64");
      })
      .then(async base64Data => {
          var base64Data = `data:image/png;base64,` + base64Data;
          // here's base64 encoded image
          await Share.open({ url: base64Data });
          // remove the file from storage
          return fs.unlink(imagePath);
      });
  }

希望这个有用。

b5buobof

b5buobof2#

您还可以通过url参数使用Share发送图像:
url: "data:image/png;base64,<base64_data>"干杯

zwghvu4y

zwghvu4y3#

从Expo的SDK33开始,你就可以使用Expo Sharing将任何类型的文件共享给其他可以处理该文件类型的应用,即使你使用的是Android,也不需要分离或任何操作。
参见https://docs.expo.io/versions/latest/sdk/sharing/
用法非常简单:

import * as Sharing from 'expo-sharing'; // Import the library

Sharing.shareAsync(url) // And share your file !
x3naxklr

x3naxklr4#

我使用react-native-share插件做同样的事情
步骤:

  1. npm安装React-本机-共享-保存
    1.React-本机链接
    阅读here的其余代码...这是非常容易和直接向前.如果你想分享图像在base64你必须通过这样:
    "data:image/png;base64,BASE STRING"
    如果你想直接从源代码共享,你必须这样传递:
    url: "file://<file_path>",
    希望这有帮助:)
rjzwgtxy

rjzwgtxy5#

我尝试如下:

import {
     Share
} from 'react-native';
 let shareImage = {
                title: caption,//string
                message: message,//string
                url:imageUrl,// eg.'http://img.gemejo.com/product/8c/099/cf53b3a6008136ef0882197d5f5.jpg',

            };
            Share.open(shareImage).catch(err => console.log(err));

希望这对你有帮助。干杯!

s2j5cfk0

s2j5cfk06#

在大多数社交媒体或平台上,您不能同时共享图片和网址。要做到这一点,您需要一个可以通过API创建的可共享图片链接。

zkure5ic

zkure5ic7#

Share.share({
      message: "dummy text",
      url:"https://xyz.jpg"
    })
    .then((res) => {
      console.log(res);
    })
    .catch((err) => {
      console.log(err);
    })

试试这个代码,应该可以

wz3gfoph

wz3gfoph8#

来自2022年的最新答案:)截图示例。顺便说一句,参数url在Android中工作

import ViewShot,{captureScreen} from 'react-native-view-shot';
import Share from 'react-native-share';

<Pressable onPress={()=>{
              captureScreen({format: "jpg",quality: 0.8,
                }).then((uri) => { ShareScreenShot(uri); },
                (error) => console.error("Oops, snapshot failed", error));}} >

const ShareScreenShot = async (urifile) => {
  Share.open({message:'Result', url:urifile}) .then((res) => {
    //console.log(res);
  }) .catch((err) => {
    /*err && */console.log('error', err);
  });
}

相关问题