[英]XMLHttpRequest error with Google translate (No 'Access-Control-Allow-Origin' header)
[英]XMLHttpRequest Access-Control-Allow-Origin Error Google Drive API
我嘗試在 wordpress 主題中訪問谷歌驅動器,並在下載所選文件時出現以下錯誤。
XMLHttpRequest 無法加載https://drive.google.com/a/mobfish.net/file/d/0B5IETzPj-JCw832h9rdwk/view?usp=drive_web 。 對預檢請求的響應未通過訪問控制檢查:請求的資源上不存在“Access-Control-Allow-Origin”標頭。 因此,不允許訪問源 ' http://wptest.dev '。
(我稍微修改了網址,這不是真正的文件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添加一些設置? 提前致謝,問候。
也許您遇到的問題是跨域安全。 基本上,大多數網絡瀏覽器不允許您從您自己以外的服務器中提取內容,除非服務器說可以。 為此,服務器需要在標頭中看到可接受的Access-Control-Allow-Origin
。
在此鏈接上找到有關如何在 WordPress 中啟用 CORS 的教程。 您只需要在頭文件中添加適當的頭文件:
<?php /** @package WordPress @subpackage Default_Theme **/
header("Access-Control-Allow-Origin: *");
?>
<!DOCTYPE html>
您還可以查看這些相關主題:
希望這有幫助!
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.