跨網域資源共用 (CORS) 是一種允許 Web 瀏覽器向其他網域上的資源發出要求的協定。但是，有一些限制可以防止惡意使用此功能。
嘗試使用 AJAX 載入跨網域 HTML 頁面時，您可能會遇到問題，除非 dataType 為設定為「jsonp」。但是，使用 JSONP，瀏覽器需要腳本 mime 類型，但它收到的是「text/html」。另外，使用 crossDomain 參數並沒有解決問題。
有幾種方法可以克服跨域障礙：
JSONP（帶有Padding 的JSON）是一種透過將響應包裝在函數呼叫中來允許跨域AJAX 請求的技術。這可以透過將 dataType 參數設為“jsonp”並提供回調函數作為成功處理程序來實現。
$.ajax({
type: "GET",
url: "crossdomainendpoint.com",
dataType: "jsonp",
success: function(data) {
// Handle the JSONP response
}
});CORS 代理程式是中間伺服器，可用來繞過同種策略。他們將必要的標頭添加到請求中，以允許瀏覽器存取其他網域上的資源。在線上提供多種信譽良好的 CORS 代理服務。
$.ajax({
type: "GET",
url: "https://cors-proxy.com/crossdomainendpoint.com",
dataType: "json",
success: function(data) {
// Handle the CORS response
}
});CORS Anywhere 是一種流行的 CORS 代理伺服器，可用於從任何網域取得資源。
$.ajaxPrefilter(function(options) {
if (options.crossDomain && $.support.cors) {
options.url = "https://cors-anywhere.herokuapp.com/" + options.url;
}
});
$.ajax({
type: "GET",
url: "crossdomainendpoint.com",
dataType: "json",
success: function(data) {
// Handle the CORS response
}
});Whatever Origin 是一個使用 JSONP 的開源程式庫啟用跨域請求。
$.ajax({
type: "GET",
url: "http://whateverorigin.org/get?url=" + encodeURIComponent("crossdomainendpoint.com"),
dataType: "jsonp",
success: function(data) {
// Handle the JSONP response
}
});請注意，雖然這些技術可以幫助克服跨域限制，但在使用外部資源時考慮安全影響並遵守同源策略的原則非常重要.
以上是HTML端點載入時如何解決跨網域AJAX請求？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
