Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
265
Help us understand the problem. What is going on with this article?
@tonkotsuboy_com

Microsoft Edgeのユーザーエージェントがカオスなので注意

More than 3 years have passed since last update.

Windows 10の標準ブラウザ「Microsoft Edge」のユーザーエージェントがカオスです。下記の太字部分に注目してください。

Mozilla/5.0 (Windows NT 10.0; Win64; x64; ServiceUI 11) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36 Edge/16.16299

(Microsoft EdgeHTML 16にて確認)

なんと、Microsoft EdgeはWebkit系エンジンではない(EdgeHTMLエンジンといいます)にも関わらず、AppleWebkit、Chrome、Safariという文字列が入っています。これは、Webkit系ブラウザと互換性を持たせ、WebKitブラウザ用の処理も実行できるようにするためです。
(参考:Microsoft曰く、Microsoft EdgeではWebKitと動作が異なる場合はバグ )

Web制作者が注意すべきこと

ユーザーエージェントを使ってWebkit系ブラウザ向けの処理を行っている場合は注意が必要です。Google ChromeやSafariのユーザーエージェントにも「AppleWebKit」という文字列が含まれているので、Webkitブラウザ用の処理がMicrosoft Edgeでも動作してしまいます。例えばJavaScriptでWebkit系のブラウザのみの処理を行いたい場合は、Edgeという文字列の存在を確認するとよいでしょう。

JavaScript
// Webkitブラウザ用でのみ処理を実行する例
var ua = navigator.userAgent;
if (ua.indexOf("AppleWebkit") >= 0 && ua.indexOf("Edge") == -1)
{
    // 処理
}
265
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
tonkotsuboy_com
フロントエンド / 九州大学卒 / ウェブ制作 / JavaScriptコードレシピ集の著者 / CSS Nite 2017〜2019ベストセッション / TechFeed公認エキスパート /お仕事依頼はDMまで

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
265
Help us understand the problem. What is going on with this article?