1. 程式人生 > >在Spring Security中使用AJAX向後臺傳送資料

在Spring Security中使用AJAX向後臺傳送資料

工作中遇到的問題,這裡記錄下,也希望能夠幫助同學們少走彎路

為了快速幫助快速解決問題,我決定首先呈現問題的表現,再進行分析

環境:spring 4.2.3

  spring security 4.1.3

表現:

2016-10-26 22:44:02 [http-apr-9080-exec-10] DEBUG org.springframework.security.web.csrf.CsrfFilter - Invalid CSRF token found for XXX
2016-10-26 22:44:02 [http-apr-9080-exec-10] DEBUG org.springframework.security.web.header.writers.HstsHeaderWriter - Not injecting HSTS header since it did not match the requestMatcher org.springframework.se

[email protected]c3339ef
2016-10-26 22:44:02 [http-apr-9080-exec-10] DEBUG org.springframework.security.web.context.SecurityContextPersistenceFilter - SecurityContextHolder now cleared, as request processing completed

前臺使用AJAX向後臺傳輸資料時候控制檯報出上述錯誤,再未整合Spring Security時不會出現此現象

解決方法:

如果前端使用的JSP

可以在前端頁面的<head>標籤中增加兩個<meta>標籤

如下

<html>
<head>
	<meta name="_csrf" content="${_csrf.token}"/>
	<!-- default header name is X-CSRF-TOKEN -->
	<meta name="_csrf_header" content="${_csrf.headerName}"/>
	<!-- ... -->
</head>

如果前端使用的是Thymeleaf分兩種情況

1.前端無form表單,也要再頭部增加兩個meta標籤,形式為

<html>
<head> <meta name="_csrf" th:content="${_csrf.token}" content=""/> <!-- default header name is X-CSRF-TOKEN --> <meta name="_csrf_header" th:content="${_csrf.headerName}" content=""/> <!-- ... --> </head>

2.前端有form表單

  Spring Security為Thymeleaf中的表單中自動新增一個<input type="hidden" name = "_csrf" value="xxxxxxxxxx">  (xxxx為crrf.token)

新增完meta之後不妨執行下,在頁面程式碼中搜索_csrf,可以看看附近程式碼的樣子,應該就會明白了

這樣在使用AJAX時,需要增加一個頭部

var token = $("meta[name='_csrf']").attr("content");
var header = $("meta[name='_csrf_header']").attr("content");
 $.ajax({  
                   type: "POST",  
                   url: "myposturl",  
                   data: entID, 
                   contentType:"application/json; charset=utf-8",
                   headers : {header:token},
                   async:false,
                   success:function(data){  
       //do something
                   },
                   error: function () {
                //deal width error    
                   }
            });  
實際上,這裡的header使用為值"X-CSRF-TOKEN" 這樣就可以成功向後臺請求了

相關推薦

Spring Security使用AJAX後臺傳送資料

工作中遇到的問題,這裡記錄下,也希望能夠幫助同學們少走彎路 為了快速幫助快速解決問題,我決定首先呈現問題的表現,再進行分析 環境:spring 4.2.3   spring security 4.1.3 表現: 2016-10-26 22:44:02 [http-apr-9

Django使用ajax post後臺傳送資料時403 Forbidden (CSRF token missing or incorrect.):的解決辦法

在Django中使用ajax post向後臺傳送資料時會出現403 Forbidden (CSRF token missing or incorrect.): 的報錯。 第一種解決方法: 先看一下ajax的使用方法: $.ajax({ url: '{% url '

在使用ajax後臺傳送json資料,存在格式不正確的問題

在一次servlet伺服器的專案中,想在前臺使用json向後臺傳送請求,其中data的格式如下: var requestData = { "services": [{ "lightbulb" : [{"alpha":0}], "operat

使用AJAX後臺資料,為什麼會進入error?

問題:用ajax向後臺傳值,正常是根據伺服器的響應來決定進入success或者進入error,但是隻要執行ajax,不等後臺響應,直接進入error;然而後臺接受資料正常; 解決方法:(不要對號入座) html: <button type="submit" cla

Modal模態框使用ajax後臺資料和檔案之modal複用

昨天把新增計劃概要寫完了,那麼今天要開始新增計劃了,經理開始催了,好急好急!!＀! 那麼新增計劃從哪裡開始呢,我們的前段已經編輯好了,像這樣的: OK,重點是天數,我們要先取到天數才行,那麼天數之前已經給出了,在第一頁上,我們直接用Jqu

通過ajax後臺資料 後臺處理完後返回資料ajax 提示找不到物件

今日坑,今日畢。明天還有新的坑。 問題: 通過ajax向後臺傳資料 後臺處理完後返回資料給ajax提示找不到物件。 大概是這樣的: 頁面: $.ajax({ url : url, data : data, type : "post", dataType : "json",

js後臺傳送資料的中文亂碼問題

 位址列中出現漢字的情況有兩種,一種是漢字出現在URL的路徑部分,一種是漢字出現在URL的傳參的部分。   第二種情況的時候必須採用編碼後傳參,接受時解碼的方式完成傳參。   js中編碼有escape(), encodeURI(), encodeURIComponent(

bootstrap-table(三)後臺傳送資料(post請求)接收不到

故障原因 本來做一個伺服器分頁的功能,結果按照文件配置好了一直都請求不到資料,而且用ajax完全沒問題,那就查唄,network一查,初看沒啥問題 method:'post', 傳送的資料

AJAX後臺傳遞資料(包括陣列)的方法

我是一個Java Web新手程式設計師,今天來總結一下用AJAX向後臺傳遞資料的寫法,如有問題歡迎指正。首先我們來重申一下在JQuery中封裝的AJAX的寫法(相對於原生js寫法):$.ajax({ type : "post", url : "Student_Ch

jsp用ajax後臺資料的格式

<script type="text/javascript"> $.ajax( { url: "test.action", async:true, cache:false, type:'post' dataType:'text', dat

解決AJAX後臺傳送HMTL程式碼失敗的問題

毫無疑問,解決辦法就是進行編碼後提交 今天在做一個非同步提交資料的時候,由於富文字編輯器產生了一些HTML程式碼,提交後臺會出錯。我測試了3種編碼進行提交 順帶提一句,Asp.NET的Request取

JSP 頁面用 Ajax 後臺資料中文亂碼

1. Jsp 頁面對變數進行編碼encodeURI(encodeURI(smsContent.value)); 2. 後臺接收解析變數smsContent = URLDecoder.decode(URLDecoder.decode(smsContent, "UTF-8"),"

JS如何防止AJAX命令重複載入(執行一次,自動後臺傳送兩次以上的請求)

將程式碼部署在伺服器上後,在提交資料並將資料插入資料庫時,總是在提交後不多時,資料便變成了亂碼。後來發現原來是AJAX在搗鬼。 1、將如下程式碼放在將要傳送AJAX請求的方法前 <!--防止ajax重複載入--> <script> function pre

使用jq+ajax後臺提交select input資料

1、html程式碼 <span class="request" style="margin: 0px 0px 0px 8px;float: left;font-size: 17px;">

js如何陣列新增物件並通過ajax後臺傳遞list資料

js動態向陣列新增物件,並通過ajax提交List資料到後臺 var data=[{name: '張三',age: 18,id: 1},{name: '李四',age: 22,id: 2}]; var test= []; for (var i = 0; i < data.le

幾種常用的ajax配合json資料格式後臺傳送請求以及後臺如何接收資料

一、$.ajax()(無重新整理) jsonp格式:以url形式傳遞拼接資料:http://192.168.1.1/pwc/esb?gn=tx&cz=list&id=1&shzt=5var param = {id:$("#cxsq_xk_id").

AJAX的利用POST傳送資料

  這裡我只寫關鍵語句,其它的就和GET方法一樣的,如果不請楚,請看我前面的文章:Ajax的JSP示例以及相關知識介紹,適合於入門者 function doMyPost() {     //這裡一定要加兩次編碼,具體原因請看:AJAX中利用PO

使用ajax接收後臺傳送過來的json資料

今天給大家帶來一個簡單的使用ajax接收後臺返回json格式的demo 廢話不多說直接上程式碼 後臺程式碼 package com.sidan.outjson; import java.io.IOException; import java.io.PrintWriter; im

OkhttpUtils後臺傳送Json資料

OkHttp是一個優秀的網路請求框架。通過對OkHttp的封裝,可以極大的擴充套件其效能。 okhttp-utils是一個對OkHttp的封裝庫,原庫由hongyang封裝,我在其基礎上進行了少許的修改,使其更符合我的專案。 1. 在app專案下的build.gradle

使用jquery validate和ajax進行表單驗證並後臺提交資料

以前我都是在頁面中點選submit按鈕後提交給某個url一個post資料,使用validate後我們就可以使用html頁面和js來非同步的向後臺提交資料,具體程式碼如下 $("#form-product-add").validate({ rules : { tit