Tenho um site de carros e gostaria de saber como faço para integrar meu site de Carros com a página de carros de outro site, no casso Toyota Seminovos. vou puxar os usados de lá e colocar no meu site, mas gostaria que o layout ficasse como está no meu site e não no Toyota Seminovos.
O Toyota Seminovos me enviou um API porém não sei qual API devo usar como base para integrar na minha pagina. API DATA, API Backend, API Fetch, etc... E não sei por onde começar isso.
Alguém poderia me ajudar a fazer essa integração ou me falar como poderia fazer, existe um passo a passo pra isso?
Fiz a "integração" via HTML- link da minha pagina do Toyota Seminovos no meu site, mas o layout e tudo fica igual ao Toyota Seminovos além de mostrar outros carros para redefinir a busca.
Teria como deixar somente os meus carros como faço isso?
Obrigado.
@Bartelleleo Não consigo testar os exemplos pois a api bloqueia as requisições da url do editor devido a configuração de CORS. Você precisa pedir para que seja liberado as requisições. Esse bloqueio é gerado na api e não tem relação com o corvid!
Veja mais sobre CORS em: https://developer.mozilla.org/pt-BR/docs/Web/HTTP/Controle_Acesso_CORS
Ou talvez teria como fazer isso via XML? acho que seria mais fácil né. Como poderia ser feito?
http://integrador.autoavaliar.com.br/xml-veiculos.php?token=TeRR@S0l
@Matheus Alexandre bom dia, conseguiu ver se o código está certo, consegue me ajudar a colocar no site por favor? fico no aguardo abraço
Olá, @Bartelleleo
Para se comunicar com uma api rest você vai usar o fetch, fiz um pequeno exemplo que usa um repetidor e recupera a lista de veículos na página inicial da Toyoto seminovos.
Não fiz na listagem principal pois a requisição precisa de muitos parâmetros e o código iria ficar confuso. Outro detalhes importante é que você precisa pedir que os administradores do site da Toyoto seminovos liberem seu domínio no CORS do site( para fazer o exemplo peguei os dados de forma manual). O objetivo aqui é mostrar que é possível fazer a integração.
import { fetch } from 'wix-fetch'; const baseImg = "https://seminovostoyota.com.br/images/vehicles/thumbnail/" $w.onReady(function () { listarVeiculos() $w("#repeater1").onItemReady(($item, itemData, index) => { itemData._id = itemData.id $item("#text2").text = itemData.model; $item("#text1").text = parseInt(itemData.price).toLocaleString("pt-BR", { style: 'currency', currency: 'BRL' }); $item("#image1").src = baseImg + itemData.thumbnail }); }); async function listarVeiculos() { fetch("https://seminovostoyota.com.br/ajax/vehicles/listVehiclesHome", { "method": "get" }) .then((httpResponse) => { if (httpResponse.ok) { return httpResponse.json(); } else { return Promise.reject("Fetch did not succeed"); } }) .then(resultado => { $w('#repeater1').data = resultado.data.map(item => { item._id = item.id return item }); }) .catch(err => console.log(err)); }Resultado esperado no repetidor:
Wix fetch:
https://www.wix.com/corvid/reference/wix-fetch.html
Repetidor onItemReady :
https://www.wix.com/corvid/reference/$w.Repeater.html#onItemReady
Espero ter ajudado!