太长,读不下去了有没有办法在我的WordPress后端为SVG启用CORS,这样我就可以通过http请求将它们发送到其他域?理想情况下无需触摸.htaccess
?
我的目标是建立一个无头WordPress/React网站。我想让我的SVG上传到WP后端,内联到我的前端代码中(这样我就可以访问它们的DOM)。
我有SVG的URL,并且react-inlinesvg
库允许我内联它。我正在No \'Access-Control-Allow-Origin\' header is present on the requested resource.
但出现错误。react-inlinesvg
通过发出实际http请求httpplease
图书馆
我刚开始尝试的是,我必须启用SVG上传到管理员。
add_filter(\'upload_mimes\', function($mimes) {
return array_replace($mimes, [
\'svg\' => \'image/svg+xml\',
\'svgz\' => \'image/svg+xml\'
]);
});
我也找到了这些过滤器,但我认为如果通过http请求文件,不会触发这些过滤器:
add_action(\'rest_api_init\', function($wp) {
remove_filter( \'rest_pre_serve_request\', \'rest_send_cors_headers\' );
add_filter( \'rest_pre_serve_request\', function( $value ) {
header( \'Access-Control-Allow-Origin: *\' );
header( \'Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE\' );
header( \'Access-Control-Allow-Credentials: true\' );
return $value;
});
});
add_filter(\'wp_headers\', function($headers) {
$headers[\'Access-Control-Allow-Origin\'] = \'*\';
return $headers;
});
提前谢谢!
SO网友:Petr Cibulka
通过使用自定义rewrite_url
, 我能够劫持该请求并设置其CORS友好的标题。
class Cors_Media {
const QUERY_VAR = \'cors_media_id\';
public function init() {
add_action(\'init\', [$this, \'add_rewrite_rule\']);
add_filter(\'query_vars\', [$this, \'query_vars\']);
add_action(\'template_redirect\', [$this, \'template_redirect\']);
}
public function query_vars(array $qs) {
$qs[] = \'cors_media_id\';
return $qs;
}
public function add_rewrite_rule() {
add_rewrite_rule(
\'^cors_media_id/([0-9]+)/?\',
\'index.php?cors_media_id=$matches[1]\',
\'top\'
);
}
public function template_redirect() {
$att_id = get_query_var(\'cors_media_id\');
if (empty($att_id)) { return; }
$url = wp_get_attachment_url($att_id);
if ($url) {
$this->show_file($url);
}
exit;
}
protected function show_file($url) {
header(\'Access-Control-Allow-Origin: *\');
echo file_get_contents($url);
exit;
}
}
$obj = new Cors_Media;
$obj->init();