常連

WordPressのping送信に関する３つのプラグインについて
①Google XML Sitemaps
②WebSub/PubSubHubbub
③WordPress Ping Optimizer

①には記事更新のたびにgoogleとbingに通知され、早くインデックスしてもらえる機能があります。

②も同様に通知するプラグインらしいです。

③は記事公開時にしかping送信しないようにするプラグインらしいです。

そして、

④wordpressにはそもそも記事の公開、更新時にping送信する機能があるようです。

①②③が全部おすすめのプラグインということになっているのですが、これ矛盾だらけじゃないんですか？

だって、①はサイトマップを作るからともかくとして、②④は全く同じ機能じゃないんですか？また、①②を入れてしまったら、③を打ち消してしまわないんですか？ ③だけでいいような気がするのですが、僕は何か大きく誤解しているのでしょうか？

WordPressのping送信について

空港などの公共のWiFiでWPAなどでのアクセス制限をかけずに誰でも接続でき、
接続後にログインページを表示させて認証するシステムにどのような物があるか調べようと思ったのですが
そもそもそういったシステムの名称がわからず、「WiFi 認証システム」などで検索してみましたが情報が見つかりませんでした。

このようなシステム全体を指す一般名称はあるのでしょうか？

該当するタグが見つからなかったため、恐らくLinux系統の技術でも実装されてると思い`Linux`のタグを使いましたが、もっと適切な物がありましたらご教示ください。

WiFi自体にセキュリティをかけずに接続後にログインページを出すシステムの名称

アプリの開発を外注先さんでお願いしています。

アプリ内課金で下記の手数料が必要になることは調べることができました。

・開発者アカウント
AppStoreは年毎に99USD
GooglePlayは初回のみ25USD

・継続課金
AppStoreは初年度30%、2年目以降15%
GooglePlayは30%

(上記が間違っている場合はご指摘いただけると幸いです)

外注先さんからは、上記とは別に決済代行会社とも契約が必要と言われているのですが、そうなのでしょうか。

AppStoreやGooglePlayから手数料を引かれた金額が入金される形をイメージしていましたが、そうではなく決済代行会社が間に入る形になるのでしょうか。
AppStoreとGooglePlayのみで完結しないのでしょうか。


よろしくお願いいたします。

スマホアプリのアプリ内決済は別途決済代行会社が必要でしょうか

###前提・実現したいこと
スマートフォンでWEBサイトを作る際に最初に表示される画面で複数画像を一画面にぴったりと収めて表示させたい

###解決したいこと

```
iPhone 6, 6 Plus, 6s, 6s Plus 7, 7 Plus
Android 各機種

などの各種スマートフォン端末でWEBサイトを表示させた時に表示する要素を一画面にきれいにまとめて表示させたいのですが、iPhoneだけに限ってもばらついて表示されてしまい、うまくいきません。

WEBサイトで表示させる要素は

ヘッダー画像
Youtube埋め込み動画
トップメイン画像

の三つで、画像・動画のサイズはそれぞれ400x400のサイズです。
各種スマートフォンごとに一画面できっちりと収めたいのですが、何かいい方法はありませんか？

```

スマートフォンで一画面に表示

主にPHP、JavaScriptについてですが
仕事で使う社内用webプログラムを作っています。使う時間が経つにつれ、機能を増やしたくなり、それに伴いソースコードが増えていきます。

特にPHPだと、ソースコードが増えると比例してページの表示スピードが遅くなるのが目に見えて分かります。

このような場合、PHPも、JavaScriptもif構文や、switch構文を使い、条件分岐でなるべく 表示されるwebページでは実行される処理が少なくなるようにしています。（表示しているURLを取得して、処理をするかしないか、またユーザーのアクションによって実行するかしないか、など）

本題になりますが
例えば、if構文を書くとfalseの場合には、そのブロック内は読み込まれないと思うので、ソースコードはif文で特定の条件の場合のみプログラムを実行するようにしていたりしますが、実際にwebページの表示がされ終わるまでに、falseのブロック内は読み込まれていない（falseの場合の処理には、データベースへのアクセスをし、それをPHPのechoやincludeで出力、記述してあるとします）、からwebページのレンダリングのスピードには、どんなにたくさん記述されていても関係ない、ということになるのでしょうか。

質問が要点から少し外れて纏まりがなかったため、修正して質問させて頂いております。

プログラムのif構文のelseの場合の読み込みについて。

### [√] cssでアニメーションさせた要素に残像が残る

![残像が残っている様子](0d0bb24be2f4009b0367fe6515a3655c.gif)

こういう状態です．
この残像はどうしたら消せるでしょうか？

---
**ソースコード**
```html
<!DOCTYPE html>

<html lang="ja">

	<head>
		<meta charset="utf-8">
		<meta name="author" content="lan.works">
		<meta name="description" content="today's ERROR //20170601_01">
		<meta name="format-detection" content="telephone=no, address=no, email=no">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		
		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto" >
		<style>

			/*cmn*/

			*,
			*::before,
			*::after{
				font-weight: normal;
				line-height: 1em;
				padding:0;
				margin: 0;
				box-sizing: border-box;
				-webkit-tap-highlight-color:rgba(0,0,0,0);
				-webkit-user-select: none;
			}

			a,
			a:link,
			a:visited{
				text-decoration: none;
			}

			li{list-style: none;}

			img{
				max-width: 100%;
				pointer-events: none;
			}
			
			html,body{
				max-width: 100vw;
				max-height: 100vh;
			}
			html{
				font: normal 17px / 17px 'Roboto', sans-serif;
				-webkit-text-size-adjust: 100%;
			}
			
			#page_section1{
				left: auto;
				width: auto;
				margin: 0 1rem;
				padding-top:50vh;
			}
			
			
			#menubtn-switch-btn{
				position: fixed;
				bottom: 9rem;
				left: 1rem;
				width: 4rem;
				height: 4rem;
				background: rgba(255,255,255,.9);
				border: 1px solid #ccc;
			}
			#menubtn-switch-btn::before{/*bgr-shadow*/
				content: "";
				display: block;
				position: absolute;
				top: 48.75%;
				left: 25%;
				width: 50%;
				height: 2.5%;
				background: #fff;
				border-radius: 3px;
				box-shadow:
					0 0 0 1px #777,
					0 -0.7rem #777,
					0 -0.7rem 0 1px #777,
					0 0.7rem #777,
					0 0.7rem 0 1px #777;
				transition: transform .5s, box-shadow .3s .5s;
			}
			#menubtn-switch-btn::after{
				content: "";
				display: block;
				position: absolute;
				top: 48.75%;
				left: 25%;
				width: 50%;
				height: 2.5%;
				background: #fff;
				border-radius: 3px;
				box-shadow:
					0 0 0 1px #777,
					0 -0.7rem #fff,
					0 -0.7rem 0 1px #777,
					0 0.7rem #fff,
					0 0.7rem 0 1px #777;
				transition: transform .5s, box-shadow .3s .5s;
			}
			#menubtn-switch:checked +#menubtn-switch-btn::before{
				transform: rotate(-495deg);
				box-shadow:
					0 0 0 1px #777,
					0 -2px #fff,
					0 -2px 0 1px #555,
					0 2px #fff,
					0 2px 0 1px #555;
				border-radius: 0;
			}
			#menubtn-switch:checked +#menubtn-switch-btn::after{
				transform: rotate(495deg);
				box-shadow:
					0 0 0 1px #777,
					0 -2px #fff,
					0 -2px 0 1px #555,
					0 2px #fff,
					0 2px 0 1px #555;
				border-radius: 0;
			}
		</style>
		
		<title>today's ERROR //20170601_01</title>
	</head>
	
	<body>
		
		<section id="page_section1">
			<input id="menubtn-switch" type="checkbox">
			<label id="menubtn-switch-btn" for="menubtn-switch"></label>
			<p>Sed ut perspiciatis, unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam voluptatem, quia voluptas sit, aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor sit, amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit, qui in ea voluptate velit esse, quam nihil molestiae consequatur, vel illum, qui dolorem eum fugiat, quo voluptas nulla pariatur? [33] At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio, cumque nihil impedit, quo minus id, quod maxime placeat, facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet, ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.</p>
		</section>
		
	</body>

</html>
```

cssでアニメーションさせた要素に残像が残る

###前提・実現したいこと

Wordpress初心者です。MAMPで作成のサイトを、Xサーバーに移転しようとしています。
移転先新サイトは、サブドメインです。

下記のサイトを参考に進めました。
http://www.jaskun.com/wordpress/wordpress-database-iten/
https://bge.jp/wordpress-rename-manual/

searchreplacedb2.php を新サイトのURLで実行し、
Submit／Submit DB details を押したところで、下記のエラーがでて、移行が完了しませんでした。

###発生している問題・エラーメッセージ

```
Fatal error: Uncaught Error: Call to undefined function mysql_connect() in /home/ドメイン/サブドメイン（新サイトURL）/public_html/ドメイン/searchreplacedb2.php:447 Stack trace: #0 {main} thrown in /home/ドメイン/サブドメイン（新サイトURL）/public_html/ブログタイトル/searchreplacedb2.php on line 447
```

###該当のソースコード
```ここに言語を入力
ここにご自身が実行したソースコードを書いてください
```

###試したこと
ネットで調べて、下記のようにphpinhoをみてみたのですが、 
http://qiita.com/pugiemonn/items/0a452332d73e23e21183

これをみてなにを対処したらよいのか、超初心者のため、
まったくなにをどうしたら良いかなすすべなしで、袋小路にはまっています。
もしどなたか状況脱出の手立てがありましたらご教示いただけるとほんとうに助かります。



###補足情報(言語/FW/ツール等のバージョンなど)
MAMP ver4.1.1
Mac OS X 10.10.5
phpMyAdmin 4.4.15.10

ご確認いただきありがとうございます。
phpinfoの内容を追記しました↓（表組のコピペなので見づらくてすみません。）

Client API library version	5.5.52-MariaDB
Active Persistent Links   	0
Inactive Persistent Links	0
Active Links	         0
Client API header version    5.5.52-MariaDB
MYSQLI_SOCKET	/var/lib/mysql/mysql.sock

Directive	     Local Value	Master Value
mysqli.allow_local_infile  On	     On
mysqli.allow_persistent	   On	     On
mysqli.default_host	no value	 no value
mysqli.default_port	3306	     3306
mysqli.default_pw	no value	 no value
mysqli.default_socket	no value	 no value
mysqli.default_user	no value	 no value
mysqli.max_links	Unlimited	 Unlimited
mysqli.max_persistent	Unlimited	 Unlimited
mysqli.reconnect     Off        Off
mysqli.rollback_on_cached_plink	  Off   Off

Wordpress／MAMPからXサーバー

先日、リダイレクトの作業をする際に.htaccessを設定してうまくいかずいろいろ調べたところapatchの再起動が必要とわかりました。

そこでふと思ったのですが毎回apatchを再起動する必要性はなぜあるのでしょうか

こちらご存知の方がいましたらぜひご教示いただけますと幸いです。

apacthを再起動する必要はなぜあるの？

UnityでGoogleVRを使ってAndroid用VRアプリを作成しました。

Unity上で実行すると、画面が2つに分割されて表示され、VR用の表示になりました。
しかし、Build&RunでAndroid上で動作させると、1つの画面で通常のアプリのように動作します。上下左右に動かしても視点の移動もありませんでした。

VRゴーグルを使って見るために画面を2つに分割させたいのですが、何か必要なことがあるのでしょうか。

ちなみにバージョンは
Unity 5.6
GoogleVR 1.40
です。

Unityで作ったAndroid用VRアプリを動かしても画面が分割されない。

iptable (ufw) でアクセス制限かけているサイト（開いているのは、port 80,443 )のサイトで、ssh のアクセスを一時的に簡単に外すスクリプトのサンプルご存知の方がいらっしゃったらお教えください。
あるＵＲＬにアクセスすると、しばらくそのＩＰアドレスに対して、ＳＳＨのアクセスを許可するようなものです。php でなんとか作ろうと思えばつくれるのですが、すでに同様の機能をもつスクリプトが公開され、よくつかわれているならそういったものを使いたいのです。

少し違いますが、port knocking というのを見つけました。
いろいろあると思いますが、よさげなものを教えてください。
http://www.atmarkit.co.jp/fsecurity/rensai/securitytips/044knockd.html

一時的ＩＰアドレス制限を変える簡単なスクリプトを探しています。

現在

転送元
http://example.com/dirname/index.html?utm_source=aaaa&utm_medium=bbb&utm_cccc&utm_dddd

転送先
http://example.com/

にしたいのですが

```php
RewriteEngine on
RewriteCond %{QUERY_STRING} ?$
RewriteRule /dirname/index.html http://example.com/? [R=301,L]
```

のような形にしてもリダイレクトされません。
こちらどのようにすれば対応できますでしょうか

補足
・ワードプレスを使ったサイトです。
・サーバーにはkusanagiというテンプレートを使用してます。

お手数をおかけいたしますがご確認の程宜しくお願い致します。

リダイレクトに関して

###前提・実現したいこと
現在下記URLのサイトを参考にLime Surveyを用いたアンケートサイトを構築しています。
[https://www.vultr.com/docs/how-to-install-limesurvey-on-centos-7](https://www.vultr.com/docs/how-to-install-limesurvey-on-centos-7)

ところが、下に書いてある通りにFireFoxでアクセスしたところ
>Now, point your web browser to the following URL (say your server IP is 203.0.113.1), and then start the installation from there:
>http://203.0.113.1/limesurvey  (IPは自分のIPに変えてアクセスしました) 

>正常に接続できませんでした
と表示されてしまったので
127.0.0.1にアクセスしたところ、今度は
>403 Forbidden
と表示されてしまい、その後
[https://www.centos.org/forums/viewtopic.php?t=58017](https://www.centos.org/forums/viewtopic.php?t=58017)
上記サイトを参考に色々と弄ったのですが全く改善しませんでした。
###発生している問題・エラーメッセージ

```
XXX.XXX.XXX.XXXのサーバーへの接続を確立できませんでした。

    このサイトが一時的に利用できなくなっていたり、サーバーの負荷が高すぎて接続できなくなっている可能性があります。しばらくしてから再度試してください。
    他のサイトも表示できない場合、コンピューターのネットワーク接続を確認してください。
    ファイアーウォールやプロキシでネットワークが保護されている場合、Firefox によるウェブアクセスが許可されているか確認してください。
```

###試したこと
/etc/httpd/conf/httpd.confを
```
<Directory "/var/www/html">
    Options Indexes FollowSymLinks
    AllowOverride None
    Require all granted
</Directory>
```
から
```
<Directory "/var/www/html">
    Order allow,deny
    Allow from all
</Directory>
```
さらに、
へと書き換えさらに、
```
DocumentRoot "/var/www/html"
```
を
```
DocumentRoot "/var/www"
```
に書き換えて、
```
<Directory "/var/www">
    Options Indexes FollowSymLinks
    AllowOverride None
    Require all granted
</Directory>

```
を
```
<Directory "/var/www">
    Order allow,deny
    Allow from all
</Directory>
```
と書き換えても見たのですがやっぱりだめでした。
###補足情報(言語/FW/ツール等のバージョンなど)
Cent OS 7
Apache 2.4.6
lime survey 2.65.1

http://127.0.0.1/に接続できない

今回実装したい機能として

投稿フォームにて
①画像
②コメント
を送信。

管理画面にて
管理者がその投稿を承認した場合
①画像
②コメント
「instagram」「twitter」「google+」「facebook」
に投稿する機能を作成したいのですが
[phpでtwitterに投稿する](https://aws2000.net/?p=2296)
ここを参考にして作成したいのですが

調べてみたのですが
instagramに関してAPIを使っても「投稿」できる。
とは記載されておらず
この機能実装することは理論上可能なのでしょうか？

PHP 画像とコメントをSNSをサイトに投稿する。fuelphpで実装したい

下記のようの配列で、'key'の値を'name'の値と同じにしたいのですが、
'name'の値を持ってくる方法はありますか？

書き出す前に保管したいです。

```php
$array = array(
  array(
    'name' => '名前1',
    'key' => 'key_名前1',
    'fields' => array(
      array(
        'name' => '名前1-1',
        'key' => 'key_名前1-1',
        ),
      array(
        'name' => '名前1-2',
        'key' => 'key_名前1-2',
        ),
      array(
        'name' => '名前1-3',
        'key' => 'key_名前1-3',
        ),
      ),
    ),
  array(
    'name' => '名前2',
    'key' => 'key_名前2',
    'fields' => array(
      array(
        'name' => '名前2-1',
        'key' => 'key_名前2-1',
        ),
      array(
        'name' => '名前2-2',
        'key' => 'key_名前2-2',
        ),
      array(
        'name' => '名前2-3',
        'key' => 'key_名前2-3',
        ),
      ),
    ),
  );
```

[PHP]配列内で値をコピー？

抽象的な質問ですみません。
Web系のエンジニアで、自動車系の業界のIT部門にいます。
近年、IoTの世界でモノからデータをサーバに送るような試みが多くありますが、
その多くがNode.jsで開発されているような気がします。
しかしながら、Node.jsというサーバ言語がなぜそれほどIoTに適合するのかいまいちわかりません。
Node.jsにはノンブロッキングIOという仕組みがあって多くのリクエストを捌きやすいというのを聞いたことがあります。また、Socket.ioというWebSocketを実装したライブラリあることも知っています。
しかしこれらの要求は、他の汎用言語でも満たせると思いますし、JavaScriptという言語自体がサーバーサイドの開発において難易度が高そうな気がします。
僕はあまり知識がないので、簡単にでいいのでわかりやすく説明していただけないでしょうか。

なぜIoT分野ではNode.jsが用いられているのでしょうか？

wordpressでサイトを作っていて、
画面幅の大きい時はタイトルを指定の文字数で抜粋表示して、
880px以下では抜粋せずに普通に表示したくてネットで色々検索したら
それっぽいのがあり試してみたのですが表示されませんでした。

```javascript
$(document).ready(function(){
  var setWindowSize = function () {
    $.ajax({
      type: "POST",
      url: "/wp-content/themes/○○/sidebar-list.php", // 画面サイズを渡すPHPのURL
      data: "windowSize=" + $(window).width()
    });
  };setWindowSize();

  // リサイズした時にsessionを更新する為
  var timer;
  $(window).resize(function() {
    if (timer) clearTimeout(timer);
    timer = setTimeout(setWindowSize, 1000);
  });
});
```

```php
<?php
      session_start();

      if(isset($_POST['windowSize'])){
        $_SESSION['windowSize'] = $_POST['windowSize'];

        if($_SESSION['windowSize'] >= 880):
    ?>
      <p class="title"><?php echo mb_strimwidth(get_the_title(), 0, 36, "…", "UTF-8"); ?></p>
    <?php
        else:
    ?>
      <p class="title"><?php echo get_the_title(); ?></p>
    <?php
        endif;
      };
    ?>
```

このように実装したのですが、うまくいきませんでした。。

お分かりの方いましたら是非教えていただきたいです。
宜しくお願いします。

PHPで画面幅によってHTML出力を変えたいんですが、うまくできません。。

よく次のような事が言われます。
* 魚を与えるな 釣り方を教えよ
参考サイト：
- 魚を与えるな [http://meganeinfo.com/etc/entry79.html](http://meganeinfo.com/etc/entry79.html)
- 魂が震える話 [https://www.facebook.com/tamafull/posts/498025733541633](https://www.facebook.com/tamafull/posts/498025733541633)
- 釣った魚を与える人か、魚の釣り方を教える人か？ [http://hkcpa.jp/nagoya-de-kigyou/archives/764](http://hkcpa.jp/nagoya-de-kigyou/archives/764)

そこで、次の質問です。
* 多くの質問者はどういった回答を求めてるのでしょうか?
* 多くの回答者は、どういった回答を心がけているのでしょうか?
* 運営側は、どういった QA サイトを目指しているのでしょうか?

私は、 
* 質問するときは、ともかく 解決先(魚)が欲しいです。釣り方も提示されていると嬉しいですが。
* 回答するときは、釣り方を書こうと思っています。 

質問者によって、ともかく空腹を満たすことが最優先な場合と、釣り方を知りたい場合が別れると思います。
QA ページを後日も役に立つものとするためには、釣り方を書くことが優先されるかもしれません。
でも時間が経てば、釣り方も変化します。
当初の回答内容は陳腐化、場合によっては非奨励な方法になることもありえます。
この辺りの折り合いをどうつけていくか ...

プログラミングに関係ないメタな質問なのでマイナスがつくことは覚悟してます。

＃ この質問をするきっかけは、 
＃ "写真共有販売のサーバ費用" の質問とその回答群
＃ "テーブルの作り方で不明" の質問とその回答群 などを読んだことです。

追記： 2016-06-26 11:30
* ベストアンサーは、運営からの回答にだけつけます。こ
こでの質問の私の本意は "teratail 運営の方針は？" なので。
運営側からの回答の為に、利用者の回答を大いに利用していただければと思っています。

追記： 2016-06-26 19:00
 こんな twieet を目にしました。
 > ...
 >「魚です」と言って目に付いた適当な何か(たまたま魚かも知れない)を渡している人とか、「魚の釣り方です」と言ってアウトドア教本の適当なページ(たまたま魚の釣り方かもしれない)をちぎって渡してる人、がいっぱいいるのが #teratail 
 > ...
 
 落語に "蒟蒻(こんにゃく)問答" というのがあります。
 質問と回答のギャップがおもしろい落語です。
 当事者同士よりも、そのやりとりを見ている第三者が一番 学べるのかもしれません。
 
 - [YouTube https://www.youtube.com/watch?v=SB0bEbjZ8sI](YouTube https://www.youtube.com/watch?v=SB0bEbjZ8sI)
 > 落語ファン必見！五代目小さん 談志 小三治の三人落語 「蒟蒻問答」 - YouTube https://www.youtube.com/watch?v=SB0bEbjZ8sI

動画をみる時間がないかたは、テキストで粗筋を。
- 落語あらすじ事典 蒟蒻問答（こんにゃくもんどう） [http://senjiyose.cocolog-nifty.com/fullface/2005/02/post_6.html](http://senjiyose.cocolog-nifty.com/fullface/2005/02/post_6.html)


追記： 2016-06-25 10:00
* 多様性が重要と思っているので、ベストアンサーにはなりえないけど、
既にある回答とはちょっと異なる観点のものを回答すること
も心がけてます。

追記： 2018-07-30
類似質問 
teratail における回答に関して [https://teratail.com/questions/138657](https://teratail.com/questions/138657)

追記 2019-06-11

質問者が 魚 (コード）をもとめているか、　釣り方(考え方など) をもとえているかを 質問
時に明示できるような機能を teratail に追加するとよいかもしれません。
また回答への ベストアンサーも 魚の回答と、釣り方の回答のそれぞれへつけられるとよいかもしれません。

そもそも質問者が回答群のなかからベストアンセアンサーを適切に選べるのかも疑問。
現在のベストアンサーは質問者にとって一番 役立った回答であり、技術的に本当に優れた回答なのかは甚だ疑わしい。
運営側からの書き込みや teratail 機能の改善で 考え方を示して欲しい。

teratail が目指す回答は、魚か、釣り方か、それとも ...

###前提・分からないこと

いつもお世話になっております。
teratailさまにいつも、助けられています。

独学で進めてきたRuby on Railsによるサイト制作も個人の完成として、一つの区切りを迎えることができました。まず、本当にありがとうございます。
お手すきの際に、ご教示いただけると嬉しいです。

開発環境：Ruby on Rails 5.0.0.1
利用しているgem：Devise

Deviseを使って、Facebook認証をしようとしています。
エラーメッセージはおそらく、Deviseに設定されているヘルパーだとは思いますが、どうやってもこのエラーが出てしまい、Facebook認証が成功しません。

```ここに言語を入力
Could not authenticate you from Facebook because "Invalid credentials".
```
そのほか、質問者さまの投稿や、Web投稿をみて、いろいろ試してみましたが、うまくいかず。。

下記のURLを参考にしながら進めました。
[http://ticklecode.com/fb_omniauth/
](http://ticklecode.com/fb_omniauth/)

###該当するソースコード

> user.rb

```Ruby
class User < ApplicationRecord
  # Include default devise modules. Others available are:
  # :lockable, :timeoutable
  devise :database_authenticatable, :registerable, :confirmable,
         :recoverable, :rememberable, :trackable, :validatable, :omniauthable
  mount_uploader :image, ImageUploader
  validates :name, uniqueness: { case_sensitive: :false }, length: { minimum: 4, maximum: 20 }
  has_many :reviews

  def self.find_for_oauth(auth)
    user = User.where(uid: auth_uid, provider: auth.provider).first

    unless user
      user = User.create(
        uid:        auth.uid,
        provider:   auth.provider,
        email:      User.dummy_email(auth),
        password:   Devise.friendly_token[0, 20]
      )
    end

    user
  end

  def self.find_first_by_auth_conditions(warden_conditions)
    conditions = warden_conditions.dup
    if login = conditions.delete(:login)
      where(conditions).where(["name = :value OR lower(email) = lower(:value)", { :value => login }]).first
    else
      where(conditions).first
    end
  end

  private

  def user_params
    params.require(:user).permit(:name, :email, :password, :password_confirmation, :image, :background)
  end

  def self.dummy_email(auth)
    "#{auth.uid}-#{auth.provider}@example.com"
  end
end
```

> users/omniauth_callbacks_controller.rb
```Ruby
class Users::OmniauthCallbacksController < Devise::OmniauthCallbacksController
  def facebook
    callback_from :facebook
  end

  private

  def callback_from(provider)
    provider = provider.to_s

    @user = User.find_for_oauth(request.env['omniauth.auth'])

    if @user.persisted?
      flash[:notice] = I18n.t('devise.omniauth_callbacks.success', kind: provider.capitalize)
      sign_in_and_redirect @user, event: :authentication
    else
      session["devise.#{provider}_data"] = request.env['omniauth.auth']
      redirect_to new_user_registration_url
    end
  end
end
```
> routes.rb

```Ruby
Rails.application.routes.draw do

  get 'users/show'

  devise_for :users, controllers: { registrations: 'users/registrations',
    omniauth_callbacks: 'users/omniauth_callbacks',
    sessions: 'users/sessions', confirmations: 'users/confirmations',
    passwords: 'users/passwords'
    }
  devise_scope :user do
    get '/users/sign_out', to: 'users/sessions#destroy'
  end
end
```

> Devise.rb
```Ruby
# Use this hook to configure devise mailer, warden hooks and so forth.
# Many of these configuration options can be set straight in your model.
Devise.setup do |config|
  require 'devise/orm/active_record'
・・・
  # ==> Mountable engine configurations
  # When using Devise inside an engine, let's call it `MyEngine`, and this engine
  # is mountable, there are some extra configurations to be taken into account.
  # The following options are available, assuming the engine is mounted as:
  #
  #     mount MyEngine, at: '/my_engine'
  #
  # The router that invoked `devise_for`, in the example above, would be:
  # config.router_name = :my_engine
  #
  # When using OmniAuth, Devise cannot automatically set OmniAuth path,
  # so you need to do it manually. For the users scope, it would be:
  # config.omniauth_path_prefix = '/my_engine/users/auth'
  config.secret_key = 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'
  require "omniauth-facebook"
  config.omniauth :facebook, ENV['APP_ID'], ENV['APP_SECRET']
end
```

> omniauth.rb
```Ruby
Rails.application.config.middleware.use OmniAuth::Builder do
end
```

環境変数は本番環境に設定済みです。

```ここに言語を入力
$ heroku config
=== サーバー名 Config Vars
APP_ID:    XXXXXXXXXXXXXXXX
APP_SECRET:     XXXXXXXXXXXXXXXXXXXXX
```

###追記

> user.rb

```Ruby
class User < ApplicationRecord
  # Include default devise modules. Others available are:
  # :lockable, :timeoutable
  devise :database_authenticatable, :registerable, :confirmable,
         :recoverable, :rememberable, :trackable, :validatable, :omniauthable, omniauthable: [:facebook]
  mount_uploader :image, ImageUploader
  validates :name, uniqueness: { case_sensitive: :false }, length: { minimum: 4, maximum: 20 }
  has_many :reviews
  attr_accessible :provider, :uid

  def self.find_for_oauth(auth)
    user = User.where(uid: auth_uid, provider: auth.provider).first

    unless user
      user = User.create(
        uid:        auth.uid,
        provider:   auth.provider,
        email:      User.dummy_email(auth),
        token:    auth.credintials.token,
        password:   Devise.friendly_token[4, 30]
      )
    end

    user
  end

  def self.find_first_by_auth_conditions(warden_conditions)
    conditions = warden_conditions.dup
    if login = conditions.delete(:login)
      where(conditions).where(["name = :value OR lower(email) = lower(:value)", { :value => login }]).first
    else
      where(conditions).first
    end
  end

  private

  def user_params
    params.require(:user).permit(:name, :email, :password, :password_confirmation, :image, :background)
  end

  def self.dummy_email(auth)
    "#{auth.uid}-#{auth.provider}@example.com"
  end
end
```
attr_accessible :provider, :uidや、omniauthable: [:facebook]を追記しました。

token_params: { parse: :json }を追記しました。

###追記その2

ominiauthのバージョンがよくないのかと思い、
```ここに言語を入力
gem 'omniauth-facebook', '1.4.0'
```
に落としてみました。ですが、やはり通りません。。
どうなっているんでしょうかね。。。。

###追記その3

Facebookアプリ側の記載をします。

![イメージ説明](62282554d2124c436df2b7e534661369.jpeg)

![イメージ説明](ee04582b6fd5ade624b2862cb0f9549e.jpeg)

![イメージ説明](e10b20ebb88b022a1749c1ac8bcc9756.png)

「アイテムを審査に送信」も今回の件は必要なさそうですよね。。。

###追記その4
ボタンを押すと、下記でFacebookログインが求められますが。。
![イメージ説明](3a4abceaefb21df9056aedfc1654674a.png)

ログインするとエラーメッセージとなってしまいます。
![イメージ説明](049597d941fad9778056971c4ad73132.png)

ログイン後の対応がよくないのでしょうか。。

##追記その4【更新版】

Gemfile
```Ruby
source 'https://rubygems.org'
・・・
gem 'dotenv-rails'
gem 'omniauth-facebook', '1.4.0'
・・・
group :production do
  gem 'pg', '0.18.4'
end

# Windows環境ではtzinfo-dataというgemを含める必要があります
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
```
$gem list
```Ruby
・・・
multipart-post (2.0.0)
nenv (0.3.0)
nio4r (2.0.0, 1.2.1)
nokogiri (1.7.2, 1.7.1, 1.6.7.2)
notiffany (0.1.1, 0.0.8)
orm_adapter (0.5.0)
pg (0.18.4)
・・・
```
gemfile.lock
```
・・・
    notiffany (0.1.1)
      nenv (~> 0.1)
      shellany (~> 0.0)
    oauth2 (0.6.1)
      faraday (~> 0.7)
      httpauth (~> 0.1)
      multi_json (~> 1.3)
    omniauth (1.6.1)
      hashie (>= 3.4.6, < 3.6.0)
      rack (>= 1.6.2, < 3)
    omniauth-facebook (1.4.0)
      omniauth-oauth2 (~> 1.0.2)
    omniauth-oauth2 (1.0.2)
      oauth2 (~> 0.6.0)
      omniauth (~> 1.0)

DEPENDENCIES
・・・
  devise
  dotenv-rails
  geocoder
  gmaps4rails
  google-analytics-rails
  guard (= 2.13.0)
  guard-minitest (= 2.4.4)
  jbuilder (= 2.4.1)
  jquery-rails (= 4.1.1)
  listen (= 3.0.8)
  mini_magick
  minitest-reporters (= 1.1.9)
  omniauth-facebook (= 1.4.0)
  pg (= 0.18.4)
  puma (= 3.4.0)
  rails (= 5.0.0.1)
  rails-controller-testing (= 0.1.1)
  ransack
  rmagick
  sass-rails (= 5.0.6)
  spring (= 1.7.2)
  spring-watcher-listen (= 2.0.0)
  sqlite3 (= 1.3.11)
  turbolinks (= 5.0.1)
  tzinfo-data
  uglifier (= 3.0.0)
  web-console (= 3.1.1)
  will_paginate (= 3.1.0)

BUNDLED WITH
   1.12.1
```

###追記その5
下記、参考に「devise.rb」のパスワードを直してみましたが効果なしでした。。
[http://abeyuusuke1978.hatenablog.com/entry/2015/01/03/235255](http://abeyuusuke1978.hatenablog.com/entry/2015/01/03/235255)

> devise.rb

```Ruby
Devise.setup do |config|
  config.mailer_sender = 'please-change-me-at-config-initializers-devise@example.com'
  require 'devise/orm/active_record'
  config.case_insensitive_keys = [:email]
  config.strip_whitespace_keys = [:email]
  config.skip_session_storage = [:http_auth]
  config.stretches = Rails.env.test? ? 1 : 11
  config.reconfirmable = true
  config.expire_all_remember_me_on_sign_out = true
  config.password_length = 4..30
  config.email_regexp = /\A[^@\s]+@[^@\s]+\z/
  config.reset_password_within = 6.hours
  config.sign_out_via = [:get, :delete]
  config.secret_key = 'XXXXXXXXXXXXX'
  require "omniauth-facebook"
  config.omniauth :facebook, ENV['APP_ID'], ENV['APP_SECRET'],token_params: { parse: :json }
end
```

なんでなんだ・・・・涙

Facebook認証が通りません（rails）

Wordpressの投稿画面より画像アップロードを行うと、JPEG画像は正常にアップロードできましたが、
PNG画像をアップしようとすると「HTTPエラー。」という表示が出る現象が起こっています。
アップはできているのかもしれませんが、画像のプレビューが出ない状態です。

![イメージ説明](807faac44c6934ac905530f2fb210d9e.png)

原因および対処法がお分かりの方がいらっしゃいましたらご教授よろしくお願いいたします。

使用バージョン：4.7.4
サーバー：ABLENET