A solução do html2canvas para o problema de que as imagens não podem ser interceptadas normalmente

Primeiro, vamos falar sobre os problemas que encontramos. Em primeiro lugar, existe essa necessidade. O front-end precisa gerar imagens dinamicamente com base nos dados transmitidos pelo back-end. Os direitos autorais, as imagens de fundo e os avatares do usuário nas imagens são todos obtidos por meio da interface de back-end. No entanto, algumas imagens no canvas geradas usando html2canvas foram geradas com sucesso no canvas. Mas algumas fotos não aparecerão de qualquer maneira.

Estou trabalhando no projeto há muito tempo sem resultados e há muito tempo pesquisando no Google sem resultados. Houve algum desespero neste momento. De repente me ocorreu: por que não dar uma olhada no site oficial? Então vi o seguinte conteúdo no site oficial.

Limitações<br/>

Todas as imagens que o script usa precisam residir na mesma origem para que ele possa lê-las sem a ajuda de um proxy. Da mesma forma, se você tiver outros elementos de tela na página que foram contaminados com conteúdo de origem cruzada. , eles ficarão sujos e não serão mais legíveis pelo html2canvas.<br/>

O script não renderiza conteúdo de plug-in, como miniaplicativos Flash ou Java.

Do que está falando? Aqui está uma tradução para estudantes que não são bons em inglês. Se você é bom em inglês, pode ler o texto acima diretamente. O significado geral é que no html2canvas são utilizados scripts para operar, ou seja, scripts são utilizados para converter html em canvas, mas há uma restrição, ou seja, imagens de código cruzado não podem ser utilizadas. Se usado, o html2canvas não lerá o recurso.

É por isso que algumas imagens na tela convertida ficam sempre em branco. Se houver outras telas na página que também usam recursos de imagem de origem cruzada, o html2canvas não as lerá.

Basta encaminhar os recursos estáticos uma vez e permitir o carregamento de recursos de origem cruzada na configuração do html2canvas.

O texto acima é todo o conteúdo deste artigo. Espero que seja útil para o estudo de todos. Também espero que todos apoiem a Rede VeVb Wulin.