Android WebView not loading a JavaScript file, but Android Browser loads it fine
Asked Answered
J

1

15

I'm writing an application which connects to a back office site. The backoffice site contains a whole slew of JavaScript functions, at least 100 times the average site. Unfortunately it does not load them, and causes much of the functionality to not work properly. So I am running a test. I put a page out on my server which loads the FireBugLite javascript text. Its a lot of javascript and perfect to test and see if the Android WebView will load it. The WebView loads nothing, but the browser loads the Firebug Icon. What on earth would make the difference, why can it run in the browser and not in my WebView? Any suggestions.

More background information, in order to get the stinking backoffice application available on a Droid (or any other platform except windows) I needed to trick the bakcoffice application to believe what's accessing the website is Internet Explorer. I do this by modifying the WebView User Agent.

Also for this application I've slimmed my landing page, so I could give you the source to offer me aid.

package ksc.myKMB;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.app.ProgressDialog;
import android.content.DialogInterface;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.Window;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebSettings; 
import android.webkit.WebViewClient;
import android.widget.Toast;

public class myKMB extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState); /** Performs base set up */

        /** Create a Activity of this Activity, IE myProcess */
        myProcess = this;

        /*** Create global objects and web browsing objects */
        HideDialogOnce = true;
        webview = new WebView(this) {

        };
        webChromeClient = new WebChromeClient() {
         public void onProgressChanged(WebView view, int progress) {
                // Activities and WebViews measure progress with different scales.
                // The progress meter will automatically disappear when we reach 100%
          myProcess.setProgress((progress * 100));
          //CreateMessage("Progress is : " + progress);
              }
        };
        webViewClient = new WebViewClient() {
          public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                 Toast.makeText(myProcess, MessageBegText + description + MessageEndText, Toast.LENGTH_SHORT).show();
               }  
          public void onPageFinished (WebView view, String url) {
              /** Hide dialog */
           try {
           // loadingDialog.dismiss();  
           } finally {

           }

           //myProcess.setProgress(1000);
           /** Fon't show the dialog while I'm performing fixes */
              //HideDialogOnce = true;
view.loadUrl("javascript:document.getElementById('JTRANS011').style.visibility='visible';");

          }

          public void onPageStarted(WebView view, String url, Bitmap favicon) {

       if (HideDialogOnce == false) {
         //loadingDialog = ProgressDialog.show(myProcess, "", 
                //   "One moment, the page is laoding...", true);
       } else {
        //HideDialogOnce = true;
       }
      }

    };


    getWindow().requestFeature(Window.FEATURE_PROGRESS);
            webview.setWebChromeClient(webChromeClient);
    webview.setWebViewClient(webViewClient);
    setContentView(webview);


    /** Load the Keynote Browser Settings */
    LoadSettings();
    webview.loadUrl(LandingPage);


}

    /** Get Menu */
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
     MenuInflater inflater = getMenuInflater();
     inflater.inflate(R.menu.menu, menu);
     return true;
    }

    /** an item gets pushed */
    @Override
 public boolean onOptionsItemSelected(MenuItem item) {
  switch (item.getItemId()) {
  // We have only one menu option
  case R.id.quit:
   System.exit(0);
   break;
  case R.id.back:
   webview.goBack();
  case R.id.refresh:
   webview.reload();
  case R.id.info:
   //IncludeJavascript("");
  }
  return true;
 }


/** Begin Globals */
public WebView webview;
public WebChromeClient webChromeClient;
public WebViewClient webViewClient;
public ProgressDialog loadingDialog; 
public Boolean HideDialogOnce; 
public Activity myProcess;
public String OverideUserAgent_IE = "Mozilla/5.0 (Windows; MSIE 6.0; Android 1.6; en-US) AppleWebKit/525.10+ (KHTML, like Gecko) Version/3.0.4 Safari/523.12.2 myKMB/1.0";
public String LandingPage = "http://kscserver.com/main-leap-slim.html";
public String MessageBegText = "Problem making a connection, Details: ";
public String MessageEndText = " For Support Call: (xxx) xxx - xxxx.";

public void LoadSettings() {

 webview.getSettings().setUserAgentString(OverideUserAgent_IE);
 webview.getSettings().setJavaScriptEnabled(true);
 webview.getSettings().setBuiltInZoomControls(true);
 webview.getSettings().setSupportZoom(true);
}

/** Creates a message alert dialog */
public void CreateMessage(String message) {

 AlertDialog.Builder builder = new AlertDialog.Builder(this);
 builder.setMessage(message)
        .setCancelable(true)
        .setNegativeButton("Close", new DialogInterface.OnClickListener() {
          public void onClick(DialogInterface dialog, int id) {
           dialog.cancel();
          }
        });
 AlertDialog alert = builder.create();
 alert.show();
}


}

The background Application is my app, running in an emulator. The top application is the browser. You'll see the browser has the firebug icon, and can activate the firebug, but the application does not have the firebug icon. http://img413.imageshack.us/img413/9628/myapp.gif

My Application is running in the background, and as you can see no Firebug in the lower right hand corner. However the browser (the emulator on top) has the same page but shows the firebug. What am I doing wrong? I'm assuming its either not enough memory allocated to the application, process power allocation, or a physical memory thing. I can't tell, all I know is the results are strange.

I get the same thing form my android device, the application shows no firebug but the browser shows the firebug.

I already have JavaScript on the web browser on, the problem is the web view is acting to different from the web browser.

Jennijennica answered 3/6, 2010 at 19:4 Comment(3)
"I already have JavaScript on the web browser on" - Does that mean that you called setJavaScriptEnabled(true) on the settings of your webview? (just to make sure...)Crumb
Yes its in my void LoadSettings() Which I call before I Load a page after it has been added to the view.Jennijennica
No i tested that it works in the android browser, I need it to work inside my application. Somehow some (not most) Javascript is not being loaded. If you are no navigate to kscserver.com/main-leap-slim.html with the android browser the FireBug is click able, but in my application it is not showing but the Javascript Pop-Up map still works.Jennijennica
M
5

Works just great for me. I can see FireBug icon in WebView.

This line is evil, I guess you should remove it:

webview.getSettings().setUserAgentString(OverideUserAgent_IE);
Montpelier answered 11/6, 2010 at 2:43 Comment(6)
That's the sole purpose of this application it needs to override the user agent field in order to display the back office application. "More background information, in order to get the stinking backoffice application available on a Droid (or any other platform except windows) I needed to trick the bakcoffice application to believe what's accessing the website is Internet Explorer. I do this by modifying the WebView User Agent."Jennijennica
So is what your saying, because I'm modifying the User Agent it affects the way Javascript is displayed? Doubtful, remember I'm using the firebug as a test, the backoffice has hundreds of JavaScript functions which are not being loaded at all. The Firebug was the closets thing I have to test without giving people access to the backoffice system. Ultimately I need a way to override the UserAgent Field and still have access to the full JavaScript Functionality.Jennijennica
FireBug analyses user-agent and behaves accordingly. If you say you're IE FireBug does some things in IE-specific way that doesn't work for Android WebView. You can see it yourself - if you remove fake user-agent FireBug will do those things the default way and you'll see the icon. So I'm afraid you'll have to analyse your scripts and find those things that they do in IE-specific way.Montpelier
Your right, interesting... that means this is going to be quite difficult than I had first thought. I had just thought that since the Backoffice was built on old technology (it prohibits another browser except IE), but it is quite possible that the Scripts refer to IE objects that don't exists in another browser (such as Chrome). Great, now I'm back to where I started. Drat. Any Idea on where I'd start? I guess Android Webview's are the same as the browser, which is neat because in other operating systems the objects similar to webview's are a constrained form of the browser. Thank you!Jennijennica
WebView is the same as browser. The difference between your application and the browser is that your application sends fake user-agent while browser doesn't.Montpelier
I know that, but in this case it needs to mock IE. I still have a problem, but its just a different one. My application is going to have to work with or modify the JavaScript it is loading to work inside the environment while it mocks the User Agent Field. As I have mentioned, the backoffice constrains itself to IE, which makes it nearly impossible to view on mobile browsers. (I tried to fix the backoffice but couldn't, its routed somewhere deep in the server. :( )Jennijennica

© 2022 - 2024 — McMap. All rights reserved.