如何將javascript api添加到wordpress function.php

Question

我正在嘗試向Wordpress添加一個短信API，它使用Woocommerce掛鉤發送訂單確認消息。經過一番研究，我發現下面的代碼here，它的工作原理是一樣的。提供

add_action('woocommerce_payment_complete', 'custom_process_order', 10, 1); 
function custom_process_order($order_id) { 
//Lets get data about the order made 
$order = new WC_Order($order_id); 

//Now will fetch customer/buyer id here 
$customer_id = $order->user_id; 

//now finally we fetch phone number 
$billing_phone = get_user_meta($customer_id, 'billing_phone', true); 

// Now put your HTTP SMS API URL . I PUT WHICH WE ARE USING 
$jsonurl = "http://tsms.thirdeyegoa.com/api/sendmsg.php?user=USERNAME&pass=PASSWORD&sender=MYSENDERID&phone=".$billing_phone."&priority=ndnd&stype=normal&text=MY MESSAGE TO CUSTOMER."; 

// NOW WILL CALL FUNCTION CURL 
$json = curl($jsonurl); 

return $order_id; 
} 

的API代碼我收到的短信網關是

// Include provided Java Script 

<script language="javascript" src="https://domainapi.js" type="text/javascript"> </script> 
<script language="javascript"> 

// Replace your API key at below line 

var apikey = 'ABCDEFGH1234567890abcdefghQWERTY123='; 

// Form your data object 

var mail_details = { email : 'John.Doe@foo.com', msgid : '82', listname : '', prefix : '', firstname : 'John', middlename : '', lastname : 'Doe', telephone : '', address : '', city : '', state : '', pincode : '', country : '', mobile : '9999999999', designation : '', company : '', companyphone : '', birthdate : '', anniversary : '', extra1 : '', extra2 : '' } 

call_api(apikey, 'sendSingleSMS', mail_details, function(response) { document.getElementById('show').innerHTML=response; });</script> 

請告訴我如何這個API在WordPress的上述腳本集成。

Answer 1

大概你試圖將你的API腳本混合到「WordPress的方式」，並從WooCommerce的訂單加載一些數據。首先，您需要在主插件文件中註冊您的腳本：

add_action('wp_enqueue_scripts', 'so_38554614_enqueue_scripts'); 
function so_38554614_enqueue_scripts(){ 
    wp_register_script('your-api', 'https://domainapi.js', array(), '1.0', true); 
    wp_register_script('your-script', 'path-to-your-script.js', array('your-api'), '1.0', true); 
} 

然後，您需要將它們加載到付款完成頁面上。您還需要利用wp_localize_script()將一些變量傳遞給腳本。

add_action('woocommerce_payment_complete', 'custom_process_order', 10, 1); 
function custom_process_order($order_id) { 
    //Lets get data about the order made 
    $order = new WC_Order($order_id); 

    wp_enqueue_script('your-api'); 
    wp_enqueue_script('your-script'); 

    $l18n = array('mail_details'=> 
       array( 
        email' => $order->billing_email, 
        'msgid' => 82, 
        'listname' => '', 
        'firstname' => $order->billing_first_name, 
        'middlename' => '', 
        'lastname' => $order->billing_last_name, 
        'telephone' => $order->billing_phone, 
        'address'= >$order->billing_address_1 . ' ' . $order->billing_address_2, 
        'city' => $order->billing_city, 
        'state' => $order->billing_state, 
        'pincode' => '', 
        'country' => $order->billing_country, 
        'mobile' => $order->billing_phone 
        'designation' => '', 
        'company' => $order->billing_company, 
        'companyphone' => '', 
        'birthdate' => '', 
        'anniversary' => '', 
        'extra1' => '', 
        'extra2' => '' 
       ), 
       'apikey' => 'ABCDEFGH1234567890abcdefghQWERTY123='); 

    wp_localize_script('your-script', 'Your_JS_Object', $l18n); 

    wp_localize_script() 

    return $order_id; 
} 

最後，你的JavaScript文件存儲在你的插件的某個地方。這需要這是由wp_localize_script()創建JavaScript對象Your_JS_Object的優勢：

// Java Script path-to-your-script.js 
call_api(Your_JS_Object.apikey, 'sendSingleSMS', Your_JS_Object.mail_details, function(response) { document.getElementById('show').innerHTML=response; });