XMLHttpRequest访问控制允许起源错误谷歌驱动器API
我试图在wordpress主题中访问google drive，在下载所选文件时出现以下错误。
无法加载XMLHttpRequesthttps://drive.google.com/a/mobfish.net/file/d/0B5IETzPj-JCw832h9rdwk/view?usp=drive_web.对飞行前请求的响应未通过访问控制检查：请求的资源上不存在“access control Allow Origin”标头。原点'http://wptest.dev因此不允许访问。
（我稍微修改了一下URL，这不是真正的文件ID）
以下是JavaScript代码：
var developerKey = document.getElementById('key').innerHTML;
var clientId = document.getElementById('clientID').innerHTML;
// Scope to use to access user's photos.
var scope = ['https://www.googleapis.com/auth/drive.readonly'];
var pickerApiLoaded = false;
var oauthToken;
// Use the API Loader script to load google.picker and gapi.auth.
function onApiLoad() {
gapi.load('auth', {'callback': onAuthApiLoad});
gapi.load('picker', {'callback': onPickerApiLoad});
gapi.load("client");
}
function onAuthApiLoad() {
window.gapi.auth.authorize(
{
'client_id': clientId,
'scope': scope,
'immediate': false
},
handleAuthResult);
}
function onPickerApiLoad() {
pickerApiLoaded = true;
createPicker();
}
function handleAuthResult(authResult) {
if (authResult && !authResult.error) {
oauthToken = authResult.access_token;
createPicker();
}
}
// Create and render a Picker object for picking user Photos.
function createPicker() {
if (pickerApiLoaded && oauthToken) {
var view = new google.picker.DocsView(google.picker.ViewId.DOCS_IMAGES_AND_VIDEOS)
.setIncludeFolders(true)
.setSelectFolderEnabled(true);
var picker = new google.picker.PickerBuilder().
hideTitleBar().
disableFeature(google.picker.Feature.NAV_HIDDEN).
addView(view).
setOAuthToken(oauthToken).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
picker.setVisible(true);
}
}
// A simple callback implementation.
function pickerCallback(data) {
var url = 'nothing';
if (data.action == google.picker.Action.PICKED) {
var file = data.docs[0];
download(file);
}
}
function download(file) {
console.log("downloading " + file.id);
console.log(file);
var downloadUrl;
if (file.url) {
var accessToken = gapi.auth.getToken().access_token;
var xhr = new XMLHttpRequest();
xhr.open('GET', file.url);
xhr.setRequestHeader('Authorization', 'Bearer ' + accessToken);
xhr.onload = function() {
callback(xhr.responseText);
};
xhr.onerror = function() {
callback(null);
};
xhr.send();
} else {
callback(null);
}
}
function callback(param) {
console.log(param);
}
也许我只是忘了在https://console.developers.google.com ? 提前感谢，问候。
共有1个答案
也许你遇到的问题是跨来源安全。基本上，大多数web浏览器都不允许您从自己的服务器之外的服务器中提取内容，除非服务器表示可以。为此，服务器需要在标头中看到可接受的访问控制允许原点。
在这个链接上找到了关于如何在WordPress中启用CORS的教程。您只需将适当的标头添加到标头文件：
<?php /** @package WordPress @subpackage Default_Theme **/
header("Access-Control-Allow-Origin: *");
?>
<!DOCTYPE html>
您还可以检查这些相关线程：
- 访问-控制-允许-起源多起源域？
- 如何修复“缺少跨域资源共享（CORS）响应标头”Web字体问题？
- 在wordpress上跨域发布到外部站点失败
希望这有帮助！
-
问题内容： 我正在使用以下脚本- 我尝试访问的计算机正在运行播放框架。我收到以下错误： 选项404（未找到）jquery-1.9.1.min.js：5 XMLHttpRequest无法加载。原产地不被访问控制允许来源允许的。 我已经难过了两天，有人可以帮我吗？ 提前谢谢 问题答案： 问题是您正在尝试进行跨域调用（从到）。Same Origin Policy 不允许这样做，因此浏览器试图使用跨域资源
-
我有错误： XMLHttpRequest 无法加载 http://localhost:5984/cp_config/。当凭据标志为 true 时，不能在“访问控制-允许-源”标头中使用通配符“*”。因此，不允许访问源“http://localhost”。XMLHttpRequest 的凭据模式由 withCredentials 属性控制。 但我有一个标题： 我该如何解决这个问题？
-
问题内容： 我尝试使用以下代码通过$ http（角度）发送http请求： 但这不起作用，并且我在Web控制台中有此错误： 你有解决方案吗 ？ 问题答案： 您看到此错误是由于在浏览器中实现的称为Same Origin Policy的安全机制所致。 基本上，这是由于您的网页尝试访问驻留在与网页本身不同的主机，端口或方案（HTTP / HTTPS /文件等）所在的服务器上的资源而引起的。 为了解决此问题
-
我正在创建一个脚本，加载在其他网站的外部。它加载CSS和HTML，在我自己的服务器上工作得很好。 但还是不管用。
-
我已经设置了一个带有套接字io的节点服务器，并尝试通过另一台服务器连接到它。但是，不同计算机上的一些浏览器会给我这个错误并使其始终重新连接： XMLHttp请求无法加载https://serverDomain.net:3000/socket.io/?EIO=3 我的js配置： 我正在使用节点 8.0 和套接字 io 2.2，您的帮助将不胜感激。 编辑：这是客户端代码：
-
你有解决办法吗？