ssm 下 前端ajax 访问后台 以及出现的错误

前端之家收集整理的这篇文章主要介绍了ssm 下 前端ajax 访问后台 以及出现的错误前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
@H_403_0@前端使用AJax 发送数据到后台后台接受数据


代码


maven:

<!-- Json -->
    <dependency>
      <groupId>org.codehaus.jackson</groupId>
      <artifactId>jackson-mapper-asl</artifactId>
      <version>1.7.0</version>
    </dependency>
    <!--json的jar包 -->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-core</artifactId>
      <version>2.1.0</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.1.0</version>
    </dependency>
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-annotations</artifactId>
      <version>2.1.0</version>
    </dependency>

    <dependency>
      <groupId>net.sf.json-lib</groupId>
      <artifactId>json-lib</artifactId>
      <version>2.4</version>
      <classifier>jdk15</classifier>
    </dependency>

在Spring配置文件添加Json

<!-- 配置json数据 -->
	<bean
			class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
		<property name="messageConverters">
			<list>
				<ref bean="mappingJackson2HttpMessageConverter" />
			</list>
		</property>
	</bean>
	<bean id="mappingJackson2HttpMessageConverter"
		  class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
		<property name="supportedMediaTypes">
			<list>
				<value>text/html;charset=UTF-8</value>
				<value>text/json;charset=UTF-8</value>
				<value>application/json;charset=UTF-8</value>
			</list>
		</property>
	</bean>


@H_403_0@前端使用Jaon 需要添加 JQuery


@H_403_0@JSP页面添加 jQyery

<%--引入C标签--%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%--开启EL表达式  Jsp默认 关闭的--%>
<%--<%@ page isELIgnored="false"%>--%>


<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<script type="text/javascript">
    var contextRootPath = "${ctx}";
</script>
<%--引入jquery框架--%>
<script  src="${ctx}/jQuery/jquery-1.4.2.js"></script>
<script
        src="${ctx }/jQuery/jquery.js" type="text/javascript">

</script>


准备完成 ,开始 ajax

一个简单的表单

<form id="form">
    <input type="text" id="in"> <br>
    <span id="sp"></span> <br>
    <input type="button" id="button">

</form>

使用 jQuery



<script type="text/javascript">
    $(document).ready(function () {
        $("#in").focus(function () {
        });
        $("#button").click(function () {
            var ins = {ins : $("#in").val()};
            $.ajax({
                type:"POST",url:"${pageContext.request.contextPath}/click.action",dataType:"json",contentType:"application/json; charset=utf-8",data:JSON.stringify(ins),success:function (data) {
                    window.location.href = "/WEB-INF/page/welcome.jsp";
                    $("#in").val("");
                },error:function () {
                }
            });
        });
    });

</script>



可能出现的错误


有时候因为没有log信息 ,不知道是什么错,浏览器只是出现一个白页面,没有内容,那么就打开浏览器的控制台(火狐的是F12),查看网络信息,看一下HTTP错误

1, 415 unsupported media type

这个是因为

dataType:"json",

这两句话 没有加上 ,因为默认是不支持这种形式的,需要自己扩展,

2,400错误

传的参数是否跟后台@resquestbody参数一一 对应(List前台是数组),还有是否加上了jackson的四个jar包,spring3.0和3.1.1不支持jackson 2.x 3.1.3支持

3,500 internal server error

后台没有接收到json信息 ,看一下 是不是获取的时候,key是不是错了

后台获取信息

@Controller
public class FormClickController {

    @ResponseBody
    @RequestMapping("/click.action")
    public void click(@RequestBody JSONObject jsondata ) {
        System.out.println("============================================>>>>"+jsondata.getString("ins"));

    }
}


相关文章

http://blog.csdn.net/mr_li13/article/details/51636574

原文链接:https://www.f2er.com/ajax/161499.html

猜你在找的Ajax相关文章