עזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה

dovid

response.json()

היא משימה שאורכת זמן, כלומר עוד פרומייז. התוצאה שלה מוכנה רק בthen הבא.
אתה צריך לכתוב ככה:

arrayYT.forEach((YTurl, index) => {
    fetch(`https://www.google.com/~netfree/test-url?u=${YTurl}`, {})
      .then((response) => {
        return response.json();
      })
      .then((json) => {
        console.log("URL: " + YTurl);
        console.log("RESPONSE:", json);
        jsonTest(json.block, YTurl);
      })
      .catch((error) => {
        console.log(`שגיאה בקבלת נתונים מהכתובת: ${YTurl}. שגיאה: ${error}`);
      })
      .finally(() => {
        if (index === arrayYT.length - 1) {
          playCompleted();
        }
      });
  });

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

let listTasks = arrayYT.map(tyUrl => fetch(`/~netfree/test-url?u=${tyUrl }`)
                     .then(response  => response.json())
                     .then(json => jsonTest(json, tyUrl ) && [json, tyUrl ])
                     .catch(error=> `שגיאה בקבלת נתונים מהכתובת: ${tyUrl }. שגיאה: ${error}`)
);
Promise.all(listTasks).then(_ => playCompleted());

dovid

קוד יותר טוב אבל שמצריך שינוי בplayCompleted:

let listTasks = arrayYT.map(tyUrl => fetch(`/~netfree/test-url?u=${tyUrl }`)
                     .then(response  => response.json())
                     .then(json => ({json, url: tyUrl}))
                     .catch(error=> `שגיאה בקבלת נתונים מהכתובת: ${tyUrl }. שגיאה: ${error}`)
);

Promise.all(listTasks).then(results => {
     playCompleted(results);
});

function playCompleted(list){
      for(let yt of list)
           console.log(`url: ${yt.url} response ${json.block}`)
}

dovid

מחילה שהעפתי את הפוסטים, זה היה אקט חינוכי...

צדיק תמים

@dovid קודם כל תודה על התשובה המהירה
למה באמת response.json() לוקח זמן? במה זה שונה מכל ניתוח מקומי אחר, לדוגמה .split()?

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

@dovid אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

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

ברשותך, לא הבנתי כמה וכמה חלקים בקוד המשופר... כנראה כתיב מודרני שטרם זכיתי להכיר
לדוגמה:

response  => response.json()

ו

.then(json => jsonTest(json, tyUrl ) && [json, tyUrl ])

וגם

tyUrl => fetch(`/~netfree/test-url?u=${tyUrl}`

@dovid אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

קוד יותר טוב אבל שמצריך שינוי בplayCompleted

יש עניין בזה?
playCompleted זה סה"כ פונקציה שמשמיעה צליל סיום, ומופעלת בסיום המערך...

dovid

@צדיק-תמים .split() גם לוקח זמן, אבל הJS מפסיק לעבוד עד שזה מתבצע.
בניתוח json זה לא כדאי כי זה יכול לקחת הרבה זמן בהתאם לגודל והמורכבות.

הקוד שהבאתי הראשון "לא שינית בו כלום" אבל כתבתי בדיוק מה שיניתי: "התוצאה שלה מוכנה רק בthen הבא." כלומר הconsole.log לא נמצא יחד עם הresponse.json() אלא בthen שאחריו.

בקשר לכתיב המודרני זה סוטה מהנושא. תוכל לפתוח נושא חדש על תחביר פונקציות חץ, או לקרוא על זה פה https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions.

בנוגע לplayCompleted לא היה לי מושג מה היא עושה, לתומי חשבתי שהיא עושה שימוש עם התוצאות שהתקבלו. אם זה רק להשמיע צליל היא מיותרת, אפשר להשמיע את הצליל בthen של Promise.all.

צדיק תמים

@dovid אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

הקוד שהבאתי הראשון "לא שינית בו כלום" אבל כתבתי בדיוק מה שיניתי: "התוצאה שלה מוכנה רק בthen הבא." כלומר הconsole.log לא נמצא יחד עם הresponse.json() אלא בthen שאחריו.

זה מה שניסיתי קודם כל, וזה לא עבד... זה כתב שYTurl לא מוגדר.
לא משנה.

צדיק תמים

@dovid כעת אני צריך לעשות שרשור נוסף...
כלומר אני רוצה מלבד הקריאה לכתובת שבקוד שהבאתי, להוסיף קריאה נוספת (לAPI של יוטיוב, לקבל מידע על הסרטון) ואז לשלוח את התשובות מ-2 הכתובות ביחד לתוך ה()jsonTest שמנתחת את מה שהיא מקבלת ושולחת את זה לפונקציה שמדפיסה בפועל.
אני מעוניין שההדפסה תהיה ברצף, כלומר בשורה אחת יהיה את כתובת הסרטון, ואז את המידע שמגיע מהAPI.
השאלה איך אני עושה את זה?
לא הצלחתי להבין באיזה שלב אני צריך להוסיף את הfetch החדש.

צדיק תמים

למעשה עברתי לasync-awiat, החיים נהיו הרבה יותר קלים ופשוטים

יוסף בן שמעון

@צדיק-תמים אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

למה באמת response.json() לוקח זמן? במה זה שונה מכל ניתוח מקומי אחר, לדוגמה .split()?

ה then הראשון חוזר מיד בתגובה הראשונית מהשרת שמכילה הידרים וקוד תגובה, אחר כך השרת מתחיל לשלוח את גוף התשובה body וזה יכול לקחת הרבה זמן, וזה מצריך עוד פרומיס כי זה לא עיבוד נתונים מקומי אלא ממתין לכל הפאקטות שיגיעו מהשרת

chv

@יוסף-בן-שמעון אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

@צדיק-תמים אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

למה באמת response.json() לוקח זמן? במה זה שונה מכל ניתוח מקומי אחר, לדוגמה .split()?

ה then הראשון חוזר מיד בתגובה הראשונית מהשרת שמכילה הידרים וקוד תגובה, אחר כך השרת מתחיל לשלוח את גוף התשובה body וזה יכול לקחת הרבה זמן, וזה מצריך עוד פרומיס כי זה לא עיבוד נתונים מקומי אלא ממתין לכל הפאקטות שיגיעו מהשרת

וואו!! השאלה והתשובה הזאת צריכים להיות בשרשור משלהם.
זה דבר שקפץ לי השאלה הזאת בראש הרבה פעמים בזמן פיתוח.
התשובה שלך פשוט עונה בדיוק על השאלה.
אם היה כאן SO זה היה accepted answer בקל.

dovid

@צדיק-תמים אמר בעזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה:

@dovid כעת אני צריך לעשות שרשור נוסף...

אנא ממך, פתח מאה נושאים ביום, רק לא שרשורים ארוכים ועדכונים...

צדיק תמים

@dovid מה העניין לפצל את אותה בעיה ל2 נושאים נפרדים?
אני מדבר על ההודעה שציטטת

תחומים - פורום חרדי מקצועי

עזרה בשרשור פרומיסים (fetch) / גם שימוש בjson שמתקבל מהכתובת וגם קבלת הכתובת עצמה