• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید تا کنون 6251 نفر در 14 دوره آموزشی سون لرن ثبت نام کرده اند !

Inspector مرورگر Chrome ( قسمت نهم ) : آشنایی با تب Resources

2 2189 ۲۱ مهر ۹۳

مثل همیشه Inspector رو باز میکنیم. تب Resources به شما کمک میکنه که ، فایلهایی که دست به دست هم دادن تا صفحه روبرو ساخته بشه رو ، مدیریت کنید. همچنین این تب به شما این امکان رو میده که ، HTML5 Database , Local Storage , Session Storage , Cookie و ... رو مدیریت کنید. 1 در تب Frames تمام فایلها از قبیل CSS و Javascript و Font و تصویر و .... لیست شدن و با کلیک بر روی هر کدوم میتونیم اطلاعات و محتویاتش رو ببینیم. 2 جایی که من دورش رو کادر کشیدم ، دامین ( Domain ) سایت قرار داره و با کلیک کردن روی مثلث کنار اون ، تمام محتویاتش نمایش داده میشه. اگر فایلهای CSS و Javascript و HTML و ... که به صورت کد هستند رو روشون کلیک کنید ، در بخش سمت راست کدها به نمایش در میان. 3 مثلا من روی www.7learn.com کلیک میکنم ، از اونجایی که یک فایل HTML است ، در سمت راست کدهای درون اون به نمایش در میان. بصورت زیر : 4 اگر بر روی فونتها کلیک کنید ، نمایی کلی از اون فونت رو خواهید دید : 5 اگر روی تصاویر کلیک کنید ، اون تصویر به نمایش در میاد و در زیر اون اطلاعاتی در مورد اون در اختیارتون قرار میگیره. 6

  1. نام تصویر
  2. ابعاد تصویر
  3. سایز تصویر
  4. نوع تصویر که در اینجا از نوع gif هست
  5. آدرس این تصویر رو در اختیارتون قرار میده

7 در بخش Cookies میتونین کوکی هایی که از سرور دریافت شده رو ببینید. مثلا من بر روی www.7learn.com کلیک میکنم. 8

  1. نام کوکی
  2. مقدار هر کوکی
  3. دامنه ای که کوکی باید برای آن ارسال شود
  4. مرورگر کوکی را برای درخواستهایی که در این مسیر از سرور یا زیر مجموعه های آن قرار داشته باشند ، ارسال خواهد کرد
  5. تاریخ انقضای هر کوکی
  6. سایز هر کوکی
  7. اگه این قسمت تیک داشته باشه ، یعنی اینکه کوکی فقط به سرور فرستاده میشه و از طریق Javascript در مرورگر قابل دسترسی نیست. این کار خطر حملات XSS رو کاهش میده.
  8. اگر این قسمت تیک داشته باشه ، کوکی فقط برای اتصالهای امن ( پروتکل HTTPS ) ارسال خواهد شد.
  9. کوکی هارو Refresh میکنه
  10. همه کوکی هارو پاک میکنه
  11. فقط همون کوکی که انتخاب شده هست رو حذف میکنه

9 دو موردی که در بالا براتون مشخص کردم ، فرمت برای ایجاد کردن پایگاه داده های Local ( محلی ) هست. یعنی ما میتونیم با استفاده از یک سری از API های جاوااسکریپت ، یک سری از اطلاعات رو بر روی مرورگر کاربر ذخیره کنیم و در مراجعات بعدی کاربر به سایت ، از اون اطلاعات استفاده کنیم. این امکان مربوط به HTML5 هست. این سایت میتونه نمونه خوبی برای شما باشه. 10 وقتی روی دکمه New Note کلیک میکنیم ، یک باکس باز میشه که میتونین در اون یادداشت کنید و میتونین با Drag & Drop مکان اون رو تغییر بدین : 11 حالا اگه Inspector  رو باز کنید ، میبینید که موارد زیر اضافه شده است : 12 همونطور که میبینید یک پایگاه داده به نام NoteTest و یک جدول بنام WebKitStickeNotes ساخته شده. اگر روی اون جدول کلیک کنید ، اطلاعات درونش نمایش داده میشه : 13 در قسمت Note ، یادداشتی که نوشتیم قرار میگیره ، زمان ایجاد ، فاصله از چپ و بالا و z-index اون هم نمایش داده میشه و در پایگاه داده ذخیره میشه. در قسمت پایین و سمت چپ هم میتونیم این جدول رو Refresh کنیم.

این اطلاعات بر روی مرورگر ذخیره شده ، حالا اگر این سایت رو ببندید و دوباره وارد بشید ، میبینید که هنوز اون یادداشته وجود داره و از بین نرفته و اطلاعات رو از روی مرورگر دوباره میخونه.

IndexedDB هم تقزیبا شبیه به Web SQL هست. دیگه در مورد اون توضیح نمیدم. اینو هم بگم که پایگاه داده های Local خیلی امنیت ندارند و راحت میشه اونارو دستکاری کرد. پس نباید اطلاعات مهم رو درون اونا ذخیره کنیم. در اینجا هم میتونین یک مثال خوب از کاربرد IndexedDB ببینید.

Local Storage و Session Storage هم تقریبا کاربردشون همینطوریه ولی روششون متفاوته. این لینک و این لینک رو هم ببینید.

Application cache هم مثل cache خود مرورگر هست با یک سری تفاوت. این امکان هم در HTML 5 اضافه شده. برای مطالعه بیشتر به این لینک مراجعه کنید.

خب دوستان خسته نباشید.

موفق باشید. یا علی

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها 2 دیدگاه برای این مطلب ارسال شده است.

  • ‏‏
    رامین(۳ مهر ۱۳۹۴)

    عالی بود دستتون درد نکنه
    خسته نباشید

  • ارسال دیدگاه

    ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

    :: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
    برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
    عضویت/ ورود سریع با :
    در حال اتصال ...

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram