手机android端的html5页面用ajax访问服务器，后台成功从数据库查询到值，但是前段一直调用ajax的error

最新推荐文章于 2021-08-06 17:57:44 发布

Crazy_fold

最新推荐文章于 2021-08-06 17:57:44 发布

阅读量6.8k

点赞数

CC 4.0 BY-SA版权

分类专栏： js html5 文章标签： json js html ajax 跨域

本文链接：https://blog.youkuaiyun.com/Crazy_fold/article/details/49203721

html5 同时被 2 个专栏收录

4 篇文章

订阅专栏

3 篇文章

订阅专栏

在手机Android端的HTML5页面中，使用AJAX调用服务器数据时，虽然能成功查询数据库，但前端始终触发error回调。问题根源在于跨域限制。为解决此问题，采用JavaScript调用Java代码，通过Java实现HTTP请求获取服务器数据，然后将数据回传给HTML。确保在Java中使用@JavascriptInterface注解以提高安全性，对于targetSdkVersion大于等于17的应用，别忘了添加此注解。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原来代码：

function gerflowerinfo(cateval,URL){
                  $.ajax({
                     url:URL,//不能是双引号，不然为常量
                     type:"post",
                     async:true,
                     dataType:"json",
                     //jsonp: "jsoncallback",//1.解决跨域问题，然而并卵
                     //jsonpCallback:"loginCallback",//2.<span style="font-family: Arial, Helvetica, sans-serif;">解决跨域问题，然而并卵</span>
                     data:{"cateval":cateval},
                     success:function(data){
                       alert("成功了吗？");
                      //$("#fmeans").html("成功了吗？");
                     },
                     error:function(XMLHttpRequest,textStatus,errorThrown){
					    alert(XMLHttpRequest.status);//结果为0
					    alert(XMLHttpRequest.readyState);<span style="font-family: Arial, Helvetica, sans-serif;">//结果为0</span>
					    alert(errorThrown);
				    }
                 })
             }

原来思路：html5页面的js中利用ajax访问服务器的数据，成功的话调用ajax中的success，对data数据进行处理。根据需求放到页面的标签当中。

问题：虽然参数成功传到了后台并且成功的从数据库中查询到了数据，但是返回前台时一直调用error.

问题分析：ajax的跨域局限性，手机和电脑在不同域，数据返回到前台有限制，这是ajax一直存在的问题。

解决方法：后来没办法，只能通过html调用js----->通过js----->访问java代码-------->通过java代码发送http请求服务器数据-------->返回到java，再发送给html

注意：1.

JS可以通过反射来访问其他一些内容。通过引入 @JavascriptInterface注解，则在JS中只能访问 @JavascriptInterface注解的函数。这样就可以增强安全性。

如果您的应用android:targetSdkVersion数值为17或者大于17记得添加 @JavascriptInterface 注解。

下面为关键代码段：

html中：

标签：<li><a href="javascript:test('1');"><img src="../img/ssfw6.jpg" alt="季节"><h3>季节</h3></a></li>

js：

function test(index)
            {
                action.setParam(index);//通过注解得到的
                action.findflower();//调用java里面的方法
            }

Activity中：

 twebview.addJavascriptInterface(new DemoJavaScriptInterface1(), "action");
        twebview.loadUrl("file:///android_asset/html/taohua.html");

2.msg用来将服务器的数据发送给html

FinalAttribute.taomHandler=new Handler(){//定义的全局变量
            @Override
            public void handleMessage(Message msg) {
                if (msg.what==1)
                {
                    String content=msg.obj.toString();
                    DemoJavaScriptInterface1 ds= new DemoJavaScriptInterface1(content);//这个content就是从后台获取的json数据
                    ds.setParam(FinalAttribute.cate);//这个是分类id
                    //twebview.removeJavascriptInterface("action");
                    twebview.addJavascriptInterface(ds, "action1");
                    twebview.loadUrl("file:///android_asset/html/festival2.html");
                }
            }
        };

java中：

<span style="background-color: rgb(255, 204, 204);">DemoJavaScriptInterface1</span>

package com.graduationproject.custom;

import android.util.Log;
import android.webkit.JavascriptInterface;

import com.graduationproject.entity.FinalAttribute;

/**
 * Created by Administrator on 2015/10/17.
 */
public class DemoJavaScriptInterface1 {

        public String param;
        private String content;
        @JavascriptInterface、、
        public String getContent() {
            return content;
        }
        public void setContent(String content) {
            this.content = content;
        }
        @JavascriptInterface
        public String getParam() {
            return param;
        }
        @JavascriptInterface
        public void setParam(String param) {
            FinalAttribute.cate=param;
            this.param = param;
        }

        public DemoJavaScriptInterface1() {
        }
        public DemoJavaScriptInterface1(String p) {
            content=p;
        }

        /**
         * This is not called on the UI thread. Post a runnable to invoke
         * loadUrl on the UI thread.
         */
        @JavascriptInterface
        public void findflower() {
            FinalAttribute.taomHandler.post(new Runnable() {
                public void run() {
                    //AlertDialog.Builder builder=new AlertDialog.Builder(getContext()).setTitle("test").create().show();
                    Log.i("tag", "action is alive");
                    GetFlowerInfo1 info = new GetFlowerInfo1(param);
                    info.start();
                }
            });

        }
}

<span style="background-color: rgb(51, 204, 255);">GetFlowerInfo1 </span>

package com.graduationproject.custom;

import android.os.Message;

import com.graduationproject.entity.FinalAttribute;

import org.apache.http.HttpResponse;
import org.apache.http.client.methods.HttpGet;
import org.apache.http.impl.client.DefaultHttpClient;
import org.apache.http.util.EntityUtils;

/**
 * Created by Administrator on 2015/10/17.
 */
public class GetFlowerInfo1 extends Thread{
    private String param;
    public GetFlowerInfo1(String p)
    {
        param=p;
    }
    @Override
    public void run() {
        getfinfoByPost(param);
    }

    //通过post方法向后台提交数据
    public  void getfinfoByPost(String paras) {
        String result;
        try{
            //定义获取http客户端对象
            DefaultHttpClient httpClient=new DefaultHttpClient();
            String url="http://192.168.155.1:8080/TaoFlower/getflowerinfo?cateval="+paras;
            //获取向访问地址发出的请求对象
            HttpGet request=new HttpGet(url);
            //获取从访问地址返回的响应对象
            HttpResponse response=httpClient.execute(request);
            System.out.println("paras值："+paras);

            if(response.getStatusLine().getStatusCode()== 200){
                //将响应请求的对象转换成实体形式的字符形式的参数
                result= EntityUtils.toString(response.getEntity(), "utf-8");
                System.out.println("result值："+result);
                Message msg=new Message();
                msg.what=1;
                msg.obj=result;
                FinalAttribute.taomHandler.sendMessage(msg);
                //创建一个json对象
                //   JSONObject jsonObject=new JSONObject(result);
//                Gson gson=new Gson();
//                List<Flower> retList = gson.fromJson(result,
//                        new TypeToken<List<Flower>>() {
//                        }.getType());
                //将从后台获取的数据放到封装对象里面
                //return  result;
            }
        }catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

    }

}

html页面如何获取：

 <span style="white-space:pre">		</span>

<span style="white-space:pre">		</span>var temp=action1.getContent();//json数据内容
                var cateval=action1.getParam();//类别id
                //alert(temp);