Agregar atributos adicionales en la etiqueta de script para JS de terceros

puede intentar usar el gancho de filtro script_loader_src , por ejemplo:

add_filter('script_loader_src','add_id_to_script',10,2);
function add_id_to_script($src, $handle){
    if ($handle != 'dropbox.js') 
            return $src;
    return $src."' id='dropboxjs' data-app-key='MY_APP_KEY";
}

Actualizar

Acabo de darme cuenta de que el src se ha escapado de esc_url, por lo que, buscando un poco más, encontré el filtro clean_url que puedes usar para devolver el valor con tu ID y los datos clave de la aplicación:

add_filter('clean_url','unclean_url',10,3);
function unclean_url( $good_protocol_url, $original_url, $_context){
    if (false !== strpos($original_url, 'data-app-key')){
      remove_filter('clean_url','unclean_url',10,3);
      $url_parts = parse_url($good_protocol_url);
      return $url_parts['scheme'] . '://' . $url_parts['host'] . $url_parts['path'] . "' id='dropboxjs' data-app-key='MY_APP_KEY";
    }
    return $good_protocol_url;
}

Desde WP 4.1.0, hay un nuevo gancho de filtro disponible para lograrlo fácilmente:

script_loader_tag

Úsalo de esta manera:

add_filter( 'script_loader_tag', 'add_id_to_script', 10, 3 );

function add_id_to_script( $tag, $handle, $src ) {
    if ( 'dropbox.js' === $handle ) 
        $tag = '<script type="text/javascript" src="' . $src . '" id="dropboxjs" data-app-key="MY_APP_KEY"></script>';
    }

    return $tag;
}

Bien, me parece (para mí) que con wp_enqueque_scripts no es posible imprimir el ID y la clave de la aplicación como atributos de etiqueta de script.

Estoy seguro al 90%, porque WP_Dependencies no es una clase que conozco bien, pero al mirar el código me parece que no es posible.

Pero estoy seguro al 100% de que usar wp_localize_script no es útil para su alcance .

Como dije en mi comentario anterior:

  

Lo que wp_localize_script hace es imprimir un objeto codificado en json en el html   Salida de la página. Este objeto es reconocido por el script y por lo tanto   Se puede usar.

Lo que no he dicho en el comentario es que el objeto codificado con json es un nombre arbitrario que usted decide, de hecho, mirando la sintaxis:

wp_localize_script( $handle, $object_name, $l10n );

El script podría utilizar el objeto denominado $object_name porque está en el ámbito global e impreso en el html de la página.

Pero $object_name es un nombre que usted decide, por lo que puede ser todo .

Entonces pregúntate a ti mismo:

¿Cómo el script en el servidor remoto de Dropbox puede usar una variable que no saben cómo se llama?

Por lo tanto, no hay razón alguna para pasar el ID y / o la clave de la aplicación al script con wp_localize_script : solo tienes que imprimirlos como atributos de etiqueta del script como se dice en los documentos de la API de Dropbox.

No soy un desarrollador de js, pero creo que lo que hace el script de Dropbox es:

1. obtener todos los elementos <script> html en la página
2. recorre ellos buscando el que tiene el 'id' == 'dropboxjs'
3. si se encuentra ese script, mirando la 'clave de aplicación de datos' de ese script
4. compruebe si la clave de la aplicación (si está presente) es válida y le autorizo, en caso afirmativo

Tenga en cuenta que no sé esto con seguridad, solo estoy adivinando .

De esta manera, el script cargado desde el servidor de Dropbox puede verificar la clave de su aplicación de una manera que sea fácil para ellos y fácil de implementar para usted.

Debido a que en la primera oración he dicho que no es posible imprimir el ID y la clave de la aplicación en el script usando wp_enqueque_scripts , la moraleja de la historia es que usted tiene que imprimirlos. en el marcado de otra manera.

Una forma en que no huele demasiado (cuando no hay alternativas) es usar wp_print_scripts hook para imprimir la etiqueta de script:

add_action('wp_print_scripts', 'do_dropbox_stuff');

function do_dropbox_stuff() {

  if ( ! is_admin() ) return; // only for admin area

  $app_key = 'MY_APP_KEY';

  // why do not create an option for it?
  // $app_key = get_option('dropbox_app_key');

  if ( empty($app_key) ) return;

  echo '<script type="text/javascript" src="https://www.dropbox.com/static/api/1/dropins.js"id="dropboxjs" data-app-key="' . esc_attr($app_key) . '"></script>';

}

De la respuesta de Bainternet arriba. Este código funcionó para mí.

function pmdi_dropbox( $good_protocol_url, $original_url, $_context){
    if ( FALSE === strpos($original_url, 'dropbox') or FALSE === strpos($original_url, '.js')) {
        return $url;
    } else {
        remove_filter('clean_url','pmdi_dropbox',10,3);
        $url_parts = parse_url($good_protocol_url);
        return $url_parts['scheme'] . '://' . $url_parts['host'] . $url_parts['path'] . "' id='dropboxjs' data-app-key='APIKEY";
    }
}

Editar: la única diferencia con el código de Bainternet es que agregué una condición para verificar si la URL del script es un buzón y es un archivo .js.

Estoy ignorando todas las otras URL y reescribiendo la URL de Dropbox.

Hice algunas comprobaciones en el código de dropbox.js (v2) para ver qué estaba sucediendo y cómo resolverlo mejor. Como resultado, la clave de aplicación de datos solo se usa para establecer la variable Dropbox.appKey. Pude establecer la variable con la siguiente línea adicional.

Utilizando el ejemplo de javascript en la página de Dropbox enlace :

<script>
Dropbox.appKey = "YOUR-APP-ID";
var button = Dropbox.createChooseButton(options);
document.getElementById("container").appendChild(button);
</script>

En mi código, establezco la Dropbox.appKey en todos los lugares donde hago referencia a las rutinas de Dropbox javascript. Hacer esto me permitió usar wp_enqueue_script () sin los parámetros adicionales.

Hice esto con mi complemento de tarjetas electrónicas y es muy simple.

Aquí hay una copia / pegado directo desde el complemento:

$output .= '<!-- https://www.dropbox.com/developers/chooser -->';
$output .= '<script type="text/javascript" src="https://www.dropbox.com/static/api/1/dropbox.js"id="dropboxjs" data-app-key="' . get_option('ecard_dropbox_private') . '"></script>';
$output .= '<p><input type="dropbox-chooser" name="selected-file" style="visibility: hidden;" data-link-type="direct" /></p>';

Observe que la clave API se pasa a través de una opción.

Hay una forma más sencilla de hacer esto

 function load_attributes( $url ){
    if ( 'https://www.dropbox.com/static/api/1/dropins.js' === $url ){
        return "$url' id='dropboxjs' data-app-key='MY_APP_KEY";
    }

    return $url;
}

add_filter( 'clean_url', 'load_attributes', 11, 1 );

Sintaxis de Wordpress para script_loader_tag :

apply_filters( 'script_loader_tag', string $tag, string $handle, string $src )

Para agregar cualquier atributo, puedes modificar tu $ tag de esta manera:

add_filter('script_loader_tag', 'add_attributes_to_script', 10, 3); 
function add_attributes_to_script( $tag, $handle, $src ) {
    if ( 'dropbox.js' === $handle ) {
        $tag = '<script type="text/javascript" src="' . esc_url( $src ) . '" id="dropboxjs" data-app-key="MY_APP_KEY"></script>';
    } 
    return $tag;
}

Que se escapará correctamente de la URL.

Gracias por todas las publicaciones, realmente ayudaron. Hice mi propia versión para darle un poco de estructura y facilitar su lectura y actualización. Use encolar como de costumbre, use un script para archivos CSS con una etiqueta falsa al final para que se cargue en la parte superior. Aunque probablemente se pueda simplificar un poco.

add_filter('script_loader_tag', 'add_attributes_to_script', 10, 3); 
function add_attributes_to_script( $tag, $handle, $src ) {

    $scripts_to_load = array (

        (0) => Array
          (
            ('name') => 'bootstrap_min_css',
            ('type') => '<link rel="stylesheet" href="',            
            ('integrity') => 'sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB',
            ('close') => ' type="text/css" media="all">'
          ),

        (1) => Array
          (
            ('name') => 'popper_min_js',
            ('type') => '<script type="text/javascript" src="',         
            ('integrity') => 'sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49',
            ('close') => '></script>'
          ),

         (2) => Array
           (
            ('name') => 'bootstrap_min_js', 
            ('type') => '<script type="text/javascript" src="',
            ('integrity') => 'sha384-smHYKdLADwkXOn1EmN1qk/HfnUcbVRZyYmZ4qpPea6sjB/pTJ0euyQp0Mk8ck+5T',
            ('close') => '></script>'
           )
    );  

    $key = array_search($handle, array_column($scripts_to_load, 'name'));

    if ( FALSE !== $key){

        $tag = $scripts_to_load[$key]['type'] . esc_url($src) . '" integrity="' . $scripts_to_load[$key]['integrity'] .'" crossorigin="anonymous"' . $scripts_to_load[$key]['close'] . "\n";

    }
    return $tag;
}