Vue+axios+spring boot遇到的問題(跨域請求)
阿新 • • 發佈:2017-09-29
port acc stringify all menu turn esp public token
一、點擊一次按鈕 會發送兩次請求的問題
第一個請求 Method是OPTIONS
第二個請求 Method是POST
後臺過濾器也是檢測出訪問了兩次,但是是偶爾才會重復訪問。
這是因為 跨域請求導致 每次請求前都會先發送一個空的請求檢查服務器,
可以在後臺過濾器加個這個:
@Override public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException { HttpServletResponse response1= (HttpServletResponse) response; HttpServletRequest request1 = (HttpServletRequest) request; response1.setHeader("Access-Control-Allow-Origin", "*"); response1.setHeader("Access-Control-Allow-Credentials", "true"); response1.setHeader("Access-Control-Allow-Methods", "*"); response1.setHeader("Access-Control-Allow-Headers", "Content-Type,Access-Token"); response1.setHeader("Access-Control-Expose-Headers", "*"); if (request1.getMethod().equals( RequestMethod.OPTIONS.toString())){ System.out.println("-----檢查------"); return; } chain.doFilter(request, response); }
二、跨域請求問題
添加過濾器,過濾器裏面添加上面的代碼可以解決跨域請求問題
三、axios訪問接口 後臺讀取的數據都是空的問題 如下
前臺:
<script> export default { data() { return { formItem: { menu_name: ‘‘, menu_info: ‘無‘, menu_level: ‘‘, menu_state: true, app_version: [], operate_user: ‘admin‘, menu_superior:‘-‘ }, app_versions: [ { value: ‘100‘, label: ‘1.0.0‘ }, { value: ‘101‘, label: ‘1.0.1‘ }, { value: ‘102‘, label: ‘1.0.2‘ }, { value: ‘110‘, label: ‘1.1.0‘ } ] } }, methods: { addMenu: function (form) { console.log(JSON.stringify(form)) this.$http.post(‘http://localhost:8888/api/manager/addMenu‘, { data:JSON.stringify(form) }) .then(function (res) { if (res.data.no == ‘1‘) { alert(‘ok‘) } }) .catch(function (err) { console.log(‘----失敗-----‘); }); } } } </script>
後臺日誌
可以看到 前臺明明傳過去了,後臺也能接收到,但是為什麽全是null呢,搞了半天這裏出問題了:
addMenu: function (form) { console.log(JSON.stringify(form)) this.$http.post(‘http://localhost:8888/api/manager/addMenu‘, (form)) .then(function (res) { if (res.data.no == ‘1‘) { alert(‘ok‘) } }) .catch(function (err) { console.log(‘----失敗-----‘); }); }
其實這裏不用轉json,直接傳對象就可以,然後看下後臺:
這樣就對了。
Vue+axios+spring boot遇到的問題(跨域請求)