首頁 >web前端 >js教程 >關於Ajax如何實現跨域存取的問題介紹

關於Ajax如何實現跨域存取的問題介紹

不言
不言原創
2018-07-13 15:52:531282瀏覽

這篇文章主要介紹了關於Ajax如何實現跨域訪問的問題,有著一定的參考價值,現在分享給大家,有需要的朋友可以參考一下

在實際項目當中,我們常常會遇到同一個網域下不同項目之間透過Ajax互相呼叫數據,這樣問題就來了,如何透過Ajax實現跨域呢?

解決方案

1.Jsonp

Jsonp解決跨網域相對簡單,伺服器無需任何配置。具體實作如下:

$.ajax({
    type: 'get',
    url: 'http://xxx.com',
    data: {},
    dataType: 'jsonp',
    success: function (data) {
        
    },
    error: function (data) {
        mask.close();
        toast('请求失败');
    }
});

2.CORS

CORS解決方案需要前端與服務端共同設定才能實作

  • 前端

$.ajax({
    url: 'http://xxx.com',
    type: 'post',
    xhrFields:{
        withCredentials:true
    },
    data: {},
    success: function(res){

    },
    error: function(){
        alert('服务器发生错误!');
    }
});
  • 服務端(在程式入口檔案設定)

#
header('Access-Control-Allow-Origin: http://xxx.com');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

以上就是本文的全部內容,希望對大家的學習有所幫助,更多相關內容請關注PHP中文網!

相關推薦:

jQuery AJAX PHP MySQL開發搜尋無跳轉無刷新的功能

對於vue中config/index. js:配置的詳解

以上是關於Ajax如何實現跨域存取的問題介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn