העלאה ופתיחה של קובץ תמונה בפרויקט MVC+ANGULARJS

[adin]

צריכה עזרה ממי שיש לו ניסיון בהוספת תמונה בפרויקט MVC, ANGULARJS - איך נכון לעשות את זה
חשבתי אולי בדרך של שמירה בתיקיה ושמירת נתיב התיקיה בדאטה בייס- אז איך מעלים לתיקיה ואיך מציגים את זה אח"כ?
תודה מראש!

 

[סמרקט]

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

 

[adin]

אמיתי לגמרי- יושב על שרת, משהו בעבודה

 

[סמרקט]

אמיתי לגמרי- יושב על שרת, משהו בעבודה

בענן? אם כן, איזה?
ותוכלי לפרט יותר מה הרקע ומה הצורך?
(אפשר לטפל בזה בכמה דרכים, תלוי במערכת)

 

[adin]

לא יודעת למה את מתכוונת ענן, יש שרת IIS שאליו אנחנו מעלים את הפרויקט, וזהו זה נמצא ברשת (זה פתוח רק לאנשי מקצוע במשרד)
הרקע- מדובר במערכת שהמשתמש קצה צריך להעלות תמונות מידי פעם, אני אמורה להעלות את התמונה לשמור אותה באיזושהיא דרך, ואז לפתוח אותה לבקשת המשתמש

 

[סמרקט]

לא יודעת למה את מתכוונת ענן, יש שרת IIS שאליו אנחנו מעלים את הפרויקט, וזהו זה נמצא ברשת (זה פתוח רק לאנשי מקצוע במשרד)
הרקע- מדובר במערכת שהמשתמש קצה צריך להעלות תמונות מידי פעם, אני אמורה להעלות את התמונה לשמור אותה באיזושהיא דרך, ואז לפתוח אותה לבקשת המשתמש

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

//files/2020/07/29​

 

[סמרקט]

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

 

[adin]

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

 

[סמרקט]

זה c#?
את אמורה לקבל את זה כאוביקט של File ב-Request,
אבל תלוי איך שלחת מהקליינט.
אולי תעלי את הקוד?

 

[adin]

C# כן
כמו שאמרתי מהקליינט הצלחתי רק להעלות קידוד של תמונה, השתמשתי בקוד הזה:

לא הצלחתי להעלות קובץ ממש לקליינט, ולכן גם לא שלחתי אותו לשרת

 

[סמרקט]

בעקרון input מסוג file פשוט מכיל את הקובץ.
שולחים אותו ב-FormData.
איך את שולחת קריאות לשרת מהקליינט? (fetch, axios, ajax וכדו')

 

[adin]

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

 

[סמרקט]

הקובץ נמצא לך כאן:
changeEvent.target.files[0]
פשוט צריך להעביר אותו קומפלט לשרת.

תוכלי להעתיק לפה את הקוד שמבצע את הפניה לשרת?

אגב, השרת מחזיר JasonResult.

 

[RRRRR]

את יכולה להפוך את התמונה לבינארי ולשמור את הטקסט בטבלה
אולי מגיע לך קוד בינארי

אולי זה יעזור לך נראה מה שאת מחפשת

AngularJS: how to implement a simple file upload with multipart form?

I want to do a simple multipart form post from AngularJS to a node.js server, the form should contain a JSON object in one part and an image in the other part, (I'm currently posting only the JSON ...

stackoverflow.com

 

[סמרקט]

באופן הזה, איך מטפלים בסיומות שונות של תמונות? (png, jpeg וכו')

 

[ביגר]

נראה שאת מקבלת את הקובץ כbase64
את צריכה בשרת להמיר את זה לבינארי ואז לשמור

 

[ביגר]

באופן הזה, איך מטפלים בסיומות שונות של תמונות? (png, jpeg וכו')

אפשר עם ImageFormat

 

[סמרקט]

אפשר עם ImageFormat

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

 

[ביגר]

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

צודקת
ועכשיו עליתי בזכותך על בעיה בקוד שלי, אני בעצם תמיד ממירה לJPG
@RRRRR לך יש רעיון איך פותרים את זה?

 

[ביגר]

צודקת
ועכשיו עליתי בזכותך על בעיה בקוד שלי, אני בעצם תמיד ממירה לJPG
@RRRRR לך יש רעיון איך פותרים את זה?

אני גם שולחת את התמונה בJSON
איך אני שולחת תמונה כקובץ בANGULAR?