2015年3月24日火曜日

PCブラウザでネットワーク接続の有無を検知するには?

PCブラウザでネットワーク接続の有無を検知するにはどうしたらいいだろう?

一応「navigator.onLine」というAPIはある。

window.navigator.onLine - Web API インターフェイス | MDN

ブラウザのサポート具合を調べてみると、全てのブラウザというわけにはいかないが、まあまあサポートされていることがわかる。

Can I use... Support tables for HTML5, CSS3, etc

しかし、このAPIには色々と問題があることがすぐに分かった。

javascript - How to detect online/offline event cross-browser? - Stack Overflow


Chrome and Safari will detect when you go "offline" automatically - meaning that "online" events and properties will fire automatically when you unplug your network cable.

Firefox (Mozilla), Opera, and IE take a different approach, and consider you "online" unless you explicitly pick "Offline Mode" in the browser - even if you don't have a working network connection.


要するに、ChromeやSafariならネットワーク接続が切れた時点で自動的にオフラインイベントが来るが、FirefoxやOpera、IEはブラウザ側に「オフラインモード」という機能があるので、navigator.onLineの値は実際のネットワーク接続に有無ではなく「オフラインモードかどうか」の値になってしまう、という話。

つまり、全くもって役に立たない!

ではどうするか?

StackOverflowでも議論されているが、要するに「サーバーにリクエストを投げて返ってくればオンラインじゃね?」というシンプルな考え方が最も信頼できそうだ。

賢くやりたいなら、こういったライブラリもある。

cvan/navigator.onLine-that-actually-works

愚直にやりたいなら、ここが参考になる。シンプルにXMLHttpRequestを使う。

navigator.onLine alternative: serverReachable() | Louis-Rémi

このコードを参考に、少し改造してこのようにした。

/**
 * 実際にサーバーに接続できるかどうかを返す
 * URL指定が無ければ自ホストの「/? + Math.random()」
 */
function isServerReachable(url) {
  if (!url) {
    url = location.protocol + '//' + location.host + '/?' + Math.random();
  }
  console.log('ネットワーク接続を確認します:' + url);
  try {
    var req = new XMLHttpRequest();
    req.open("GET", url, false); //同期で接続
    req.send();
    if ((200 <= req.status && req.status < 300) || req.status == 304) {
      console.log('ネットワーク接続可能 status=' + req.status + '(' + req.statusText + ')');
      return true;
    } else {
      console.log('ネットワーク接続エラー status=' + req.status + '(' + req.statusText + ')');
      return false;
    }
  } catch (err) {
    console.log('ネットワーク接続エラー');
    return false;
  }
}

req.open()でのメソッドの指定はHEADにした方が高速化のためには好ましいのだろうが、ローカルのデバッグサーバーによっては著しくレスポンスが遅い場合があった。

そこで、サーバー上にゼロバイトのHTMLファイルを作り、HEADではなくGETを指定してそのファイルのURLを指定するようにした。恐らくこの方法は鉄板だと思われる。

2015年3月8日日曜日

「いずれ米国がこの人種差別主義を解決できると信じている」と他人事の黒人初の大統領

日経14.12.09夕 オバマ氏「人種差別根深い」黒人射殺不起訴 続く抗議デモ 心情に理解示す

【ワシントン=吉野直也】オバマ米大統領は8日放映の米テレビ番組のインタビューで「米社会で人種差別主義は根が深い」と表明…

2008年大統領選で「一つの米国」を掲げて黒人初の大統領になったオバマ氏はこれまで黒人側の立場を鮮明にするのを避けてきた…

「米国は過去50年間で公民権問題を前進させてきた。いずれ米国がこの人種差別主義を解決できると信じている」…

「オバマ氏が大統領になって人種間の対立が悪化した」と回答した人が53%と過半を超えた…

「米社会で人種差別主義は根が深い」?そんなことなら自分でも言える。

「一つの米国」を掲げて黒人初の大統領になったのに、米国民の53%はオバマ大統領になってから人種間の対立が悪化したと答えているそうだ。

「Yes, we can!」はどうした?鳩ちゃんの「Trust me」もしょーもなかったけど、「Yes, we can!」もしょーもないな。

しまいには、「いずれ米国がこの人種差別主義を解決できると信じている」だって。「いずれ」ね。どんだけ他人事なのか。

当初はすばらしい大統領が出てきたなーと思っていたけれど、すでに終わってるよ(´-`)

しかし、この大統領の時代があと2年以上は続くわけでして。。。

米国は日本を最重要パートナーとして再認識し始めている

日経14.11.27朝 米国民「日本が最重要」 「アジアのパートナー」中国を逆転 外務省調査

外務省が米国民を対象に今夏実施した日本に関する世論調査で、「アジアで最も重要なパートナー」に日本をあげた「一般国民」が46%に上り、2年ぶりに中国(26%)を逆転して首位となった。

有識者を対象とした調査でも日本を選んだ人が58%と、中国の24%を大きく上回った。

一般国民と有識者でいずれも日本が首位になったのは5年ぶりだ。中国が東シナ海や南シナ海で挑発的な海洋進出を続けていることなどが影響したと見られる…

「日米両国がアジア太平洋の平和と安全のために緊密に協力すべきか」という質問には、一般国民の91%、有識者の97%が同調した。

日米安全保障条約は「維持すべきだ」と答えた一般国民が81%(昨年67%)、有識者は85%(同77%)…

日本国民として名誉なことだ。中国の本性が米国民にもバレてきているのだろう。

さらに、米国人のほとんどが日米がアジア太平洋の平和と安全のために協力すべきだと考えているということも確認できた。

ただ一方で、日米安全保障条約の維持に関しては「協力」のパーセンテージより10ポイントほど低くなっている。

つまり、「協力はすべきだが、米国が一方的に日本を守るということに抵抗がある」という人がそれくらいはいるということなのではないだろうか。

本当に悩ましい地下水バイパスといわき漁業の復興のバランス

日経 14.11.12 いわき 遠い「大漁」 試験操業1年、残る出荷制限 安全性PRへ奮闘

…漁を自粛した福島県いわき市の漁業組合が昨年10月に試験操業を始めて1年余り。放射性物質の基準値を下回る魚種は増えているが、県漁連は約150の全魚種の安全性が確認されるまでは本格操業を再開しない方針だ…

今月9日、いわき市の小名浜港で、原発事故後初の地元漁協による「魚まつり」が開かれた…約1時間で完売…

「風評被害に苦しんでいると思うので、地元産を応援したい」…

「水揚げ量が少なく、とても商売になるレベルではない」…

「サブドレン」と呼ばれる井戸から、地下水をくみ上げ浄化後に海に流す…

「新たな風評被害を招きかねない」と反対意見が相次いだ…

震災1年後くらいの時期にいわきの漁港に行ったことがある。その時は本当に廃墟のようだった。それが束の間とはいえ、このように賑わっていることはとても喜ばしい。

日経記事より

福島第1原発近くの地下水は問題ないことを確認しつつ海に流すべきだと思う。そうしなければその分の水が原発に流れ込み、高濃度の汚染水となって海に流れ込むことになりかねないと思うから。

しかし、地元の漁師さんたちはこれに反対している。新たな風評被害を招きかねないとお考えだからだ。

この苦悩は過去の報道でも知っていたけれど、それでも流すほかないだろうと今でも考えている。万が一地下水が高濃度の汚染水になって海に流れ込むことになったら、より厳しい状況になり、本格操業はさらに遅れることになってしまうから。

さりとて漁師さんたちの気持ちもわかる。地下水を流すことにすると、風評被害が増えることは考えられても減ることは考えられないし、漁業者にとっての問題は何も解決しない。

ひとつの一時的な対処は「補償」という形の金なのだろうけれど、それだけで解決できる問題だろうか。生き甲斐とか張り合いとか、そういった人生に関わる問題も絡んでくるのではないだろうか。

本当に悩ましい。

「頑張る・努力する」は評価としてはゼロだし、当然のことだけど、簡単なことでもない

日経14.11.14朝 サッカー人として 三浦知良 全力でやるしかない

…僕自身のことをいえば今季は4分間しか出場していない厳しさのなかにいる…

「出場できなくても毎日頑張りました」。これは自分を納得させる限りのもので、評価の上ではゼロだ。頑張る。努力する。それは当たり前のこと。ただし普通のことを普通に毎日やるのも、やっぱり難しい。「当たり前のこと」だけど簡単なことでもないんだ…

サッカーに本当の"苦労"はないと思っている。全部プラスになることだから…

サッカー様々ですよ。だったら、サッカーに失礼のないようにやっていくしかないです。全力で…

「頑張る・努力する」は当然のことで、評価としてはゼロだと。しかし、簡単なことでもない、と。

何も言うことはない。

ただ、それでも「サッカー様々ですよ。」というキングカズは、とても素敵な人だと思う。

2015年3月6日金曜日

ツイートボタンをリロードする(ページが読み込まれた後に動的に再作成する)には?

ツイートボタンはこのページで自由にカスタマイズして作成できる。

Twitter Buttons | About

作成したコードをページに埋め込むと、そのページをブラウザでロードしたときに表示されるのは知っての通り。

基本的にツイートするアドレスや内容などはページをロードする時に決まっている必要があるが、ページをロードした後でそれらを変更するにはどうしたらいいだろうか?

ブログやホームページなどの静的なサイトで問題になることはあまりないだろうが、AngularJSなどで構築したシングルページアプリケーションでは大いに問題になり得る。

まず、ツイートボタンを表示するホルダーをこのように作成する。

<!-- ツイートボタンホルダー -->
<div id="tweetButtonHolder">
</div>

<!-- ツイートボタン作成サイト https://about.twitter.com/resources/buttons#tweet でコピーしたscriptタグ -->
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

このscriptタグは window.twttr を生成する。このオブジェクトは様々なツイートボタンを作ることができる。

Scripting: Factory Functions | Twitter Developers

なので、このtwttrオブジェクトを使ってツイートボタンホルダーの場所にツイートボタンを作る(リロードする)には、例えばこのようなコードになるだろう。

function reloadTweetButton(url, text) {

  //ツイートボタンを消す(jQuery使用)
  $('#tweetButtonHolder').empty();

  //ツイートボタンを再作成
  twttr.widgets.createShareButton(
    url, //ツイートしたいURL
    document.getElementById('tweetButtonHolder'), //ツイートボタンを挿入する場所
    {
      lang: 'ja', //言語。jaだとボタンに「ツイート」と表示される
      text: text //ツイートしたいテキスト
    }).then(function (el) {
    console.log("ツイートボタン作成完了");
  });

}

2015年3月3日火曜日

macでsmb(samba)共有サーバーに別名で接続(別アカウント名で接続)する方法

macでsmb(samba)共有サーバーに別のアカウント名で接続したくなった。

接続を解除してもパスワードを保存してしまったために自動的に再接続してしまい、別アカウント名で接続できなくなってしまった(´・ω・`)

どうすれば別名で接続できるのか?

Finder>移動>サーバーへ接続>サーバアドレス に下記のように入力する。

smb://アカウント名@ホスト名

ノリでやってみたら、たまたまできちゃった(・∀・)

知らなかったわ〜