vueを使って駅Bのランダムな検索キーワード画像を出力するのもつまらない！

http://ciyuanai.net/icon/それです~ B ステーションで毎日これらの写真を見ることができます、とても面白いです 233

もともと欲しいですこれらの画像をダウンロードするための Nodejs クローラーを作成する必要がありますが、Cherio を通じてページ要素を取得すると、Web ページのソース コードを確認した後、常に unknown というプロンプトが表示されます。 ！ネットワークを見てみると、確かに何もありませんでした。 jsonを使って出力されていることが分かりました！

Vue を使用して直接出力することを考えました。これは v-for のものです。しかし、ajaxGet を使用した後、それがクロスドメインであることがわかりました。 jsonpやCORSなどのソリューションを使いたかったのですが、実装がかなり面倒そうなので、ここではPHPのcurlを使いました(笑!なんというアーティファクト)

PHPのcurl_initを介してWebページのコンテンツを取得します:

$ch = curl_init();curl_setopt($ch, CURLOPT_URL, $url);curl_setopt($ch, CURLOPT_HEADER, 0);curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);curl_setopt($ch, CURLOPT_ENCODING, "application/json"); //添加此项设置json编码，否则返回乱码；curl_setopt($ch, CURLOPT_TIMEOUT, 60);$json = curl_exec($ch);curl_close($ch);print_r($json);

わかりました!クロスドメインの問題は解決されました~

jq の $.getJSON または $.ajax を介して php によって返されたデータを直接取得できます。ここでは vue-resource を使用し、最後に v-for を使用して出力をループします。ページに行きます！このページでは、非常に強力なレイアウトであるフレックス レイアウトを使用しています。