ElementUI实现CRUD(修改前端页面),前后台解决跨域问题

1.前端项目使用一个Vue的流程

         a)定义一个vue文件

    b)在rout.js里面引入VUE文件,

c)在rout.js里面配置路由

{

    path: '/',

    component: Home,

    name: '组织机构管理',

    iconCls: 'el-icon-message',//图标样式class

    children: [

        { path: '/department', component: Department, name: '部门管理' }

    ]

}

d)实现CRUD

         1.首先在main.js注释前端人员使用的mock的引入的包,然后在main.js里面引入axios方式发送请求到后台的包,然后考模板进行改吧改吧!

e)跨域问题的解决(主要Ajax请求时出现的跨域问题)

         1.跨域的类型

a)同一个域名,不同的端口

         2.解决方式:

                  a)JSONP(老方法)

                          搭建一个服务器支持,将它放到服务器里面,只能发GET请求
                          <script/>

b)- nginx服务,反向代理(部署nginx服务)
前台发送请求à被nginx请求拦截,nginx将请求路径转变成自己的路径,再转到后台服务器去访问

c)cors方案

         在服务器端做控制是否允许跨域,支持各种请求,但是会额外发送一个请求:Options请求

         前端发送请求,发送option请求,询问后台是否允许访问(预检),同意访问,返回给前台,再发送一个正确的请求到后台.

    注意:不是所有的请求都要经过options请求的询问,特殊请求就必须要经过options请求去访问

         后台代码实现:1.配置corsfilter核心过滤器来放行前端的请求,2.只需要配置一个注解(@CrossOrigin)就可以解决跨域的问题了(前提Spring版本必须是4.2.5及以上).