在React Native中使用RN Fetch Blob将多张照片转换为base64时在Sqlite中保存多张照片时面临的问题

时间:2019-03-22 08:25:55

标签: javascript react-native

我正在构建一个应用程序,用户可以在其中离线访问数据。 为此,我正在使用sqlite 但是为了通过将图片转换为base64来保存图片,请将其保存为sqlite 我面临问题,保存一张图片没有任何问题, 但是如果是多张图片,它会跳过其中的一些。 有两个for循环,是从graphql数据获取图像url并通过使用RNFetchblob将其转换为Base64问题是第二个循环运行了一次 排名第0

以下是代码方法,请帮助我在这里查找问题

async function StoreDataOffline(item) {

  // day events (third screen) TripDayView
  await db.transaction(function (txn) {
    txn.executeSql(
      "SELECT name FROM sqlite_master WHERE type='table' AND name='dayEvents'",
      [],
      function (tx, res) {
        txn.executeSql('DROP TABLE IF EXISTS dayEvents', []);
        txn.executeSql('CREATE TABLE IF NOT EXISTS dayEvents (_id INTEGER AUTOICREAMENT PRIMARY KEY, day_id TEXT, day_title TEXT,event_id TEXT,event_title TEXT,event_start TEXT,event_end TEXT,cover TEXT,call TEXT,website TEXT,notes TEXT,lat TEXT,lng TEXT)',
          []);
      }
    );
  });

  await db.transaction(function (txn) {
    for (let j = 0; item.tripDetails.itineraryDays.length > j; j++) {
      let getJ = "";
      getJ = j;
      if (item.tripDetails.itineraryDays[getJ].contentEvents.length > 0) {

        var length = 0;
        length = item.tripDetails.itineraryDays[getJ].contentEvents.length

        for (let k = 0; length > k; k++) {
          let getK = "";
          getK = k;
          var dayId = "";
          var dayTitle = "";
          var notes = "";
          var coverUrl = "";
          var eventID = "";
          var eventTitle = "";
          var eventStartDate = "";
          var eventEndDate = "";
          var eventLat = "";
          var eventLng = "";
          var eventCall = "";
          var eventWebsite = "";

          dayId = item.tripDetails.itineraryDays[getJ].id;
          dayTitle = item.tripDetails.itineraryDays[getJ].title;
          eventID = item.tripDetails.itineraryDays[getJ].id;
          notes = item.tripDetails.itineraryDays[getJ].notes.length;

          //  if (item.tripDetails.itineraryDays[getJ].contentEvents.length > 0) {
          eventTitle = item.tripDetails.itineraryDays[getJ].contentEvents[getK].title;
          eventStartDate = item.tripDetails.itineraryDays[getJ].contentEvents[getK].startDate;
          eventEndDate = item.tripDetails.itineraryDays[getJ].contentEvents[getK].endDate;
          //  }

          if (item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs.length > 0) {
            eventCall = item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs[0].phone;
            eventWebsite = item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs[0].website;
          }

          if (item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs.length > 0) {
            eventLat = item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs[0].location.lat;
            eventLng = item.tripDetails.itineraryDays[getJ].contentEvents[getK].contentPOIs[0].location.lng;
          }

          if (item.tripDetails.itineraryDays[getJ].contentEvents[getK].photos.length > 0) {
            coverUrl = item.tripDetails.itineraryDays[getJ].contentEvents[getK].photos[0];
            coverUrl = coverUrl.url.replace('//files.', '//images.') + "/800x600";
            return new Promise((resolve, reject) => {
              Promise.all([
                RNFetchBlob.config({
                  fileCache: true
                })
                  .fetch("GET", coverUrl)
                  // 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();
                    //   alert(imagePath + "path");
                    return resp.readFile("base64");
                  })
                  .then(base64Data => {
                    // here's base64 encoded image
                    var base = "data:image/png;base64," + base64Data;
                    db.transaction(function (txn) {
                      txn.executeSql(
                        'INSERT INTO dayEvents (day_id,day_title,event_id,event_title,event_start,event_end,cover,call,website,notes,lat,lng) VALUES (?,?,?,?,?,?,?,?,?,?,?,?)',
                        [dayId, dayTitle, eventID, eventTitle, eventStartDate, eventEndDate, base, eventCall, eventWebsite, notes, eventLat, eventLng]
                        , (result) => {
                          //    alert(JSON.stringify(result));
                        }, (err) => {
                          //    alert("Error: " + JSON.stringify(err));
                        })
                      // }, (err) => {
                      //   alert("Error: " + JSON.stringify(err));
                    });
                    return fs.unlink(imagePath);

                  })
              ]).then(data => {
                var IsExistblocktype = data;
                alert("success");
              }).catch(err => {
                alert("failled" + err);
              })
            })
          }
          else {
            return new Promise((resolve, reject) => {
              Promise.all([
                db.transaction(function (txn) {
                  txn.executeSql(
                    'INSERT INTO dayEvents (day_id,day_title,event_id,event_title,event_start,event_end,cover,call,website,notes,lat,lng) VALUES (?,?,?,?,?,?,?,?,?,?,?,?)',
                    [dayId, dayTitle, eventID, eventTitle, eventStartDate, eventEndDate, "empty", eventCall, eventWebsite, notes, eventLat, eventLng]
                    , (result) => {
                      //     alert("Images Stored");
                    }, (err) => {
                      //     alert("Error: " + JSON.stringify(err));
                    })
                })]).then(data => {
                  var IsExistblocktype = data;
                  // alert("success");
                }).catch(err => {
                  alert("failled");
                })
            });
          }
        }
      }
    }
  });

}

0 个答案:

没有答案