前后端连接

前端发送请求：同步 前端向后端发送一个请求 会用回应的内容覆盖掉浏览器中的内容

会打断其他前端的正常操作，在现在的前端中显得不太友好

异步请求：前端正常输入时，可以与后端进行交互，后端响应的数据，不会影响前端正常操作。可以使用js中提供的对象，向后端发送请求，服务器响应的内容，会被js对象接收，然后用接收到的内容加载网页。后加载后更新，不影响前面已经加载出来的内容。

跨域问题：属于前端问题

分为 前端解决和后端解决（在响应头中设置说明，告知浏览器，此次响应是可靠的）

在前端的页面中(8848)，接收后端相应的数据(8086)

使用ajax技术前后端交互 ，前端会进行阻止

后端如何向前端响应更多的数据：

可以把数据封装在一个个对象里，响应一个个前端

​
跨域：
​
​
package com.ffyc.webback.filter;
​
import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
​
public class CorsFilter implements Filter {
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
            throws IOException, ServletException {
        HttpServletResponse httpResponse = (HttpServletResponse) servletResponse;
        HttpServletRequest httpRequest = (HttpServletRequest) servletRequest;
        //允许携带Cookie时不能设置为* 否则前端报错
        httpResponse.setHeader("Access-Control-Allow-Origin", httpRequest.getHeader("origin"));//允许所有请求跨域
        httpResponse.setHeader("Access-Control-Allow-Methods", "*");//允许跨域的请求方法GET, POST, HEAD 等
        httpResponse.setHeader("Access-Control-Allow-Headers", "*");//允许跨域的请求头
        httpResponse.setHeader("Access-Control-Allow-Credentials", "true");//是否携带cookie
​
        filterChain.doFilter(servletRequest, servletResponse);
    }
}
​

web.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
<!--xml主要是项目中储存配置信息的，xml属于标记语言-->
<!--配置servlet的地址-->
    <servlet>
        <servlet-name>LoginServlet</servlet-name><!--定义servlet类的对象-->
        <!--配置servlet对象，第一次启动服务器时，由服务器通过反射机制，创建次servlet对象-->
        <servlet-class>com.ffyc.webback.servlet.LoginServlet</servlet-class>
        <init-param>
            <param-name>count</param-name>
            <param-value>0</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
​
    <!--为指定name的servlet配置一个供前端进行访问的映射地址-->
    <servlet-mapping>
        <servlet-name>LoginServlet</servlet-name>
        <url-pattern>/login</url-pattern>
    </servlet-mapping>
    <!--<servlet>
        <servlet-name>regServlet</servlet-name>
        <servlet-class>com.ffyc.webback.servlet.RegServlet</servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>RegServlet</servlet-name>
        <url-pattern>/reg</url-pattern>
    </servlet-mapping>-->
   <!--配置过滤器 -->
<filter>
    <filter-name>encodFilter</filter-name>
    <filter-class>com.ffyc.webback.filter.EncodFilter</filter-class>
​
</filter>
    <!--配置进入过滤器的映射地址-->
    <filter-mapping>
        <filter-name> encodFilter</filter-name>
        <url-pattern>/*</url-pattern>  <!--配置哪些地址可以进入到当前过滤器-->
       <!-- <url-pattern>reg</url-pattern>
        <url-pattern>user</url-pattern>-->
​
    </filter-mapping>
</web-app>