Android WebView does not load URL?

Question

I have an Android WebView which should load the following URLs:

https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655

https://buchung.salonmeister.de/place/#offer-details-page?id=907599&venueId=301655

Here is what I did:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@android:color/holo_orange_light"
                tools:context=".MainActivityFragment">



    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_margin="5dp"
        android:layout_above="@+id/progressBar"></WebView>


    <ProgressBar
        android:id="@id/progressBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:visibility="invisible"
        style="?android:attr/progressBarStyleHorizontal"/>

    <TextView
        android:id="@+id/titleView"
        android:text="@string/hello_world"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</RelativeLayout>

In onCreateView() :

  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container,
                           Bundle savedInstanceState) {
       View v = inflater.inflate(R.layout.fragment_main, container, false);

        String url = // some url
        final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
        progressBar.setMax(100);

        final TextView titleView = (TextView)v.findViewById(R.id.titleView);


        mWebView = (WebView)v.findViewById(R.id.webView);
        mWebView.getSettings().setJavaScriptEnabled(true);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.getSettings().setAllowContentAccess(true);

        mWebView.setWebViewClient(new WebViewClient() {
          @Override
          public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
          }
        });

        mWebView.setWebChromeClient(new WebChromeClient() {
          @Override
          public void onProgressChanged(WebView view, int progress) {
            if (progress == 100) {
              progressBar.setVisibility(View.INVISIBLE);
              progressBar.setProgress(0);
            } else {
              progressBar.setVisibility(View.VISIBLE);
              progressBar.setProgress(progress);
            }
          }

          @Override
          public void onReceivedTitle(WebView view, String title) {
            titleView.setText(title);
          }
        });
        mWebView.loadUrl(url);

        return v;
}

The screen is empty when I start my activity.

Note: This is not a layout issue. Please do not comment on layout and focus on the real problem.

How can I load the above urls in a WebView?

Edit: Here are the permissions I gave:

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
    <uses-permission android:name="android.permission.GET_ACCOUNTS" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

Edit:

In my console I get the following:

I/chromium: [INFO:CONSOLE(84)] "undefined", source: https://buchung.salonmeister.de/place/ (84)

09-13 15:12:33.230 28407-28407/de.test.webviewtest I/chromium: [INFO:CONSOLE(1)] "Uncaught Error: Script error for: widget/venue-menu/mobile/venue-menu-app
09-13 15:12:33.230 28407-28407/de.test.webviewtest I/chromium: http://requirejs.org/docs/errors.html#scripterror", source: https://buchung.salonmeister.de/javascript-module/1.162.3/thirdparty/require.2.1.10.js (1)

Answer 1

The first problem is you have to swap the position of ProgressBar and WebView.

<ProgressBar
    android:id="@id/progressBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:visibility="invisible"
    style="?android:attr/progressBarStyleHorizontal"/>

<WebView
    android:id="@+id/webView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    android:layout_alignParentBottom="true"
    android:layout_margin="5dp"
    android:layout_above="@id/progressBar"/> 

The second problem is this line:

android:layout_above="@+id/progressBar"

Inside a RelativeLayout, you must have the view id declared in advance, so that another view can be layouted above(right, left is the same way) to.

And again is the same line:

android:layout_above="@+id/progressBar"

Inside a RelativeView, a view can not layout above(or to below, to left to right) to an ID which is generated for nothing.

You do

@+id/progressBar

the IDE will auto-generate a new ID, this ID is not the same ID of you mean the WebView to layout above to. And in your ProgressBar declaration, you @+id/progressBar again, which it will re-generate another id.

So, your WebView is layouted above to nothing, you can not even see the WebView, it may loads the URLs, and you just can't see it.

Good luck.

Answer 2

Your URL is https so It's ssl problem.

You can find a solution in other question .

mWebView.setWebViewClient(new WebViewClient() {

    @Override
    public boolean shouldOverrideUrlLoading(WebView view, String url) {
        view.loadUrl(url);
        return true;
    }

    @Override
    public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) {
        handler.proceed(); // Ignore SSL certificate errors
    }
});

Answer 3

if you want you can try to use Indeterminate Progress Bar Example and remove setWebChromeClient try this code :

public class WebViewActivityFragment extends Fragment {

 public WebViewActivityFragment() {
 }

 @Override
 public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    //return inflater.inflate(R.layout.fragment_web_view, container, false);

    View v = inflater.inflate(R.layout.fragment_web_view, container, false);

    final String url = "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655";//"https://google.com.vn";
    final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
    progressBar.setMax(100);
    progressBar.setVisibility(View.GONE);
    final TextView titleView = (TextView)v.findViewById(R.id.titleView);
    WebView mWebView = (WebView) v.findViewById(R.id.webView);
    mWebView.setInitialScale(1);
    mWebView.getSettings().setLoadWithOverviewMode(true);
    mWebView.getSettings().setUseWideViewPort(true);
    mWebView.getSettings().setJavaScriptEnabled(false);
    mWebView.getSettings().setAllowFileAccess(true);
    mWebView.getSettings().setAllowContentAccess(true);
    mWebView.setScrollbarFadingEnabled(false);
    mWebView.setWebViewClient(new WebViewClient() {
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return false;
        }

         @Override
        public void onPageFinished(WebView view, String url) {
         progressBar.setVisibility(View.GONE);
         progressBar.setProgress(100);
         super.onPageFinished(view, url);
        }

        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) {
         progressBar.setVisibility(View.VISIBLE);
         progressBar.setProgress(0);
         super.onPageStarted(view, url, favicon);
        }
    });


    mWebView.loadUrl(url);

    return v;
}

}

Answer 4

UPDATE: with setJavaScriptEnabled(false); , the Url "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655" can displayed successfully in the WebView.

public class WebViewActivityFragment extends Fragment {

    public WebViewActivityFragment() {
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        //return inflater.inflate(R.layout.fragment_web_view, container, false);

        View v = inflater.inflate(R.layout.fragment_web_view, container, false);

        final String url = "https://buchung.salonmeister.de/ort/301655/menue/#offerId=907601&venueId=301655";//"https://google.com.vn";
        final ProgressBar progressBar = (ProgressBar)v.findViewById(R.id.progressBar);
        progressBar.setMax(100);
        final TextView titleView = (TextView)v.findViewById(R.id.titleView);
        WebView mWebView = (WebView) v.findViewById(R.id.webView);
        mWebView.setInitialScale(1);
        mWebView.getSettings().setLoadWithOverviewMode(true);
        mWebView.getSettings().setUseWideViewPort(true);
        mWebView.getSettings().setJavaScriptEnabled(false);
        mWebView.getSettings().setAllowFileAccess(true);
        mWebView.getSettings().setAllowContentAccess(true);
        mWebView.setScrollbarFadingEnabled(false);
        mWebView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                return false;
            }
        });

        mWebView.setWebChromeClient(new WebChromeClient() {
            @Override
            public void onProgressChanged(WebView view, int progress) {
                if (progress == 100) {
                    progressBar.setVisibility(View.INVISIBLE);
                    progressBar.setProgress(0);
                } else {
                    progressBar.setVisibility(View.VISIBLE);
                    progressBar.setProgress(progress);
                }
            }

            @Override
            public void onReceivedTitle(WebView view, String title) {
                titleView.setText(title);
            }


        });
        mWebView.loadUrl(url);

        return v;
    }
}

I have used your entire code, here my web view result. I think perhaps that website is not mobile-ready because I tried to open your 2 urls in web browser in my phone the same problem (still loading...)

Answer 5

This may solve your issue :

webView.post(new Runnable() {
    @Override
    public void run() {
        webView.loadUrl(url);
    }
});

Answer 6

I encountered the same issue. Setting useWideViewPort from the WebView's settings to true fixed the issue. WebView#getSettings().setUseWideViewPort(true);

Answer 7

The following 2 solutions might help you.

1. Cross check you have added Internet permission in AndroidManifest.xml

   <uses-permission android:name="android.permission.INTERNET" />

2. If you are using an emulator then check the internet is working or not. If not then you can try wipe the data of the emulator and check.

Answer 8

确保将所有权限都放在应用程序标记之外的menifest文件中。