外部ブログカードの表示不具合について

Simplicityの特徴 フォーラム Simplicity2に関する話題何でも 外部ブログカードの表示不具合について

  • このトピックには17件の返信、2人の参加者があり、最後にまさにより5年、 3ヶ月前に更新されました。
17件の返信スレッドを表示中
  • 投稿者
    投稿
    • #44394 返信
      まさ
      ゲスト

      2.2.5を導入したのですが、外部ブログカードで「ブログカード(独自キャッシュ)」を利用すると、ことごとくタイトルが「This page is error.」になってしまいます。
      下記のスレッドは確認していますが、解決前の状態と同じ状態だと思います。非SSLのサイトのカードは問題無く表示されます。
      https://wp-simplicity.com/suport/topic/%E3%80%8C%E3%82%A8%E3%83%B3%E3%83%88%E3%83%AA%E3%83%BC%E3%82%AB%E3%83%BC%E3%83%89%E5%85%A8%E4%BD%93%E3%82%92%E3%83%AA%E3%83%B3%E3%82%AF%E5%8C%96%E3%80%8D%E3%81%A7%E5%A4%96%E9%83%A8%E3%82%AB%E3%83%BC/#post-44262

      これでは困るのでブログカードタイプを「はてなカード」にしたところ、表示内容は問題無いのですが、PCで表示した際にも横幅が300pxになってしまい、狭くなってしまいます。
      オプションでは「カード幅を広げる」はONにしています。一例は下記ページです。
      https://masalog.net/ssl.html

      ご確認お願いいたします。当方で試してみるべき点がありましたらご指摘ください。

    • #44395 返信
      まさ
      ゲスト

      上記、2点目のブログカードタイプを「はてなカード」にした場合に300px幅になる件については、1度「カード幅を広げる」をオフにしてリロードし、再度オンにしたところ通常表示されるようになりましたので、取り下げます。
      「ブログカード(独自キャッシュ)」でSSLサイトが「This page is error.」になる件は、サムネイルのキャッシュ、ブラウザ、サーバーのキャッシュを削除しても解消されません。
      「暗号化スイート」というのが何を調べれば良いのか分からないため、何かこちらで調べるべき点があれば、ご指示ください。

    • #44396 返信
      hidekichi
      ゲスト

      ちなみにですけれども、最近この手の質問が多いので代替案として、あくまでページの更新頻度が少なく、公式の今後のアップデートが多くの場合に問題なく表示できるまでの繋ぎで、かつ外部ブログカードをどうしても利用したい場合のみ、半年ぐらい前のエントリーですけれども「Simplicityを少し改造してみた 番外編part18 外部サイトのogpを取得してブログカードを作る」というのもあります。

      更新頻度が少ない場合と言っているのは、うちのやり方では、urlを直接読み込んでおらず、
      <div class="exBlog">http(s)://ここのアドレス</div>
      を読み込んでいます。そのため、公式の実装が今後、アップデートされて通常に問題なく利用できるようになった時に元に戻すのが面倒だからです。

      機能として相手サイトのogp情報から読み取ったデータをjsonで取得してjQueryで表示するというものですが、以前の外部ブログカードがはてブからの取得しかなかった時に、外部ブログカードをcssでスタイルできないものかと試しに作ったものです。

      相手サイトにアクセスしてogpを直接読み取れないものかとテストした投稿です。httpサイトとhttpsサイトどちらからでも、いずれのタイプのサイトもブログカード化できます。

      条件としては、相手サイトがogpを入れていることと、自分のサイトでjavascript(jQuery)にエラーがないことです。

      –*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–

      さて、ここからはわいひらさんに向けてですが、open-graph.phpのfetchの部分で、オリジナルのスクリプトを書き換えてあるのは何かしら問題があって変更されたと思うんですが、その問題というのはなんだったでしょうか?

      たぶんいずれかのトピックでその問題が出て、現在の形になっているのだろうと思うんですが、もしその問題が特定の環境の問題だった可能性もあるので、これとわかるようなトピックへのリンクか何かアレば教えてほしいんですけれども。

      –*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–*–

      ここから話は戻り、まささんの環境でうまく行くかどうかは不明ですがsimplicity2/lib/open-graph.phpの中にあるfetchの部分で

      static public function fetch($URI) {
              /*
              $args = array(
                'sslverify' => is_ssl_verification_enable(),
                'redirection' => 10,
                'simplicity' => true,
              );
              $res = wp_remote_get( $URI, $args );
              // echo('<pre>');
              // var_dump($res);
              // echo('</pre>');
              if (!is_wp_error( $res ) && $res["response"]["code"] === 200) {
                $response = $res['body'];
              }
              //var_dump($response);
              if (!empty($response)) {
                  return self::_parse($response);
              } else {
                  return false;
              }
              */
              $curl = curl_init($URI);
      
              curl_setopt($curl, CURLOPT_FAILONERROR, true);
              curl_setopt($curl, CURLOPT_FOLLOWLOCATION, true);
              curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
              curl_setopt($curl, CURLOPT_TIMEOUT, 15);
              curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
              curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
              curl_setopt($curl, CURLOPT_USERAGENT, $_SERVER['HTTP_USER_AGENT']);
      
              $response = curl_exec($curl);
      
              curl_close($curl);
      
              if (!empty($response)) {
                  return self::_parse($response);
              } else {
                  return false;
              }
      }

      こんな感じにして、オリジナルのスクリプトに書き直してみてください。うちのcloud9のssl環境ではこれで表示できなかったものが表示できるようになりました。これは最初のjQueryを利用する方のでも利用している元々のスクリプトです。
      これでは解決できない場合もあるかもしれないので、Simplicityのスクリプトの状態もコメントアウトして元に戻せるように上記みたいな感じにしておくとよいかと思います。

      さて、次に同/lib/blog-card.phpの「//外部サイトから直接OGP情報を取得してブログカードにする」のコメントがあるところから少し下にある、「require_once('open-graph.php');」付近ですが、

      $ogp = get_transient( $url_hash );

      は、キャッシュされたデータの部分で、this page errorの表示があるブログカードのところでは、$ogpに”error”というのが入って返ってきていると思います。キャッシュが切れるまでずっとエラーなので、確認用に、

      if (  empty($ogp) )
      //  ↓
      if ( empty($ogp) || $ogp == "error") {

      と修正して、errorでキャッシュされているものもogpを取得しに行くように一時的に書き換えてみてください。
      流れとして、/lib/open-graph.phpのfecth部分でsimplicityによって変更したものをコメントアウトし、スクリプトのオリジナルに戻し、/lib/blog-card.phpの上記を一時的に変更するという感じです。

      もし、これで該当の外部リンクがブログカードとして正しく表示できるのであれば、まささんのサイトはopen-graph.phpの修正をして、キャッシュ切れを待つか、一時的にキャッシュされているデータを削除すれば正常に表示されるはずです。
      blog-card.phpに「//テーマを変更時にブログカードのキャッシュを削除」と言うのがあったので、テーマを変えたらキャッシュは削除できるんじゃなかろうかと。これは他にも方法はあるかと思います。

      もし正常に表示できたら、blog-card.phpの変更した部分を、

      if (  empty($ogp) || $ogp == "error" )
      //  ↓
      if ( empty($ogp) ) {

      のように元に戻せばよいだけとなります。

      どうなるかはやってみないとわかりませんが、少なからずうちのサイトでは取得できなかったブログカードもこれで取得できるようになっています。

    • #44404 返信
      まさ
      ゲスト

      hidekichiさん

      いつもありがとうございます。教えていただいたコードで出力されるようになりました。
      キャッシュは一旦別テーマにすることでクリア済みです。当面このファイルを子テーマの方に配置しておくことにします。

    • #44410 返信
      わいひら
      キーマスター

      さて、ここからはわいひらさんに向けてですが、open-graph.phpのfetchの部分で、オリジナルのスクリプトを書き換えてあるのは何かしら問題があって変更されたと思うんですが、その問題というのはなんだったでしょうか?

      これは、オリジナルの書き方だと、テーマチェッカーでエラーが出るからです。(wp_remote_getで取得しないとエラーが出る。curl_execとかだとかなり減点されます)
      野良テーマが、点数をそこまで気にする必要はないかもしれませんが、一応これまで満点できたので、出来る限り満点でいきたいと思ったので現在のコードになっています。

    • #44413 返信
      hidekichi
      ゲスト

      > わいひらさん

      Simplicityのスクリプトの方で試してみたんですが、

      'sslverify' => is_ssl_verification_enable(),
      この部分のis_ssl_verification_enable()はカスタマイザーではtrueで設定されていますがこの箇所では「1」が返ってきています。trueも1も同じことですが、sslverifyの値としてはtrue|falseいずれかでなくてはダメなのではなかろうかと思ったりなんちゃったり。

      レスポンスコードを取得する関数で、wp_remote_retrieve_response_code()と言うのがありますが、例えば、
      $check = wp_remote_retrieve_response_code( wp_remote_get(URL) );
      と書くとレスポンスコードが取得できます。この$checkを表示するようにしてみて、上記sslverifyでis_ssl_verification_enable()を入れてみると何も返ってこない、つまりはエラーでスキップされていると思われます。

      と思うんですが、取得できるときもあってなんだかアレです(笑)

      で、もう1点、'simplicity' => trueですが、これもコメントアウトして、代わりに'user-agent' => $_SERVER['HTTP_USER_AGENT']を突っ込んでみました。そうするとレスポンスコードが拾えているように思います。

      $args = array(
        //'sslverify' => is_ssl_verification_enable(),
        'sslverify' => false, //trueでもok
        'redirection' => 10,
        //'simplicity' => true,
        'user-agent' => $_SERVER['HTTP_USER_AGENT']
      );
      $res = wp_remote_get( $URI, $args );
      $check = wp_remote_retrieve_response_code( $res );

      と、こんな感じです。これでエラーが特にでなくなりました。正しくイケてるのかどうかは定かではないですが$argsの中身のこのコメントアウトしている2点が気になったので確認してみてください。
      sslverifyはtrueでもfalseでも特にエラーはなかったように思います。user-agentはなくてもデフォルトでexample.comみたいのが入るみたいなので良いかとは思うんですが、まぁ入れておいたほうが良いかもと。
      あるいは、codexにあるように、
      'user-agent' => 'WordPress/' . $wp_version . '; ' . get_bloginfo( 'url' ),
      とするのが良いかもしれませんね。

      ちなみに上記$checkは正常に取得できた場合「200」が返ってきます。上記は表示用に僕が勝手に追記しましたが、
      $res["response"]["code"] === 200
      これの代用みたいなものです。

      echo "<pre>";
      print_r($check);
      echo "</pre>";

      で、

      こんな感じで確認用にしてみました。

      if (!is_wp_error( $res ) && $res["response"]["code"] === 200) {
      // ↓
      if (!is_wp_error( $res ) && $check === 200) {

      でもイケると思います。

    • #44424 返信
      わいひら
      キーマスター

      ありがとうございます。
      とりあえず、こんな感じに修正してみました。
      https://github.com/yhira/simplicity2/commit/7616562c44e4803a590ef265291cab8da41cd28a

      修正後のテーマが以下。
      https://wp-simplicity.com/wp-content/uploads/2016/08/simplicity2-1.zip
      もし、エラーが出ている方があおられましたら試していただけると幸いです。

    • #44428 返信
      hidekichi
      ゲスト

      is_ssl_verification_enable()を$argsに入れる前に調べて、trueかfalseのstringで指定したほうが良いのでは?と思うんですけどね。boolだとアレなのかな?と思ったり。

      'simplicity' => true,がいるかどうかがわかりませんが、これ入れるのは何かしら意味があるんですかね?

      それとgitHubに入っている、$wp_versionを入れる場合は、global $wp_version;が予めいるかもしれません。値が取れているかを確認したほうが良いかと思います。

      参考: wp_remote_get() | codex(en版)

    • #44453 返信
      わいひら
      キーマスター

      is_ssl_verification_enable()を$argsに入れる前に調べて、trueかfalseのstringで指定したほうが良いのでは?と思うんですけどね。boolだとアレなのかな?と思ったり。

      stringで指定するんですか?Function Reference/wp remote getでは、boolのようですけど。

      ‘simplicity’ => true,がいるかどうかがわかりませんが、これ入れるのは何かしら意味があるんですかね?

      これに付いては、以下のtechnoteさんの方法を取り入れています。
      「エントリーカード全体をリンク化」で外部カードのタイトルが外に追い出される

      global $wp_version;が予めいるかもしれません。値が取れているかを確認したほうが良いかと思います。

      これは、その後の動作確認でnoticeに気づいて修正済みです。
      https://github.com/yhira/simplicity2/commit/3ee93648290f11262a0cae5974134c560aaf3aff

    • #44458 返信
      hidekichi
      ゲスト

      > stringで指定するんですか?
      > Function Reference/wp remote getでは、boolのようですけど。

      boolはboolでも1 or 0ではなく、true or falseです。何が正しく動作するかは本体の解析と言うか、どう受け取ってどう処理しているかまで調べないといけないので調べてませんが、どのサイト見てもtrue|false指定です。
      is_ssl_verification_enable()の値は、1できてます。カスタマイザーはtrue指定でした。

      >> ‘simplicity’ => true,がいるかどうかがわかりませんが、
      >> これ入れるのは何かしら意味があるんですかね?

      おそらくですが、僕が過去に何かしら読んだ時の記憶では、sslverifyはfalseにしとけとあったような気がします。リダイレクトの嵐を発生させるつもりか?みたいなよくわからない文章でしたが、通常利用の場合はsslverifyはなくても動作します。ぶっちゃけると$argsは不要ぐらいかと。
      ただし、相手がロードバランサ配下等にあった場合とか、何かしら特殊な構成(一般的というよりは、更に何かしら手を加えてあるようなサーバー)は、相手が受け取れるように予め「入りますよ」と聞いて「どうぞ」と返事があったときにだけ入れるとかそういう具合かと思うんですけどね。

      これはいろんなサーバーで検証してみないといけませんが、could9(ssl)→xseverは普通にアドレスだけで取得できるはずです。

      例えば、こちらのレスではGoogleが取得できなかったとありましたが、

      $args = array(
        'sslverify' => false,
        'user-agent' => $_SERVER['HTTP_USER_AGENT']
      );

      これで取得できます。
      一応スクリーンショットつけときます。

      他の候補、

      https://wp-simplicity.com/
      https://goo.gl/s2scMU
      https://wp.z.com/jp/
      https://www.xserver.ne.jp/
      https://www.amazon.co.jp/
      https://www.nhk.or.jp/
      https://www.google.co.jp/

      これらも全て取得できます。ただし上記の$argsの時です。$argsの中身をコメントアウトするとやはりエラー(this page error)は出ます。

      Xserverのsslもcloudflare上にあるかと思うので、cloudflareと言うよりは、相手のサーバーの構成によりけりなのかなと思ったりしてます。

    • #44459 返信
      hidekichi
      ゲスト

      >> could9(ssl)→xseverは普通にアドレスだけで取得できるはずです。

      試してみた所、これはアドレスだけで取得できました。$args全コメントアウトで。
      ちなみにuser-agentはいじくれるわけですから、ここにSimplicityを含めるのは良いのではないかと思います。

      CAの強度とかそういうのもあるんでしょうかね?
      ここらはなんともわかりませんが、Xserverとかのsslはどちらかというとなんちゃってsslに近い方なので、本来のsslサーバー立ててどうのと言うようなサーバーとは違い、普通に取得自体はできるだろうと思います。

      テスト環境はwordpress最新版(2016/08/18現在)、Simplicity最新版(同)、cloud9(ssl)→各sslサイトです。

    • #44460 返信
      hidekichi
      ゲスト

      それから、

      http://wordpress.sainoa.com/archives/369

      も取得できないと言うレスがありましたが、取得できます。ちょっと大きいかもしれませんがSSを。

    • #44462 返信
      hidekichi
      ゲスト

      しまった!!書き込んでしまった。

      で、ここからなんですが、リンクのトピックのsainoaさんは、そのトピックで問題なく表示することができたと言うことでトピックは解決しています。

      うちでは、特別大変なことをせずとも取得できているので、そういった(手を加えないといけない)場合がある場合もあると言う感じかと思います。これは取得できていない人達に、どっちの方法で取得できるかと、どのサーバーを利用しているかを確認しないといけないのかもしれませんね。

    • #44463 返信
      hidekichi
      ゲスト

      いま他のトピックを見てたら、
      https://www.squarespace.com/が取得できないと言うことでしたが、

      はい、この通り!!

    • #44465 返信
      わいひら
      キーマスター

      #44458
      こちらにもあるように、is_ssl_verification_enable()は、必ずbool値になるように変更しているつもりです。

      function is_ssl_verification_enable(){
        if ( get_theme_mod( 'ssl_verification_enable', true ) ) {
          return true;
        } else {
          return false;
      }

      https://github.com/yhira/simplicity2/commit/7616562c44e4803a590ef265291cab8da41cd28a

      sslverifyは、デフォルトがtrueなのでSimplicityもそれに準じています。
      それでもサーバーの設定か何かで、取得できない場合のため、テーマカスタマイザーから設定できるようになっています。

    • #44466 返信
      わいひら
      キーマスター

      #44463
      これなんですが、
      OGP取得の以下の部分を
      'user-agent' => 'WordPress/' . $wp_version . '; ' . get_bloginfo( 'url' ),
      以下のように変更すると取得できるようになりました。
      'user-agent' => $_SERVER['HTTP_USER_AGENT'],

      これは、予想なんですがよくわからんユーザーエージェントを弾いているのかなと。とりあえず、以下のような設定で今のところ全部うまくいっているので、ちょっと様子を見たいと思います。

              $args = array(
                'sslverify' => is_ssl_verification_enable(),
                //'sslverify' => false,
                //'redirection' => 10,
                'simplicity' => true,
                'user-agent' => $_SERVER['HTTP_USER_AGENT'],
                //'user-agent' => 'WordPress/' . $wp_version . '; ' . get_bloginfo( 'url' ),
              );
    • #44470 返信
      hidekichi
      ゲスト

      #44465

      については、trueでもfalseでもどちらでも問題なく取得できたのは前レスでも書いたとおりなんですが、bool値の話で言うと、boolなんですから1|0、もしくはtrue|falseでよいわけです。
      これが本体でboolとして扱うようにキャストしてアレば何も問題ではありませんが、PHPの場合型を明示しないので、しといた方がわかりやすいんじゃないのと言う意味と、間違いなく伝わると言う点からの話だけです。

      大体の所、ブラウザで見れるものはcURLでたいてい取得できるはずです。内部のリダイレクトは本体の方で処理してるでしょうし、僕もuser-agentはかなり怪しいと思ってます。なので、こっそりと通常のブラウザのUAにsimplicityを入れとくぐらいでよいのではなかろうかと思った次第です。

      例えばクロスドメインで(jsonpのように)相手のデータを取得する際に、こっちから相手にcallbackで取得できるように何かしらする場合は、$argsの内容がいろいろ決めてないといけないかと思うんですが、httpで相手のサイトにアクセスしてデータ見るだけで弾かれると言うのは特殊なケースなんじゃなかろうかと思うわけですよ。

      で、今ちょっと試してみた所、user-agentだけ入ってればthis page errorのところも拾えました。sslverifyはデフォルトでtrueなのであれば、別に書いておかなくてもよいかと思います。falseの時だけ追加するみたいな感じで良いのではなかろうかと。
      まぁ書いておいても良いんですけどね(笑)

      つまり、cronのようなもので、bot的にデータを収集するのは弾くけど、ua付きでブラウザの振る舞いでアクセスしたら見れるとかそういう具合なのではないかなぁと想像します。

    • #44476 返信
      まさ
      ゲスト

      わいひらさん

      元投稿をさせていただいた、まさです。

      トピックの内容にはついていけなくなってしまっていますが、
      simplicity2-1.zip
      にテーマを差し替えたところ、上記のopen-graph.phpのカスタマイズ無しでも
      確認できる範囲では、外部ブログカードの表示の問題が発生しなくなりました。
      ひとまずご報告まで。

17件の返信スレッドを表示中
返信先: 外部ブログカードの表示不具合についてで#44476に返信
あなたの情報:




スポンサーリンク
アドセンス(大)
アドセンス(大)