簡體   English   中英

Firebase 雲功能:更新用戶個人資料

[英]Firebase cloud functions: Update user profile

在我的電子商務項目中,我想使用 google maps api 插入用戶的商店位置。

我使用谷歌雲函數插入緯度、經度和地址。

現在我可以在名為locations的集合中插入數據。 但我想將這些信息附加到用戶配置文件集合中。

那么如何將緯度、經度和用戶地址插入到用戶配置文件集合中呢?

這是我的 index.js

const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp();

const Firestore = admin.firestore;
const db = Firestore();

const axios = require("axios");
const cors = require("cors")({
    origin: true
});

const googleMapsApiKey = "AIzaSyAnp23T2tbYj9Ho8uYmcE6W4KnbvZKlEjc";

exports.geocodeAddressAndSave = functions.https.onRequest(async (request, response) => {
    try {
        let address = encodeURI(request.body.address);
        let { data } = await axios.get(
            `https://maps.googleapis.com/maps/api/geocode/json?address=${address}&key=${googleMapsApiKey}`
        );

        if (data.status !== "OK") {
            //no results
            return cors(request, response, () => {
                response.status(200).send("No Results");
            });
        }

        const geocodedLocation = data.results[0];
        const objGeolocation = {
            address: geocodedLocation.formatted_address,
            geoPoint: new admin.firestore.GeoPoint(geocodedLocation.geometry.location.lat, geocodedLocation.geometry.location.lng)
        }

        //firebase

        await 

        db.collection('locations').add(objGeolocation);

        return cors(request, response, () => {
            response.status(200).send(objGeolocation);
        });
    } catch (error) {
        return cors(request, response, () => {
            console.log(error);
            response.status(500).send();
        });
    }
});

Vue.js

 <template>
  <div id="app" class="container mt-5">
    <b-form @submit.prevent="handleFormSubmit">
      <b-row>
        <b-col md="6">
          <b-form-group label="Street">
            <b-form-input v-model="formData.street"></b-form-input>
          </b-form-group>
        </b-col>
      </b-row>

      <b-row>
        <b-col md="3">
          <b-form-group label="City">
            <b-form-input v-model="formData.city"></b-form-input>
          </b-form-group>
        </b-col>
        <b-col md="3">
          <b-form-group label="State">
            <b-form-input v-model="formData.state"></b-form-input>
          </b-form-group>
        </b-col>
        <b-col md="3">
          <b-form-group label="Zip">
            <b-form-input v-model="formData.zip"></b-form-input>
          </b-form-group>
        </b-col>
      </b-row>
      <b-button type="submit" variant="primary">Submit</b-button>
    </b-form>

    <GmapMap
      :center="{lat:13.756331, lng:100.501762}"
      :zoom="4"
      map-type-id="roadmap"
      style="width: 100%; height: 500px; margin-top:60px;"
    >
       <div>
            <GmapMarker
            :clickable="true"
            @draggable="true"
            @click="center=m.position"
        />
    </div>
    </GmapMap>
  </div>
</template>

<script>
import axios from 'axios';
// firestore
import fireApp from '@/plugins/firebase'
const firebase = require("firebase");
require("firebase/firestore");
const db = firebase.firestore();
let id = String(id);

export default {
  name: "MapFirestore",
  data: () => ({
    savedLocations: [],
    formData: {
      street: "",
      city: "",
      state: "",
      zip: "",
    },
  }),
  
  firestore(){
      const user = fireApp.auth().currentUser;
      return {
        formData: db.collection('Profile').doc(user.uid),
      }
  },
  methods: {
    async handleFormSubmit() {
      //validate form
      if (
        !this.formData.street ||
        !this.formData.city ||
        !this.formData.state ||
        !this.formData.zip
      ) {
        alert("You must add a full address!");
        return;
      }

      //Make request
      let address = `${this.formData.street}, ${this.formData.city}, ${this.formData.state} ${this.formData.zip}`;
      let { data } = await axios.post(
        "https://us-central1-geocodeing-58a86.cloudfunctions.net/geocodeAddressAndSave",
        {
          address: address,
        }
      );

      if (data === "No Results") {
        alert("No results for address");
        return;
      }

      //massage data to fit our schema
      let obj = {
        address: data.address,
        geoPoint: {
          latitude: data.geoPoint._latitude,
          longitude: data.geoPoint._longitude,
        },
      };

      //add to saved locations to update map
      this.savedLocations.push(obj);

      //clear form
      this.formData.street = "";
      this.formData.city = "";
      this.formData.state = "";
      this.formData.zip = "";
    },
  },
};
</script>

我想將數據插入到這個名為 Profile 的集合中。 在此處輸入圖片說明 我的用戶個人資料集合。

您需要知道用戶的 UID,然后用它更新用戶配置文件。 如果這是一個安全操作(很可能是),您需要以安全的方式傳遞 UID。 請參閱: 從 Firebase 中的 Cloud Function 請求獲取用戶信息

獲得 UID 后,您可以使用以下內容更新配置文件:

db.collection('profiles').doc(uid).update({ ... });

我更改了我的 vue 代碼。

var user = firebase.auth().currentUser;

      db.collection('Profile').doc(user.uid).update({ 
            address: data.address,
            latitude: data.geoPoint._latitude,
            longitude: data.geoPoint._longitude,
        });

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM