diff options
Diffstat (limited to 'files/pt-br/web/api/blob')
| -rw-r--r-- | files/pt-br/web/api/blob/blob/index.html | 65 | ||||
| -rw-r--r-- | files/pt-br/web/api/blob/index.html | 130 | ||||
| -rw-r--r-- | files/pt-br/web/api/blob/size/index.html | 60 | ||||
| -rw-r--r-- | files/pt-br/web/api/blob/slice/index.html | 115 | ||||
| -rw-r--r-- | files/pt-br/web/api/blob/type/index.html | 68 |
5 files changed, 438 insertions, 0 deletions
diff --git a/files/pt-br/web/api/blob/blob/index.html b/files/pt-br/web/api/blob/blob/index.html new file mode 100644 index 0000000000..fbb8b121c5 --- /dev/null +++ b/files/pt-br/web/api/blob/blob/index.html @@ -0,0 +1,65 @@ +--- +title: Blob +slug: Web/API/Blob/Blob +translation_of: Web/API/Blob/Blob +--- +<p>{{APIRef("File API")}}</p> + +<p>Blob()</p> + +<p> </p> + +<p>Retorna um novo objeto <font>Blob</font> criado, cujo o conteúdo consiste na concatenação de um array de valores estabelecidos no parâmetro da função.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var aBlob = new Blob(<em> array[</em>, <em>options]</em>); +</pre> + +<h3 id="Parâmetros">Parâmetros</h3> + +<ul> + <li><em>array</em> é um {{jsxref("Array")}} de objetos {{jsxref("ArrayBuffer")}}, {{domxref("ArrayBufferView")}}, {{domxref("Blob")}}, {{domxref("DOMString")}}, ou uma combinação de quaisquer um destes objetos, que serão colocados dentro do {{domxref("Blob")}}. DOMStrings são codificadas como UTF-8.</li> + <li><em>option</em><em>s</em> é um dicionário opcional <code>BlobPropertyBag</code> que pode especificar os dois atributos seguintes: + <ul> + <li><code>type</code>, com um valor padrão de <code>""</code>, que representa o MIME type do conteúdo do array que será inserido no blob.</li> + <li><code>endings</code>, com um valor padrão de <code>"transparent"</code>, especifica como strings contendo o caracter de final de linha <code>\n</code> deverão ser escritos. Tem um dos dois valores: <code>"native"</code>, indicando que caracteres de final de linha são modificados para coincidir com a convenção do Sistema Operacional, ou <code>"transparent", </code>indicando que finais são armazenados no blob sem quaisquer modificações. {{non-standard_inline}}</li> + </ul> + </li> +</ul> + +<h2 id="Exemplo">Exemplo</h2> + +<pre class="brush: js language-js">var aFileParts = ['<a id="a"><b id="b">hey!</b></a>']; // an array consisting of a single DOMString +var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // the blob</pre> + +<h2 id="Specification" name="Specification">Especificação</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('File API', '#constructorBlob', 'Blob()')}}</td> + <td>{{Spec2('File API')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2> + +<div class="hidden">A tabela de compatibilidade desta página, é gerada a partir de dados estruturados. Se você quiser contribuir com mais dados, por favor vá em <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e nos envie um pull request.</div> + +<p>{{Compat("api.Blob.Blob")}}</p> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>A versão descontinuada que o construtor {{domxref("BlobBuilder")}} substitui.</li> +</ul> + +<p> </p> diff --git a/files/pt-br/web/api/blob/index.html b/files/pt-br/web/api/blob/index.html new file mode 100644 index 0000000000..f976675a1a --- /dev/null +++ b/files/pt-br/web/api/blob/index.html @@ -0,0 +1,130 @@ +--- +title: Blob +slug: Web/API/Blob +translation_of: Web/API/Blob +--- +<p>{{ APIRef("File API") }}</p> + +<h2 id="Sumário">Sumário</h2> + +<p>Um objeto <code>Blob</code> representa um objeto do tipo arquivo, com dados brutos imutáveis. Blobs representam dados que não estão necessariamente em um formato JavaScript nativo. A interface {{ domxref("File") }} é baseada no <code>Blob</code>, herdando funcionalidade blob e expandindo-o para suportar arquivos no sistema do usuário.</p> + +<p>Para construir um <code>Blob</code> a partir de outro objeto ou dado não-blob , utilize o construtor {{domxref("Blob.Blob","Blob()")}}. Para criar um blob que contém um subconjunto de dados de outro blob, use o método {{domxref("Blob.slice()", "slice()")}}. Para obter um objeto Blob de um arquivo no sistema de arquivos do usuário, veja a documentação {{domxref("File")}}.</p> + +<p>The APIs accepting <code>Blob</code> objects are also listed on the {{domxref("File")}} documentation.</p> + +<div class="note"> +<p><strong>Nota:</strong> O método <code>slice()</code> usava inicialmente <code>length</code> como segundo argumento para indicar o numero de bytes a copiar no novo <code>Blob</code>. Se você especificou valores de maneira que <code>start + length</code> excederam o tamanho do <code>Blob</code> de origem, o <code>Blob</code> retornado contém dados a partir do início do índice até o final do <code>Blob</code> de origem.</p> +</div> + +<div class="note"><strong>Nota:</strong> Esteja ciente que o método <code>slice()</code> possui prefixos de fornecedores em alguns navegadores e versões: <code>blob.mozSlice()</code> para Firefox 12 e anteriores, e <code>blob.webkitSlice()</code> para Safari. Uma versão antiga do método <code>slice()</code>, sem prefixos de fornecedor, tem semântica diferente, e portanto é obsoleta. O suporta para <code>blob.mozSlice()</code> foi descontinuado a partir do Firefox 30.</div> + +<h2 id="Construtor">Construtor</h2> + +<dl> + <dt>{{domxref("Blob.Blob", "Blob(blobParts[, opções])")}}</dt> + <dd>Retorna um novo <code>Blob</code> object cujo conteúdo consiste na concatenação do array de valores passados por parâmentro.</dd> +</dl> + +<h2 id="Propriedades">Propriedades</h2> + +<dl> + <dt>{{domxref("Blob.size")}} {{readonlyinline}}</dt> + <dd>Tamanho em bytes dos dados contidos no objeto <code>Blob</code>.</dd> + <dt>{{domxref("Blob.type")}} {{readonlyinline}}</dt> + <dd>Uma string que indica o MIME type dos dados no <code>Blob</code>. Se o tipo é desconhecido, então retorna uma string vazia.</dd> +</dl> + +<h2 id="Métodos">Métodos</h2> + +<dl> + <dt>{{domxref("Blob.slice()", "Blob.slice([start[, end[, contentType]]])")}}</dt> + <dd>Retorna um novo <code>Blob</code> object contendo dados em no intervalo de bytes especificado do <code>Blob</code> de origem.</dd> +</dl> + +<h2 id="Exemplos">Exemplos</h2> + +<h3 id="Exemplos_de_uso_do_construtor_Blob">Exemplos de uso do construtor Blob</h3> + +<p>O código a seguir:</p> + +<pre class="brush: js">var aFileParts = ['<a id="a"><b id="b">hey!</b></a>']; +var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // o blob +</pre> + +<p>equivale a:</p> + +<pre class="brush: js">var oBuilder = new BlobBuilder(); +var aFileParts = ['<a id="a"><b id="b">hey!</b></a>']; +oBuilder.append(aFileParts[0]); +var oMyBlob = oBuilder.getBlob('text/xml'); // o blob +</pre> + +<div class="warning"> +<p>O {{ domxref("BlobBuilder") }} oferece outra maneira para criar Blobs, mas é depreciado e não deveria mais ser usado.</p> +</div> + +<h3 id="Exemplo_para_criar_uma_URL_para_uma_array_tipada_usando_blob">Exemplo para criar uma URL para uma array tipada usando blob</h3> + +<p>O código a seguir:</p> + +<pre class="brush: js">var typedArray = GetTheTypedArraySomehow(); +var blob = new Blob([typedArray], {type: 'application/octet-binary'}); // passe um MIME-type útil aqui +var url = URL.createObjectURL(blob); +// url será algo do tipo: blob:d3958f5c-0777-0845-9dcf-2cb28783acaf +// agora você pode usar a URL em qualquer contexto em que URLs regulares podem ser usadas, por exemplo: img.src, etc. +</pre> + +<h3 id="Exemplo_de_Extração_de_Dados_de_Um_Blob">Exemplo de Extração de Dados de Um Blob</h3> + +<p>O único jeito de ler o conteúdo de um Blob é usando {{domxref("FileReader")}}. O código a seguir lê o conteudo de um Blob como um Array.</p> + +<pre class="brush: js">var reader = new FileReader(); +reader.addEventListener("loadend", function() { + // reader.result contém o conteúdo do blob como uma array tipada +}); +reader.readAsArrayBuffer(blob);</pre> + +<p>Ao usar outros métodos de {{domxref("FileReader")}}, é possível ler o conteúdo de um Blob como uma string ou como uma data URL.</p> + +<h2 id="Browser_Compatibility" name="Browser_Compatibility">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificações</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('File API','#blob','Blob')}}</td> + <td>{{Spec2('File API')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilidade de Browser</h2> + +<div class="hidden">Tabela de compatibilidade gerada a partir de dados estruturados. Para contribuir, confira <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> e envie-nos um Pull-Request.</div> + +<p>{{Compat("api.Blob")}}</p> + +<h3 id="Notas_para_Gecko">Notas para Gecko</h3> + +<p>Anterior ao Gecko 12.0 {{ geckoRelease("12.0") }}, havia um bug que afetava o comportamento do {{ manch("slice") }}; que não funcionava para as posições <code>start</code> e <code>end</code> fora do intervalo de valores assinados como 64-bit; este bug foi corrigido para dar suporte a valores assinados como 64-bit.</p> + +<h2 id="Chrome_Code_-_Disponibilidade_de_Escopo">Chrome Code - Disponibilidade de Escopo</h2> + +<p>No escopo JSM, <code>Blob</code> é disponivel sem a necessidade de nada especial.</p> + +<p>No escopo Bootstrap, ele deve ser importado como tal:</p> + +<pre class="brush: js">const {Blob, Services} = Cu.import('resource://gre/modules/Services.jsm', {});</pre> + +<h2 id="Veja_Também">Veja Também</h2> + +<ul> + <li>{{ domxref("BlobBuilder") }}</li> + <li>{{ domxref("File") }}</li> +</ul> diff --git a/files/pt-br/web/api/blob/size/index.html b/files/pt-br/web/api/blob/size/index.html new file mode 100644 index 0000000000..f73f76dca2 --- /dev/null +++ b/files/pt-br/web/api/blob/size/index.html @@ -0,0 +1,60 @@ +--- +title: Blob.size +slug: Web/API/Blob/size +translation_of: Web/API/Blob/size +--- +<div>{{APIRef("File API")}}</div> + +<p>A propriedade <strong><code>Blob.size</code></strong> retorna o tamanho em bytes de {{domxref("Blob")}} ou um {{domxref("File")}}.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var sizeInBytes = <em>blob</em>.size +</pre> + +<h3 id="Valor">Valor</h3> + +<p>Um número.</p> + +<h2 id="Exempl0">Exempl0</h2> + +<pre class="brush:js">// fileInput é um HTMLInputElement: <input type="file" multiple id="myfileinput"> +var fileInput = document.getElementById("myfileinput"); + +// files é um objeto FileList (similiar ao NodeList) +var files = fileInput.files; + +for (var i = 0; i < files.length; i++) { + console.log(files[i].name + " has a size of " + files[i].size + " Bytes"); +}</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('File API', '#dfn-size', 'size')}}</td> + <td>{{Spec2('File API')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2> + +<div> + + +<p>{{Compat("api.Blob.size")}}</p> +</div> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>{{domxref("Blob")}}</li> +</ul> diff --git a/files/pt-br/web/api/blob/slice/index.html b/files/pt-br/web/api/blob/slice/index.html new file mode 100644 index 0000000000..a6f44cfebd --- /dev/null +++ b/files/pt-br/web/api/blob/slice/index.html @@ -0,0 +1,115 @@ +--- +title: Blob.slice() +slug: Web/API/Blob/slice +translation_of: Web/API/Blob/slice +--- +<div>{{APIRef("File API")}}</div> + +<p>O método <strong><code>Blob.slice()</code></strong> é usado para criar um novo {{domxref("Blob")}} object <span lang="pt">contendo os dados no intervalo especificado de bytes da fonte </span>{{domxref("Blob")}}.</p> + +<div class="note"><span lang="pt">Nota: Esteja ciente de que o método <code>slice ()</code> tem prefixos de fornecedores em alguns navegadores e versões: <code>blob.mozSlice ()</code> para Firefox 12 e anteriores e <code>blob.webkitSlice ()</code> no Safari. Uma versão antiga do método <code>slice ()</code>, sem prefixos de fornecedor, tinha uma semântica diferente e é obsoleta</span></div> + +<h2 id="Sintaxe">Sintaxe</h2> + +<pre class="syntaxbox">let blob = instanceOfBlob.slice([start [, end [, contentType]]]);</pre> + +<h3 id="Parâmetros">Parâmetros</h3> + +<dl> + <dt><code>start</code> {{optional_inline}}</dt> + <dd>An index into the {{domxref("Blob")}} indicating the first byte to include in the new {{domxref("Blob")}}. If you specify a negative value, it's treated as an offset from the end of the string toward the beginning. For example, -10 would be the 10th from last byte in the {{domxref("Blob")}}. The default value is 0. If you specify a value for <code>start</code> that is larger than the size of the source {{domxref("Blob")}}, the returned {{domxref("Blob")}} has size 0 and contains no data.</dd> + <dt><code>end</code> {{optional_inline}}</dt> + <dd>An index into the {{domxref("Blob")}} indicating the first byte that will *not* be included in the new {{domxref("Blob")}} (i.e. the byte exactly at this index is not included). If you specify a negative value, it's treated as an offset from the end of the string toward the beginning. For example, -10 would be the 10th from last byte in the {{domxref("Blob")}}. The default value is <code>size</code>.</dd> + <dt><code>contentType</code> {{optional_inline}}</dt> + <dd>The content type to assign to the new {{domxref("Blob")}}; this will be the value of its <code>type</code> property. The default value is an empty string.</dd> +</dl> + +<h3 id="Return_value">Return value</h3> + +<p>A new {{domxref("Blob")}} object containing the specified data from the source {{domxref("Blob")}}.</p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Specification</th> + <th>Status</th> + <th>Comment</th> + </tr> + <tr> + <td>{{SpecName("File API", "#dfn-slice", "Blob.slice()")}}</td> + <td>{{Spec2("File API")}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>10 {{property_prefix("webkit")}} [1]<br> + 21</td> + <td>{{CompatVersionUnknown}}</td> + <td>5 {{property_prefix("moz")}} [1]<br> + 13 [2]</td> + <td>10</td> + <td>12 [1]</td> + <td>5.1 {{property_prefix("webkit")}} [3]</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("13.0")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] The <code>slice()</code> method had initially taken <code>length</code> as the second argument to indicate the number of bytes to include in the new <code>Blob</code>. If you specified values such that <code>start + length</code> exceeded the size of the source <code>Blob</code>, the returned <code>Blob</code> contained data from the start index to the end of the source <code>Blob</code>. That version of the <code>slice()</code> was implemented in <a href="https://hg.mozilla.org/mozilla-central/rev/1b3947ed93c6">Firefox 4</a>, <a href="http://trac.webkit.org/changeset/55670">WebKit</a>, and <a href="http://www.opera.com/docs/specs/presto28/file/#blob">Opera 11.10</a>. However, since that syntax is differed from <a href="/en-US/JavaScript/Reference/Global_Objects/Array/slice"><code>Array.slice()</code></a> and <a href="/en-US/JavaScript/Reference/Global_Objects/String/slice"><code>String.slice()</code></a>, Gecko and WebKit removed support and added support for the new syntax as <code>Blob.slice()</code>/<a href="http://trac.webkit.org/changeset/83873"><code>Blob.webkitSlice</code></a>.</p> + +<p>[2] Prior to Gecko 12.0 {{geckoRelease("12.0")}}, there was a bug that affected the behavior of <code>Blob.slice()</code>; it did not work for <code>start</code> and end positions outside the range of signed 64-bit values; it has now been fixed to support unsigned 64-bit values.</p> + +<p>[3] This was implemented in <a href="http://trac.webkit.org/changeset/83873">534.29</a>.</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>{{domxref("Blob")}}</li> + <li>{{domxref("BlobBuilder")}}</li> +</ul> diff --git a/files/pt-br/web/api/blob/type/index.html b/files/pt-br/web/api/blob/type/index.html new file mode 100644 index 0000000000..789aa0c9c9 --- /dev/null +++ b/files/pt-br/web/api/blob/type/index.html @@ -0,0 +1,68 @@ +--- +title: Blob.type +slug: Web/API/Blob/type +translation_of: Web/API/Blob/type +--- +<div>{{APIRef("File API")}}</div> + +<p>A propriedade <strong><code>type</code></strong> de um objeto <a href="/en-US/docs/Web/API/Blob"><code>Blob</code></a> fornece <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types">MIME type</a> do arquivo. Ela retorna uma string vazia se o tipo não puder ser determinado.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var mimetype = <var>instanceOfFile</var>.type</pre> + +<h2 id="Valor">Valor</h2> + +<p>Uma string</p> + +<h2 id="Exemplo">Exemplo</h2> + +<pre class="brush:js">var i, fileInput, files, allowedFileTypes; + +// fileInput é um HTMLInputElement: <input type="file" multiple id="myfileinput"> +fileInput = document.getElementById("myfileinput"); + +// files é um objeto FileList (similiar ao NodeList) +files = fileInput.files; + +// nossa aplicação permite apenas imagens dos tipos *.png, *.jpeg and *.gif +allowedFileTypes = ["image/png", "image/jpeg", "image/gif"]; + +for (i = 0; i < files.length; i++) { + // Testa se file.type é um tipo de arquivo permitido. + if (allowedFileTypes.indexOf(<strong>files[i].type</strong>) > -1) { + // file type é um dos tipos permitidos. Código aqui. + } +}); +</pre> + +<h2 id="Especificações">Especificações</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Especificação</th> + <th scope="col">Status</th> + <th scope="col">Comentário</th> + </tr> + <tr> + <td>{{SpecName('File API', '#dfn-type', 'type')}}</td> + <td>{{Spec2('File API')}}</td> + <td>Definição inicial.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2> + +<div> + + +<p>{{Compat("api.Blob.type")}}</p> +</div> + +<h2 id="Veja_também">Veja também</h2> + +<ul> + <li>{{domxref("Blob")}}</li> +</ul> |