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

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

יש מחלקה בשם URL שלוקחת פרמטרים ומחזירה URL תקין עם פרמטרי חיפוש ושאר ירקות

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

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

שם משתנה a1 זה לא תקין בעליל

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

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

הוא משמש לכמה דברים בזה אחר זה

איזה דברים?
אני מגדיר אותו קודם כל כמערך עם מחרוזת ריקה בnextPageToken, בשביל תקינות הקריאה הראשונה.
חוץ מזה אין עוד שימוש

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

async function lulaa(ChannelID) {
  let arryYT = []
  let a1 = {
    nextPageToken: "",
  }
  let artToken = ""
  do {
    a1 = await fetch(`https://www.googleapis.com/youtube/v3/search?key=` + TokenAPI() + `&channelId=${ChannelID}&part=id&order=date&maxResults=50${artToken}${a1.nextPageToken}`)
    a1 = await a1.json()
    a1.items.forEach((parit, index) => {
      if (parit.id.kind === "youtube#video") {
        arryYT.push(parit.id.videoId)
      }
    })
    artToken = "&pageToken="
  } while (await a1.nextPageToken)
  console.log(arryYT)
}

function TokenAPI() {
  return "AIzaSyBUtCAp82VCsH5z3XmTMy1KMnLQ1g3Cqm0"
}

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

@yossiz אמר בעזרה - שרשור פרומיסים מותנה וביצוע פעולה רק בסיום כולם (JS):

הפונקציה getNextPage לא קוראת לעצמה בקוד הנ"ל.

זה לא מה שקורה בשורות 28-30?

@yossiz אמר בעזרה - שרשור פרומיסים מותנה וביצוע פעולה רק בסיום כולם (JS):

במקום כמה קריאות, אמור להיות שם לולאה שתנאי העצירה שלה זה אם לא התקבל nextPageToken

יפה! לא חשבתי על הכיוון הזה, (בעצם יצרתי פונקציה שקוראת לעצמה [בתנאי מסוים]). לכאורה הכי מתאים זה do while.
עכשיו נשארת השאלה איך אני יודע שהכל הסתיים?

@יוסף-בן-שמעון עד 500 תוצאות זה כן אמור להיות מדויק בצורה הזאת, ולי זה מספיק, הקוד לא מתוכנן כרגע לעבוד על ערוצים יותר גדולים מזה.
מלבד זאת, גם אם אני יעשה את זה ככה, עדיין נשארת השאלה שבשבילה פתחתי את הנושא - איך אני יודע שכל הקריאות הסתיימו?
וכן כשאני נכנס ידנית (בדפדפן) לכתובות עם הpageToken, אני כן מצליח לקבל את כל התוכן, ככה שנראה שזה בעיה בקוד.

המטרה - לקבל מערך של מזהי סרטונים בערוץ מסוים ביוטיוב (לפי מזהה ערוץ) דרך הAPI של גוגל.
גוגל מאפשרת לקבל בכל פעם עד 50 תוצאות.
אם יש יותר - הAPI מחזיר ערך nextPageToken, שאותו מעבירים בפרמטר pageToken בשאילתה החדשה, וכן הלאה עד שלא חוזר nextPageToken ואז זה אומר שאין עוד תוצאות.
בעצם מה שניסיתי לממש זה את המדריך הזה:
http://truelogic.org/wordpress/2017/06/20/7-youtube-data-api-paging-maxresults

כתבתי את הקוד הבא, שבעצם מבצע קריאה ראשונית, מקבל את התוכן ודוחף את מזהי הוידאו למערך "arryYT" ואז באם חוזר פרמטר nextPageToken מבצע שאילתה נוספת, מכניס למערך, ובאם עדיין יש nextPageToken מבצע שוב קריאה, וכן הלאה.

let arryYT = []
async function lulaa(ChannelID) {
  console.log("run")
  let a1 = await fetch(`https://www.googleapis.com/youtube/v3/search?key=` + TokenAPI() + `&channelId=${ChannelID}&part=id&order=date&maxResults=50`)
  a1 = await a1.json()
 console.log(Math.ceil(a1.pageInfo.totalResults / 50))
  a1.items.forEach((parit, index) => {
    if (parit.id.kind === "youtube#video") {
      arryYT.push(parit.id.videoId)
    }
  })
  if (a1.nextPageToken) {
    getNextPage(a1.nextPageToken)
  }
    if (a1.nextPageToken) {
      getNextPage(a1.nextPageToken)
    }
    async function getNextPage(nextPageToken) {
      console.log("run")
      let a1 = await fetch(`https://www.googleapis.com/youtube/v3/search?key=` + TokenAPI() + `&channelId=${ChannelID}&part=id&order=date&maxResults=50&pageToken=${nextPageToken}`)
      a1 = await a1.json()
      a1.items.forEach((parit, index) => {
        if (parit.id.kind === "youtube#video") {
          arryYT.push(parit.id.videoId)
        }
      })
    }
    if (a1.nextPageToken) {
      getNextPage(a1.nextPageToken)
    }
}

function TokenAPI() {
  return "AIzaSyBUtCAp82VCsH5z3XmTMy1KMnLQ1g3Cqm0"
}

השאלה איך אני יודע שכל הקריאות (וניתוח הנתונים) הסתיימו בהצלחה? כדי להמשיך לשלב הבא - שליחת המערך המוכן של המזהים לפונקציה אחרת שתנתח אותם.
כמו כן, נראה שבכלל לא כל הנתונים מתקבלים...
בקריאה לדוגמה לערוץ הזה:

lulaa("UCzlw5vTVVMPwBKElMt3gYQw")

שיש 399 פריטים שבשביל לקבל אותם צריך 8 דפי מידע (בשורה 6 מודפס לקונסול המידע הזה), אבל בפועל הקונסולוגים שהכנסתי בשורות 19 ו3 מראים שזה רץ רק 4 פעמים, והתקבל מערך עם 195 פריטים בלבד (המספר בניקוי הפלייליסטים (שורה 8/23), ועדיין...).
גם כשחיכיתי עוד קצת, והדפסתי את המערך, לא היו בו את כל תוצאות נוספות...
הפונקציה TokenAPI במקור מחזירה מפתח API לפי מה שהמשתמש הגדיר (נשמר בlocalStroage) וכו', בשביל הדוגמה עשיתי שהיא תחזיר מפתח קבוע...
אשמח לעזרה.

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

@dovid נחמד מאוד, וטוב שצירפת תמונה לדוגמה, כי השלד והקישור לא ממש עזרו...
יש אופציה מהפופ-אפ שקופץ בריחוף, גם לקפוץ להגדרת הפונקציה?

@dovid אכן עזר, תודה.
יש לך אולי איזה טריק שגם ההערות לא יזוזו לתוך הפונקציה?

@www ממה שהבנתי מהקישור שנתת זה בעצם כלי לייצר תיעוד באופן אוטומטי..
אני צריך סה"כ משהו פנימי שיופיע לי כשאני עורך את הקוד בVSC

@www אמר בעזרה - ביטול פיצול שורות מציק בPrettier:

יש מוסכמה מסויימת על אורך השורות, אא"כ יש לך עכבר אנכי...

העניין הוא שזה מחלק את זה עוד הרבה קודם...
לדוגמה כזו שורה

וגם זה לא ממש עוזר, שבמקום שורה כזו:

alert("aaaaa aaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa")

יהיה כזה:

alert(
  "aaaaa aaaaaaaaa aaaaaaaaa aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaaaaaaaaaaaaaa"
)

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

@אנא פעם הגעתי לAPI הזה: https://libretranslate.com/docs וחשבתי להשתמש בזה אז שלחתי לנטפרי, למעשה לא יצא לי להשתמש/לחקור את זה, תוכל לנסות
לפי מה שזכור לי הגעתי לזה מרשימה כלשהיא של API חינמיים

@יוסף-בן-שמעון אמר בעזרה - ביטול פיצול שורות מציק בPrettier:

חפש בהגדרות של התוסף את ההגדרה proseWrap, ותנסה להגדיר את זה never

הגדרתי:

וסגרתי ופתחתי שוב את הVSC, ולא עזר.

אני משתמש בתוכנת VSC כדי לכתוב קוד, בעיקר JS.
לאחרונה גיליתי את הפורמטר Prettier ואני נהנה ממנו מאוד, חוץ מ2 דברים...
הראשון:
הוא מפצל שורות בלי קשר, לדוגמה שורה כזו:

  let idC = url.match(/^(?:(http|https):\/\/[a-zA-Z-]*\.{0,1}[a-zA-Z-]{3,}\.[a-z]{2,})\/channel\/([a-zA-Z0-9_]{3,})$/)

נהפכת ל3 שורות:

  let idC = url.match(
    /^(?:(http|https):\/\/[a-zA-Z-]*\.{0,1}[a-zA-Z-]{3,}\.[a-z]{2,})\/channel\/([a-zA-Z0-9_]{3,})$/
  )

כנ"ל בalert עם תוכן קצת ארוך, וכן הלאה... וזה ממש מבלבל.
בנוסף, הערות שנכתבות בשורה של הגדרת הפונקציה - כזה:

function Channel_ID_Extract(url) { //הערה על הפונקציה
}

יורדות לתוך הפונקציה:

function Channel_ID_Extract(url) {
  //הערה על הפונקציה
}

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

ואחרי הפורמטר שההסבר ירד שורה אל תוך הפונקציה - לא רואים...:

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

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

@ארכיטקט לכן כתבתי שאפשר לחלוק, כדי שאף אחד לא ירגיש צורך להתנגד...

ניסיתי לחפור בגוגל אחר כלים דומים אבל יותר יעילים, מצאתי את זה שנראה שמנסה להיות יותר מתוחכם - לדוגמה עבור קוד כזה:

    $(".textareaDemo").css({ "position": "absolute", "right": "-99999px" });

הכלי הראשון שהבאתי פשוט משנה את צורת הסלקטור, וזהו...

document.getElementByClassName("textareaDemo").css({ "position": "absolute", "right": "-99999px" });

והכלי הזה כן מנסה להתמודד עם זה באמצעות לולאה (שזה לפי מה שהבנתי הדרך לעשות כזה דבר בJS ונילה):

Array.from(document.getElementsByClassName("textareaDemo")).forEach(e => e.style.{ position: absolute =  "right": "-99999px" })

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

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

היום גיליתי כלי קטן אמנם, אך לדעתי חשוב מאוד...
אתר להמרה אוטומטית של קוד JS שכתוב בספריית jQuery לקוד JS פשוט ("ונילה").
שימושי למשל אם כותבים קוד לאתר שאין בו את הספריה, ורוצים להשתמש בכמה שורות קוד ספציפיות בשפה הזאת, למשל מתוך תשובה ב-stackoverflow...
במקום לטעון את כל הספריה בשביל הכמה שורות האלו, או לשכתב ידנית את הקוד, פשוט מדביקים אותו באתר הזה ולוחצים על "convert"...
אפשר גם לכתוב ישירות את הקוד בjQuery שיש לו תחביר יותר קצר ונוח, ובסיום להמיר אותו באתר הזה כדי שיתאים לכל אתר...
מומלץ!
https://www.workversatile.com/jquery-to-javascript-converter

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