1.ajax傳送請求，紅色部分為自定義新增的請求頭資訊

//上傳視訊檔案
     function uploadfile(el) {
     <@shiro.user>
         var userId = <@shiro.principal property = "id"/>
             </@shiro.user>
         var formData = new FormData();
         var file = $(el).siblings().filter('#filedata').prop('files')[0];
         formData.append("file", $(el).siblings().filter('#filedata').prop('files')[0]);
         if(file != null && file != ''){
             $.ajax({
                 url: "http://localhost:8088/jq/vo/up.do",
                 type: "POST",
                 headers: {
                     'Range': 0,
                     'Filename': file.name,
                     'Filelength': file.size,
                     'UserId': userId,
                 },
 

                 data: formData,
                 processData: false, // 不要對data引數進行序列化處理，預設為true
                 contentType: false, // 不要設定Content-Type請求頭，因為檔案資料是以 multipart/form-data 來編碼
                 xhr: function () {
                     myXhr = $.ajaxSettings.xhr();
                     if (myXhr.upload) {
                         myXhr.upload.addEventListener('progress', function (e) {
                             if (e.lengthComputable) {
                                 var percent = Math.floor(e.loaded / e.total * 100);
                                 $(el).siblings().filter('#isfile').html('已上傳：' + percent.toString() + '%');
                             }
                         }, false);
                     }
                     return myXhr;
                 },
                 success: function (resp) {
                     // console.log(resp,"---success----");
                     if (resp.flag == 1) {
                         $(el).siblings().filter('#successAlertFile').show().fadeOut(3000);//顯示模態框
                         $(el).siblings().filter('#successAlertFile').children().css('color', 'green').html('上傳成功！');
                         $(el).siblings().filter('#videoUrl').val(resp.data.path);
                     } else {
                         $(el).siblings().filter('#successAlertFile').show().fadeOut(3000);
                         $(el).siblings().filter('#successAlertFile').children().css('color', 'red').html('上傳失敗，請重新上傳！');
                         $(el).siblings().filter('#isfile').html('');
                     }
                 },
                 error: function (res) {
                     // 請求失敗
                     console.log(res);
                     $(el).siblings().filter('#successAlertFile').show().fadeOut(3000);
                     $(el).siblings().filter('#successAlertFile').children().css('color', 'red').html('上傳失敗，請重新上傳！');
                     $(el).siblings().filter('#isfile').html('');
                 }
             });
         }else{
             $(el).siblings().filter('#successAlertFile').show().fadeOut(3000);
             $(el).siblings().filter('#successAlertFile').children().css('color', 'red').html('上傳視訊不能為空！');
         }

     }

2.伺服器端配置，設定自定義請求都資訊，解決跨域問題

    1.新建java類 CORSFilter.java 下面紅色部分為伺服器端配置的自定義請求頭資訊

   package com.enjoy.common;

    import javax.servlet.*;
    import javax.servlet.http.HttpServletResponse;
    import java.io.IOException;

/**
 * @Author: LBX
 * @Date: 2018/5/29 14:02
 */
public class CORSFilter implements Filter {
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        response.setHeader("Access-Control-Max-Age", "3600");
 response.addHeader("Access-Control-Allow-Headers"," Access-Control-Allow-Headers,userid,range,filename, filelength

        2，在web.xml檔案裡面新增以下資訊，注意放到 同級<filter>標籤的最上面

        <filter>
<filter-name>cors</filter-name>
<filter-class>com.enjoy.common.CORSFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>cors</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>