#javascript #php #wordpress #google-sheets
#javascript #php #wordpress #google-sheets
Вопрос:
Я создаю приложение для отображения статистики и управления ею в WordPress.
Я получаю свои данные из таблиц Google и передаю их в скрипт через wp_localize_script.
Я только что заметил, что это нарушает функциональность javascript в других сценариях, хотя я понятия не имею, почему.
Особенности:
получение данных из листов:
function get_stats_from_sheets()
{
require_once dirname(dirname(__FILE__)) . '/stat-interface/vendor/autoload.php';
$apikey = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
$spreadsheetId = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
$ranges = ["'GI'!A1:F", "'dsfdf'!A1:C", "'dfd'!A1:G", "'dsfdf'!A1:B", "'dsfdsf'!A1:D"];
$params = ['ranges' => $ranges, 'majorDimension' => 'COLUMNS'];
$client = new GoogleClient();
$client->setApplicationName("dsfdf");
$client->setDeveloperKey($apikey);
$service = new Google_Service_Sheets($client);
$response = $service->spreadsheets_values->batchGet($spreadsheetId, $params);
$array = (array) $response;
$data = $array['valueRanges'];
return $data;
}
Локализовать скрипт и другие загруженные скрипты:
add_action('wp_enqueue_scripts', 'my_custom_script_load', 11);
function my_custom_script_load(){
if (is_page(603484)):
wp_enqueue_script('spamspan', get_stylesheet_directory_uri() . '/js/spamspan.js', array('jquery'), '0.2', true);
wp_enqueue_style('stat', get_stylesheet_directory_uri() . '/css/stat.css');
wp_enqueue_script('chartJs', 'https://cdn.jsdelivr.net/npm/chart.js@2.9.4/dist/Chart.min.js', '', '', true);
wp_enqueue_script('ublcharts', get_stylesheet_directory_uri() . '/js/ublcharts.js', '', '', true);
wp_localize_script('ublcharts', 'statsData', get_stats_from_sheets());
wp_enqueue_script('bootstrap', 'https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js', array('jquery'), '', false);
wp_enqueue_style('bootstrapCss', 'https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css');
wp_enqueue_script('pdfmake', 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.68/pdfmake.min.js', '', true);
wp_enqueue_script('vfs_fonts', 'https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.68/vfs_fonts.min.js', '', '', true);
wp_register_script('stat-pdf', get_stylesheet_directory_uri() . '/js/stat-pdf.js', '', '', true);
wp_localize_script('stat-pdf', 'home_url', array('url' => get_stylesheet_directory_uri(), 'home' => get_home_url()));
wp_enqueue_script('stat-pdf');
endif;
}
Получены ошибки:
spamspan.js?ver=0.2:50
Uncaught TypeError: document.createTextNode is not a function
at spamSpan (spamspan.js?ver=0.2:50)
_microtask.js:36 Uncaught (in promise) TypeError: document.createTextNode is not a function
at t.exports (_microtask.js:36)
at Object.i.m.n (es6.promise.js:13)
at i (bootstrap:19)
at Object.i.m.n (promise.js:4)
at i (bootstrap:19)
at Object.i.m.n (promise.js:1)
at i (bootstrap:19)
at Object.<anonymous> (index.js:29)
at Object.i.m.n (pdfmake.min.js?ver=1:37)
at i (bootstrap:19)
ошибка spamspan на самом деле не важна для меня, но это был показатель того, что что-то сломалось (потенциальная причина, по которой мой PDF-скрипт не работает).
Отключив все другие скрипты и очереди, я сузил круг поиска до локализованных данных из Google.
Второе сообщение об ошибке возникает, когда я пытаюсь сгенерировать pdf через pdfmake.js с объектом данных. В обоих случаях говорится: «document.createTextNode не является функцией».
Я использую pdfmake.js также и на других страницах, и там это работает без проблем, поэтому я взял рабочий код pdfmake script и сократил его до минимума, но я получаю вышеупомянутое сообщение об ошибке, несмотря ни на что.
Кто-нибудь может сказать мне, почему это происходит и как этого избежать?
Ответ №1:
Проблема заключалась в фрагменте плохого кода Javascript, который я написал.
let mPoint = (document.createTextNode = point);
Я все еще нахожу интересным, что ошибка консоли приводит меня куда угодно, кроме ошибочной строки в моем скрипте.
После исправления этого ошибок больше не было.