Created by Victor Bini
almost 8 years ago
|
||
Question | Answer |
Quais são as principais armadilhas de se usar JavaScript com WordPress? | -Conflitos com outros arquivos JavaScript -Segurança(Principalmente quando usamos AJAX, enviar dados e receber dados.) -Performance(Quanto maior nosso arquivo JavaScript, mais as pessoas tem que baixar resultando em uma queda de performance.) |
Quais são os parâmetros do comando wp_enqueue_scripts()? | wp_enqueue_script( 'my_sample_script' -> Handle(Unique identifier), get_template_directory_uri() . '/js/sample.js' , -> Souce - the location of the JavaScript fil. array( 'jquery' ), -> Dependencieis of our file, lembrar que existe na documentação uma lista de bibliotecas javascript que já vem com o WordPress - Não adicionar em cima!, SAMPLE_VERION, -> Um numero, que pode ser definido como constante, é o numero da versão, aquela versão que aparece no inspetor, pode ajudar a resolver alguns conflitos. true, -> true para carregar o arquivo no footer, false para carregar o arquivo no header. |
Quais cuidados temos que ter ao adicionar nosso wp_enqueue_scripts() em nosso arquivo WordPress? | Devemos pensar que adicionar nosso arquivo javascript em: add_aciton('wp_enqueue_scripts', 'my_script'); vai carregar os scripts em todas as paginas, o que pode deixar nosso site mais devagar, devemos buscar carregar os scripts somente quando são necessários. |
Como adicionamos scripts em paginas especificas apenas? | function my_sample_enqueue_script() { if( is_home()){ wp_enqueue_scrupt('my-sample-script', plugin_url(..)) } } adicionamos um if/else no inicio para verificar se estamos na pagina correta. |
Como trabalhamos com JavaScript em WordPress com a função wp_localize_script()? | utilizamos a função wp_localize_script() que conta com os parâmetros: wp_localize_script( 'my-sample-script', //-> Handle of Script 'sample', // -> Object name in JavaScript array( // -> Data and localized messages to pass into the JavaScript file. 'message' => __( 'Alert message' , 'sample-plugin'), 'is_new' => true ) ); Então ao enviar esse objeto em nosso arquivo JavaScript, vamos ter: Sample Object | Value sample.message | "Alert Message" sample.is_new | true |
O que vimos? | -Adding our scripts with wp_enqueue_script and wp_register_script. -Using the 'wp_enqueue_scripts' or 'admin_enqueue_scrits' action -Add conditions to only load our scripts when needed -Passing data and translatable strings using wp_localize_script Using jQuery in WordPress |
Qual ferramenta foi um importante marco a partir do WordPress 4.4? | WP_REST_API, Que possui melhores praticas de AJAX, baixo nível de duplicações e codigo mais padronizado. Facilidade em integrar com aplicativos externos. *antes nos utilizavamos admin-ajax.php *temos que ver esse método caso tenhamos que dar suporte a versões anteriores do wordpress. |
O que é um 'Endpoint'? | É uma maneira de enviar e receber dados para o javascript dos nossos servidores WordPress. Endpoint URL para registrar votos, por exemplo: /wp-json/cupcake-voting/v1/votes /wp-json Esse primeiro caminho é o caminho comum para 'endpoint' /cupcake-voting A segunda parte é uma string unica para nosso 'endpoint' - precisa ser unico - lembrar que plugins também usam esse método. /v1 Versão para controlar caso adicionemos novas funções. - ESPECIALMENTE importante quando temos um endpoint publico - em apps ou plugins. /cupcake-voting/v1 - formam o NAMESPACE. /votes -> chamado de route. é uma função especifica para receber ou enviar dados, |
Quando criamos um 'Endpoint' precisamos especificar quais métodos ele vai suportar, quais são os possíveis métodos para um 'Endpoint'? | HTTP Methods for Calling Our Endpoint GET | PUT POST | DELETE GET - é para ler o valor de alguma coisa, que pode ser os votos que nossos cupcakes tiveram(exemplo curso) POST - É para adicionar algo novo, como um novo voto. PUT - é para fazer o update de alguma coisa. DELETE - é para deletar alguma coisa. |
Como fazemos para registar nosso 'endpoint'? | register_rest_route( 'cupcake-voting/v1', (our NAMESPACE) '/votes/', (our ROUBE) array( (os argumentos) 'methods' => 'POST', (metodos permitido) 'callback' => (nossa callback function) 'cupcake_add_vote', ) ); |
O que temos que fazer para que nossa register_rest_route() function possa funcionar? | Temos que ir em Settings / Permalinks e clickar em SAVE, assim o WordPress vai verificar novamente se existe alguma função trabalhando com o rest_api e vai passar a rodar nossa função. OU PODEMOS noadicionar uma função function rest_api_function_active() { flush_rewrite_rules(); } register_activation_hook( __FILE__, 'function_you_want_to_call') |
Como funciona a estrutura basica para adicionar esse 'endpoint' no rest_api? | |
Qual parâmetro passamos em nossa callback function ? | seguindo o exemplo acima, nossa callback function é cupcake_add_vote() function cupcake_add_vote( WP_REST_Request $request ){ } WP_REST_Request $request contém detalhes da request junto com qualquer dado passado - VIA POST, GET, UPDATE METHOD. , nós podemos acessar esses dados em alguns caminhos: por exemplo, se uma id é enviada, podemos utilizar assim: $id = $request['id']; ou $id = $request->get_param('id'); se tivermos um problema, podemos retornar o WP_Error( ' vote_error ', __('Unable to add vote')); Podemos acessar qualquer variável da get_param('variable_name'); PODEMOS RETORNAR ESSES DADOS PARA TRABALHAR COM ELES NO FRONT END. |
Qual a importância da validação e sanitização dos dados antes de utilizar? (Validation and Sanitization) | Validar e sanitizar nossos dados antes de usa-los é vital para proteger nosso site contra atividades maliciosas quando passamos dados no wordpress e javascript. Validation - É garantir que o dado que obtemos é o que esperamos. Sanitization - é se assegurar dos dados que nos obtemos, antes de utiliza-los |
O que temos que fazer para adicionar uma função de validação e sanatização? | temos que passar um 'args' => array( 'id' => array( 'required' => true, 'validate_callback' => function_name 'sanitize_callback => 'absint' adicionamos isso em nossa register_rest_route() function |
O que são WordPress Nonces ? | Wordpress Nonces - 'number used once', pode ser usado como parte do Cookie Authentication Process. Nonces ajuda a verificar se uma request vem de um usuario real, porém Wordpress Nonces não são realmente únicas e podem ser usadas mais de uma vez em determindas situação. Não pode ser usado como único método de autenticação, então temos que combinar com outras funções como current_user_can and is_user_logged_in |
Como criamos uma WordPress Nonces ? | em nossa function.php, na função wp-localize_script( 'js_handle', 'object_js_name', array( 'nonce' => wp_create_nonce( 'wp_rest' ); ) ); então em nosso arquivo php para verificar se a nonce está correta, vamos adicionar em nossa função $.ajax beforeSend: function(xhr) { xhr.setRequestHeader( 'X-WP-Nonce', cupcake_voting_data.nonce );} assim verificamos se a nonce está correta para o usuário. Para complemetar podemos pedir alguma autenticação em nossa register_rest_route(), adicionando 'permission_callback' e então podemos deixar somente usuarios logados ou admins fazerem algo. |
Como fazemos para chamar um end-pont em nosso javascript? | nos vamos adicionar o url do end-point em nossa $.ajax request: podemos fazer isso via hardcode: $.ajax(''https://example.com/wp-json/cup-cake-votting/votes); ou definindo uma variavel para a url em wp_localize_script e passando essa variavel no objeto para o javascript. |
Want to create your own Flashcards for free with GoConqr? Learn more.