در مقاله پیش رو سعی داریم شما خوانندگان عزیز را با مفهوم اپلیکیشن وب ویو و مسائلی که پیرامون آن وجود دارد آشنا کنیم. امید است تا پایان این مقاله همراه ما باشید.

تعریف اپلیکیشن وب ویو(Application Webview): وب ویو یک برنامه کاربری ساده می­باشد که با استفاده از یک مرورگر داخلی، وب سایت شما را به عنوان صفحه اصلی خود نمایش می­دهد و کاربران قادرند درون خود اپلیکیشن در داخل وب سایت شما به جست­جو بپردازند.

اپ کارا یک سرویس آنلاین می­باشد که برای ساخت اپلیکیشن وب ویو پیشرفته، برای سایت­هایی که ریسپانسیو(Responsive) و یا واکنش­گرا می­باشند و یا به عبارتی دارای نسخه موبایل هستند به کار می­رود. در این روش نسخه موبایل وب سایت شما با همان امکاناتی که دارد به اپلیکیشن اندروید تبدیل می­شود و مشابه یک مرورگر عمل می­نماید. برای استفاده از این سرویس تنها آدرس سایت مورد نظر نیاز بوده و نیازی نیست که وب سایت کنونی شما تغییر، بارگذاری و یا حتی مجدداً کدنویسی گردد.  

وب ویو چیست؟

نمایش صفحات وب بر روی یک اپلیکیشن اندروید یا ios کاری است که وب ویو (Webview) انجام می­دهد. با استفاده از وب ویو می­توانید سایت خود را به صورت آنلاین بر روی گوشی بارگذاری کنید. حتی بدون اتصال به اینترنت هم قادرید سایت خود را داخل گوشی لود نمائید! همان­طور که گفته شد توسط وب ویو می­توانید صفحات سایت خود را بدون این­که به اینترنت وصل باشید به مخاطبین خود نشان دهید. به عبارت دیگر می­توان گفت که وب ویو (Webview) نوعی نمایش می­باشد که صفحات وب را درون برنامه شما نشان می­دهد. از این سرویس برای تبدیل سایت های وردپرس به اپلیکیشن و دیگر سیستم های مدیریت محتوا استفاده می گردد.

اپلیکیشن وب ویو چیست؟

شما قادر هستید که رشته HTML را معین کنید و توسط وب ویو آن را درون برنامه خود به نمایش بگذارید. در حقیقت کاری که Webview انجام می­دهد این است که برنامه شما را به برنامه وب تبدیل می­نماید و صفحات وب را برای شما نشان می­دهد. افزون بر این می­توان گفت که وب ویو یکی از ویوهای کاربردی پلتفرم(Platform) اندروید محسوب می­شود که با استفاده از آن می­توانید یک صفحه وب آنلاین و یا حتی آفلاین را داخل یک Activity (کار، فعالیت) به کاربر نشان دهید. دقیقاً مشابه این­که وب سایتی را در مرورگری همچون Chrome باز می­کنید البته باید گفت که تفاوتی هم با آن دارد و آن، این است که کاربر، صفحه وب را داخل برنامه می­بیند و به مرورگری مستقل انتقال پیدا نمی­کند.

در وب ویو امکان این امر وجود دارد که محتوای دریافتی از صفحه وب کنترل گردد. به طور مثال می­توانید مشخص کنید که کدهای جاوا اسکریپت که در طراحی صفحات وب با کدهای HTML ترکیب می­گردند امکان این­که اجرا شوند را داشته باشند یا نه.

در حالت کلی می­توان گفت که:

  • برای ساختن نسخه وب ویونیاز به دانش برنامه نویسی بالا ندارید و می­توانید آن را در عرض چند ساعت بسازید.
  • اپلیکیشنی که با Webview نوشته شده است همانند یک مرورگر عمل می­نماید.
  • با استفاده از وب ویو می­توانید برای همه افرادی­که اپلیکیشن شما را بر روی گوشی موبایلشان نصب نموده­اند، نوتیفیکیشن ارسال نمائید.
  • بدون صرف هزینه و یا زمان زیاد می­توانید نسخه اپلیکیشن اندروید و ios وب سایت خود را توسط وب ویو بسازید.

   علاوه بر تمامی موارد ذکر شده می­توان اذعان کرد که Webview افزون بر این­که وب سایت شما را به صورت یک اپلیکیشن به مخاطبین نمایش می­دهد در صورتی­که از نسخه آنلاین آن استفاده نمائید سبب می­شود که رتبه سایت شما در موتورهای جست­و­جو افزایش یابد چرا که هر بار که کاربری با استفاده از اپلیکیشن، سایت شما را بررسی می­کند در حقیقت سایت شما را می­بینید و به عنوان فردی که از سایت شما دیدن می­کند به حساب می­آید بنابراین می­توان گفت که وب ویو بازدیدکنندگان سایت شما را افزایش می­دهد و از این طریق موجب می­شود رتبه سایت شما افزایش پیدا کند. علاوه بر این­ها شما می­توانید تبلیغات درون برنامه­ای را در نسخه Webview به انجام برسانید.

وب ویو در اندروید و ios

   دستگاه­های هوشمند اندرویدی از بازی­ها و همچنین برنامه ­های مختلفی بر روی اسمارت فون خود بهره می­برند که هر کدام از آن­ها دارای وظیفه ­ای هستند. در بین این نرم افزارها تعدادی از آن­ها از برنامه­ های اصلی سیستم عامل به شمار می­آیند بنابراین اگر غیر فعال باشند قسمتی از دستورات اجرا نخواهند شد و حتی تعداد زیادی از دستورات هم با خطا مواجه خواهند گردید. گاهی اوقات این خطاها به اندازه­ای ادامه می­یابند که کاربر تصور می­کند قطعه ­ای از گوشی همراهش اشکال پیدا کرده است.

در صورتی که باید گفت این چنین نیست و احتمالاً فقط یک ابزار خاص به روز نشده است. در این حین از بین تمامی مولفه­ های اصلی سیستم عامل که تا به امروز گوگل منتشر کرده است، شماری از آن­ها جزو مهم­ترین­ها محسوب می­گردد. یکی از این مولفه ­ها اندروید سیستم وب ویو( Android System WebView) است که عنوان جزئی اصلی از سیستم عامل می­باشد که جهت نمایش دادن محتوای وب در برنامه­ ها مورد استفاده قرار می­گیرد و Google LLC آن را منتشر نموده است. همان­طور که مستحضرید تعدادی از نرم افزارهای اندرویدی در قسمتی از خود به سایت توسعه ­دهنده­اشان متصل می­شوند و اطلاعاتی که لازم بوده و مورد نیاز می­باشد برای کاربران نشان می­دهند که البته بایستی بدانید نمایش این قبیل از صفحات توسط اندروید سیستم وب ویو انجام می­گیرد و هر چیزی را به راحتی به نمایش می­گذارد.

وب ویو در اندروید

لازم به ذکر است که این ابزار خاص از کروم قدرت گرفته است و سعی دارد که بتواند هر چیزی را به طور صحیح و با نهایت کیفیت به نمایش درآورد. افزون بر همه این­ها در صورتی­که این اپلیکیشن بروز نباشد بسیاری از اپلیکیشن­هایی که دارید با مشکلاتی مواجه خواهند شد پس به شما توصیه می­کنیم هرچه سریع­تر آن را بروز کنید تا بتوانید تجربه­ای جدید در مشاهده محتوای وب کسب کنید.

همان­طور که در بالا هم اشاره شد اپلیکیشن سیستم اندروید وب ویو به عنوان جزئی اصلی از سیستم عامل اندروید بوده که تا به امروز توانسته است توجه بیش از 5 میلیارد کاربر مختلف را جلب نماید. لازم به ذکر است که این اپلیکیشن موفق به اخذ امتیاز 4/4 از 5 توسط کاربران در گوگل پلی شده است. شما هم می­توانید جدیدترین نسخه اصلی این اپلیکیشن را بدون کوچکترین تبلیغاتی از وب سایت معروف و بااعتبار فارسروید دریافت کنید.

در نهایت می­توان گفت که در اندروید، Webview صفحات وب شما را در قالب برنامه APK اندرویدی در اختیار شما قرار می­دهد. از این رو موارد مورد استفاده وب ویو، به نمایش درآوردن وب سایت و همچنین کدهای Html می­باشد.

کاربردهای وب ویو در اندروید

   وب ویو کاربردهای زیادی دارد. یکی از کاربردهایی که می­توان برای Webview نام برد نمایش دادن نقشه­ های آنلاین همچون Google Maps می­باشد. چنانچه می­خواهید محل شرکت خود را روی نقشه­ای نشان دهید، استفاده از وب ویو یکی از گزینه­ هایی است که پیش روی شما قرار دارد که هم ساده بوده و هم در دسترس می­باشد و می­توانید به راحتی از آن استفاده کنید. از کاربرد دیگر وب ویو می­توان به نمایش محتواهایی که مرتباً در حال تغییر و همچنین بروز رسانی می­باشند اشاره کرد. شماری از اپلیکیشن­های مورد توجه از قبیل اینستاگرام به منظور نمایش متن"شرایط و قوانین استفاده از اپلیکیشن" از وب ویو بهره می­برند. بنابراین کاربر با مراجعه به این صفحه(Activity) متن قوانین را به صورت آنلاین و آپدیت شده از سرورهای اینستاگرام اخذ می­کند. مزیتی که این روش دارد این است که به منظور اصلاح و آپدیت متن نیاز به ایجاد تغییراتی داخل برنامه و همچنین انتشار نسخه جدیدی نیست و کاربر بدون این­که اپلیکیشن را آپدیت نماید هر دفعه که تصمیم دارد قوانین برنامه را مطالعه کند آخرین نسخه را می­بیند.

به عنوان مثالی دیگر تصور کنید که یک وب سایت فروشگاهی راه اندازی نموده ­اید و به دلایلی اعم از هزینه زیاد، زمان کم و ... امکان این­که اپلیکیشن کامل آن را بسازید برایتان وجود ندارد. در این زمان است که می­توانید به آسانی همان وب سایت را در قالب یک اپلیکیشن موبایلی به کاربر ارائه کنید. این کار دقیقاً مشابه این است که کاربر وارد مرورگری شده است و آدرس وب سایت شما را وارد کرده است. البته تفاوت آن در این است که نیازی نیست که آدرس را وارد نماید و به محض این­که برنامه را اجرا کرد وب سایت بارگذاری می­شود. برای مثال می توان یک سایت پرستا شاپ را به اپلیکیشن اندروید تبدیل نمود.

نکته قابل توجهی که حتماً بایستی آن را در نظر داشته باشید این است که استفاده کردن از این قابلیت به منظور نمایش دادن یک وب سایت کامل به صورت یک اپلیکیشن موبایلی، راه حل استانداردی نبوده و تجربه کاری مقبولی را رقم نخواهد زد. زمانی­که هیچ گزینه دیگری پیش رو ندارید از این راهکار استفاده نمائید. در این صورت بایستی وب سایت برای انواع صفحات نمایش بهینه شده باشد به عبارتی باید طراحی آن به صورت واکنش­گرا باشد.

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

همان­طور که در بالا هم ذکر شد وب ویو یکی از ویوهای کاربردی پلتفرم(Platform) اندروید محسوب می­شود و از طریق پیوند مناسب وب با ساختار Dynamic(پویا)، اپلیکیشن تا حدی که ممکن است امکان دستکاری و همچنین تغییردهی را در این محیط برای برنامه نویسان فراهم می­نماید. به طور مثال با پیاده سازی متدهایی که مورد نیاز است برنامه نویس می­تواند فرایند شروع، بارگذاری، پایان یافتن بارگذاری و خطاها را به درستی مدیریت نماید. بنابراین چنانچه تمایل دارید به عنوان بخشی از رابط کاربر خود، HTML را نشان دهید می­توانید در اپلیکیشن خود از وب ویو بهره ببرید. در ادامه نحوه ساخت اپلیکیشن وب ویو در اندروید استودیو شرح داده شده است.

قبل از این­که شروع به ساخت وب ویو کنید باید به این نکته توجه داشته باشید که سایت مورد نظرتان Responsive (ریسپانسیو و یا واکنش­گر) باشد به این معنی که جهت استفاده در تمامی مرورگرها و نیز دستگاه­هایی از قبیل موبایل و تبلت که مورد استفاده کاربران قرار می­گیرد مناسب باشد.

 

پس اولین گام شما داشتن سایتی واکنش­گرا است.

نکته­ای که باید در نظر داشته باشید این است که تیم­های کاری جهت ریسپانسیو نمودن سایت­ها وجود دارند که در صورت ریسپانسیو نبودن سایتتان می­توانید از آن­ها کمک بگیرید. یکی از سایت­هایی که این کار را برای شما انجام می­دهد سایت"موبی سافت" است.

گام دوم: یک پروژه جدید در Android Studio بسازید. برای این کار نرم افزار را باز کنید و مطابق تصویری که در شکل زیر مشاهده می­کنید از منوی File گزینه New را انتخاب کنید و از تب باز شده گزینه New Project را انتخاب کنید.

در بخش Application name نام WebViewApp برای پروژه خود انتخاب کنید.

گام سوم: در این مرحله بایستی رابط کاربری ایجاد کنید و وب ویو را به آن اضافه کنید. به این منظور مسیر  Open res -> layout -> activity_main.xml (or) main.xml را دنبال کنید.

 

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"   android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.webviewapp.MainActivity"> <WebView        android:id="@+id/webview"        android:layout_width="match_parent"        android:layout_height="match_parent" /></RelativeLayout>

 

 

گام چهارم: بارگذاری نشانی وب سایت؛ در این مرحله باید جاوا اسکریپت را فعال کنید(مسیر زیر را دنبال کنید) و نشانی وب سایت را داخل برنامه بارگذاری نمائید.

 Open src -> package -> MainActivity.java

توجه کنید در کدی که در زیر آورده شده است می­توانید نشانی هر وب سایتی را به برنامه بدهید تا آن وب سایت به اپلیکیشن تبدیل گردد.

package com.example.webviewapp;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;        import android.webkit.WebSettings;        import android.webkit.WebView;        import android.webkit.WebViewClient;public class MainActivity extends AppCompatActivity {    private WebView mywebView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mywebView = (WebView) findViewById(R.id.webview);        WebSettings webSettings= mywebView.getSettings();        webSettings.setJavaScriptEnabled(true);        mywebView.loadUrl("https://نام سایت مورد نظر/");    }}

 

 

گام پنجم: فایل AndroidManifest.xml را باز کنید و سپس مجوز استفاده از بسته اینترنت را به آن بیفزائید. علت این کار هم این است که برنامه به صورت آنلاین از سایت بارگذاری گردد.

گام ششم: چنانچه تا گام پنجم را به درستی انجام داده باشید و برنامه را اجرا کرده باشید خواهید فهمید که لینک­ها در خود مرورگر باز می­شوند نه در درون نرم افزار. برای رفع این مشکل کدی که در ادامه آورده شده است در کلاس MainActivity.java بیفزائید.

mywebView.setWebViewClient(new WebViewClient());

گام هفتم: افزودن دکمه بازگشت به برنامه؛ برای این­که دکمه برگشت به برنامه داشته باشید در کلاس MainActivity.java کدهای زیر را بیفرائید.

public void onBackPressed() {        if(mywebView.canGoBack())        {            mywebView.goBack();        }         else{            super.onBackPressed();        }    }

گام هشتم: حذف کردن پدینگ­ها: برای این­که پدینگ­های بالا، پایین، چپ و راست را حذف کنید activity_main.xml را باز کنید و کدی که در ادامه آورده شده است را وارد نمائید.

activity_main.xml:

 

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:id="@+id/activity_main"    android:layout_width="match_parent"    android:layout_height="match_parent"    tools:context="com.example.webviewapp.MainActivity"> // WebView Element    <WebView        android:id="@+id/webview"        android:layout_width="match_parent"        android:layout_height="match_parent" /></RelativeLayout>

 

 

کد کامل MainActivity.java در زیر آورده شده است.

MainActivity.java complete code:

package com.example.webviewapp;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.webkit.WebSettings;import android.webkit.WebView;import android.webkit.WebViewClient;public class MainActivity extends AppCompatActivity {    private WebView mywebView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        mywebView = (WebView) findViewById(R.id.webview);        WebSettings webSettings= mywebView.getSettings();        webSettings.setJavaScriptEnabled(true);        mywebView.loadUrl("https://mobi-soft.ir/");        // Line of Code for opening links in app        mywebView.setWebViewClient(new WebViewClient());    }//Code For Back Button@Override    public void onBackPressed() {        if(mywebView.canGoBack())        {            mywebView.goBack();        }        else        {            super.onBackPressed();        }    }}

 

چنانچه می­خواهید نوار پیش فرض اپلیکیشن را حذف نمائید با تغییر کوچکی در فایل styles.xml این امر تحقق می­یابد. جهت باز کردن فایل styles.xml مسیر  app->res->values->styles.xm را دنبال کنید و تغییر زیر را اعمال کنید.

<style name="AppTheme"parent="Theme.AppCompat.Light.NoActionBar">

در صورتی­که همه گام­های فوق را انجام دهید وب سایت شما به وب ویو تبدیل خواهد شد.

مزایا و معایب اپلیکیشن های وب ویو

اعمال تغییرات سایت در اپلیکیشن، نسخه اندروید و ios، قابلیت اتصال به Mobile App Analytics گوگل، هزینه پایین و مقرون به صرفه بودن، عدم نیاز به وب سرویس، ارسال نوتیفیکیشن، راه اندازی در کوتاه­ترین زمان ممکن، افزایش رنک(رتبه) و بازدید وب سایت و همچنین فعال سازی کش(cache) در اپلیکیشن جهت افزایش سرعت از مزایای طراحی اپلیکیشن وب ویو محسوب می­گردند.

از معایب اپلیکیشن ویو می­توان به مواردی همچون عدم توسعه آسان، تجربه کاربری نامناسب، امکانات محدود(سایت)، سرعت پایین، عدم امکان طراحی اختصاصی، عدم سازگاری مناسب با موبایل، باگ(خطا)های بیشتر و این­که سایت حتما باید ریسپانسیو(Responsive) باشد اشاره کرد.

مزایا و معایب اپلیکیشن وب ویو

تا این­جا به بررسی مسائلی که پیرامون وب ویو وجود دارد پرداختیم در ادامه بهتر است به معرفی نرم افزارهایی که جهت تبدیل وب سایت به اپلیکیشن موبایلی وجود دارد آشنا کنیم.

برنامه های تبدیل سایت به وب ویو مختلفی وجود دارد که با بهره­ گیری از آن­ها می­توانید وب سایت واکنش­گرای خود را به اپلیکیشن تبدیل کنید. از جمله این نرم افزارها می­توان به نرم افزار Website 2 APK Builder اشاره کرد که تحت ویندوز می­باشد. می­توانید این برنامه را نصب کنید و وب سایت خود را به فایل apk تبدیل کنید. افزون بر نرم افزار نام برده شده نرم افزار دیگری با عنوان ApkCreator – Web2App Pro وجود دارد که با بهره ­گیری از آن می­توانید وب سایت رپسپانسیو خود را تبدیل به اپلیکیشن موبایل کنید ولی این نرم افزارها محدودیت های زیادی دارند. افزون بر نرم افزارهای مذکور سرویس­های آنلاینی همچون اپ کارا و ... هم وجود دارند که وب سایت شما را تبدیل به نسخه اندروید می­کنند.

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

ساخت وب ویو پیشرفته

عدم پشتیبانی از بیشتر استاندارهای وب، فعال نبودن کش نرم افزار (جهت افزایش سرعت)، محدودیت­های شخصی سازی، عدم امکان درج اکشن بار و منو در خود اپلیکیشن، عدم امکان تعیین سطح دسترسی ها و پرمیشن­های مختلف، عدم باز شدن لینک­های خارجی در مرورگر خارجی، عدم امکان آپلود و دانلود فایل و ... معایبی هستند که این قبیل از برنامه ­ها و سرویس­های رایگان دارند بنابراین به شما توصیه می­کنیم از سرویس­های آنلاین معتبر که بابت این کار هزینه ه­ایی از شما اخذ می­کنند استفاده کنید و یا برنامه نویسی برای تبدیل وب سایت به اپلیکیشن اندروید اقدام کند.

وب ویو پیشرفته

سرویس اپ کارا یکی از سرویس های آنلاین برای ساخت اپلیکیشن وب ویو پیشرفته و بدون مشکلات مطرح شده بالا می باشد. شما با هزینه بسیار پایین می توانید نسخه اندروید اپ خود را با بهترین امکانات و بدون باگ دریافت نمایید.