הוספת תוויות לתמונות באופן מאובטח באמצעות Cloud Vision באמצעות Firebase Auth ו-Functions בפלטפורמות של Apple

כדי לשלוח קריאה ל-Google Cloud API מהאפליקציה, צריך ליצור אמצעי ביניים API ל-REST שמטפל בהרשאות ומגן על ערכים סודיים, כמו מפתחות API. לאחר מכן תצטרכו לכתוב קוד באפליקציה לנייד כדי לבצע אימות מול שירות הביניים הזה ולתקשר איתו.

אחת מהדרכים ליצור את ה-API ל-REST הוא באמצעות אימות ופונקציות ב-Firebase, שמאפשרים גישה מנוהלת ללא שרת (serverless) אל ממשקי Google Cloud API שמטפלים באימות ואפשר לקרוא להם מהאפליקציה לנייד באמצעות וערכות SDK מוכנות מראש.

במדריך הזה נדגים איך להשתמש בשיטה הזו כדי לשלוח קריאה ל-Cloud Vision API מהאפליקציה שלכם. השיטה הזו תאפשר לכל המשתמשים המאומתים לגשת לשירותי החיוב של Cloud Vision דרך הפרויקט ב-Cloud, וכך לפני שממשיכים, צריך לבדוק אם מנגנון האימות הזה מספיק לתרחיש לדוגמה שלכם.

לפני שמתחילים

הגדרת הפרויקט

שימוש ב-Swift Package Manager כדי להתקין ולנהל יחסי תלות של Firebase.

1. ב-Xcode, כשפרויקט האפליקציה פתוח, עוברים אל קובץ > הוספת חבילות.
2. כשמופיעה בקשה, מוסיפים את המאגר של Firebase SDK לפלטפורמות של Apple:

  https://github.com/firebase/firebase-ios-sdk.git

3. בוחרים את הספרייה Firebase ML.
4. מוסיפים את הדגל -ObjC לקטע סימונים של מקשר אחר בהגדרות ה-build של היעד.
5. בסיום, Xcode יתחיל לפתור את הבעיה ותוריד את של יחסי התלות ברקע.

עכשיו מבצעים הגדרה בתוך האפליקציה:

1. באפליקציה, מייבאים את Firebase:

   Swift

   import FirebaseMLModelDownloader

   Objective-C

   @import FirebaseMLModelDownloader;

עוד כמה שלבים בהגדרה, ואנחנו מוכנים:

1. אם עדיין לא הפעלתם ממשקי API מבוססי-ענן בפרויקט שלכם, אתם צריכים לעשות זאת עכשיו:

   1. פותחים את Firebase ML דף ממשקי ה-API במסוף Firebase.

   2. אם עדיין לא שדרגתם את הפרויקט לתוכנית התמחור והתשלומים של Blaze, לוחצים על כדי לעשות זאת, אפשר לשדרג. (תתבקש לשדרג רק אם הוא לא בתוכנית Blaze.)

      רק בפרויקטים ברמת Blaze אפשר להשתמש בממשקי API מבוססי-ענן.

   3. אם ממשקי API מבוססי-ענן עדיין לא מופעלים, לוחצים על הפעלת ממשקי API מבוססי-ענן. ממשקי API.
2. להגדיר את מפתחות ה-API הקיימים של Firebase כדי למנוע גישה לענן Vision API:
   1. פותחים את הדף Credentials במסוף Cloud.
   2. עבור כל מפתח API ברשימה, פותחים את תצוגת העריכה ובקטע 'מפתח' בקטע 'הגבלות', מוסיפים את כל ממשקי ה-API הזמינים מלבד Cloud Vision API אל הרשימה.

פריסת הפונקציה שניתנת לקריאה

בשלב הבא, פורסים את Cloud Function שתשמש כגשר בין האפליקציה ל-Cloud Vision API. המאגר functions-samples מכיל דוגמה שאפשר להשתמש בהם.

כברירת מחדל, הגישה ל-Cloud Vision API דרך הפונקציה הזו תאפשר רק משתמשים מאומתים של האפליקציה שלכם יכולים לגשת ל-Cloud Vision API. אפשר לשנות את הפונקציה בהתאם לדרישות שונות.

כדי לפרוס את הפונקציה:

1. משכפלים או מורידים את מאגר functions-samples ומעבירים את הנתיב לספרייה Node-1st-gen/vision-annotate-image:

   git clone https://github.com/firebase/functions-samples
   cd Node-1st-gen/vision-annotate-image
   

2. יחסי תלות של התקנות:

   cd functions
   npm install
   cd ..

3. אם אין לכם את Firebase CLI, מתקינים אותו.
4. מפעילים פרויקט Firebase ב-vision-annotate-image כשמוצגת בקשה לעשות את זה, בוחרים את הפרויקט מהרשימה.

   firebase init

5. פורסים את הפונקציה:

   firebase deploy --only functions:annotateImage

הוספת אימות מ-Firebase לאפליקציה

הפונקציה הניתנת לקריאה (caller) שנפרסה למעלה תדחה כל בקשה ממשתמשים לא מאומתים המשתמשים באפליקציה. אם עדיין לא עשית זאת, יהיה עליך להוסיף Firebase מאמתים את האפליקציה.

צריך להוסיף את יחסי התלות הנדרשים לאפליקציה

כדי להתקין את הספרייה Cloud Functions for Firebase, משתמשים ב-Swift Package Manager.

עכשיו אפשר להוסיף תוויות לתמונות.

1. הכנת תמונת הקלט

guard let imageData = uiImage.jpegData(compressionQuality: 1.0) else { return }
let base64encodedImage = imageData.base64EncodedString()

NSData *imageData = UIImageJPEGRepresentation(uiImage, 1.0f);
NSString *base64encodedImage =
  [imageData base64EncodedStringWithOptions:NSDataBase64Encoding76CharacterLineLength];

2. הפעלת הפונקציה הניתנת לקריאה כדי להוסיף תווית לתמונה

1. קודם כול, מאתחלים מכונה של Cloud Functions:

   Swift

   lazy var functions = Functions.functions()
   

   Objective-C

   @property(strong, nonatomic) FIRFunctions *functions;
   

2. יוצרים בקשה כשהשדה Type מוגדר ל-LABEL_DETECTION:

   Swift

   let requestData = [
     "image": ["content": base64encodedImage],
     "features": ["maxResults": 5, "type": "LABEL_DETECTION"]
   ]
   

   Objective-C

   NSDictionary *requestData = @{
     @"image": @{@"content": base64encodedImage},
     @"features": @{@"maxResults": @5, @"type": @"LABEL_DETECTION"}
   };
   

3. בשלב האחרון, מפעילים את הפונקציה:

   Swift

   do {
     let result = try await functions.httpsCallable("annotateImage").call(requestData)
     print(result)
   } catch {
     if let error = error as NSError? {
       if error.domain == FunctionsErrorDomain {
         let code = FunctionsErrorCode(rawValue: error.code)
         let message = error.localizedDescription
         let details = error.userInfo[FunctionsErrorDetailsKey]
       }
       // ...
     }
   }
   

   Objective-C

   [[_functions HTTPSCallableWithName:@"annotateImage"]
                             callWithObject:requestData
                                 completion:^(FIRHTTPSCallableResult * _Nullable result, NSError * _Nullable error) {
           if (error) {
             if ([error.domain isEqualToString:@"com.firebase.functions"]) {
               FIRFunctionsErrorCode code = error.code;
               NSString *message = error.localizedDescription;
               NSObject *details = error.userInfo[@"details"];
             }
             // ...
           }
           // Function completed succesfully
           // Get information about labeled objects
   
         }];
   

3. אחזור מידע על אובייקטים מתויגים

if let labelArray = (result?.data as? [String: Any])?["labelAnnotations"] as? [[String:Any]] {
  for labelObj in labelArray {
    let text = labelObj["description"]
    let entityId = labelObj["mid"]
    let confidence = labelObj["score"]
  }
}

NSArray *labelArray = result.data[@"labelAnnotations"];
for (NSDictionary *labelObj in labelArray) {
  NSString *text = labelObj[@"description"];
  NSString *entityId = labelObj[@"mid"];
  NSNumber *confidence = labelObj[@"score"];
}