コード日進月歩

しんくうの技術的な小話、メモ、つれづれ、など

OpenAPI3(swagger)の文字列で最小値、最大値を設定する

逆引き的な話

環境

openapi: 3.0.0

書き方

type: string と同じ並びで以下のように記述する

minLength: 1
maxLength: 100

※もちろん両方揃っている必要はない

ユースケースと例

例えば「ニックネームは2文字以上8文字以下」としたい場合は以下のように設定する。

components:
  schemas:
    User:
      type: object
      description: "ユーザーを表すオブジェクト"
      properties:
        name:
          description: ユーザ名
          type: string
          example: 鈴木太郎
        nickname:
          description: ニックネーム
          type: string
          minLength: 2
          maxLength: 8

参考リンク

OpenAPI3(swagger)でのnullableとnullに関しての記法あれこれ

ドキュメントがわかりにくいのと、null許容はあるが、純粋nullに関しては言及がないのでそこに関してのワークアラウンド

環境

openapi: 3.0.0

記法

ドキュメント曰く

Note that there is no null type; instead, the nullable attribute is used as a modifier of the base type. - Data Types | Swagger

とあり、ざっくり和訳すると

nullタイプがないことに注意してください。代わりに、nullable属性を基本的なタイプの修飾子として使用します。

ということで

nickname:
  description: ニックネーム、null可
  type: string
  nullable: true

のように nullable:true を指定すると、nullであることを示すことができる。

「nullだけ」という表現のワークアラウンド

OpenAPI3では「ここは必ずnullである」のようなものを表現する方法はない。(typeがnullが存在しない)そのため、ドキュメントとしては下記のようにnullableにして、exampleを null と記述すると、swagger editor上ではいい感じに表現されるのでコレがベターかなという形。ここらへんは仕様が変わるかもしれないので、あくまでワークアラウンド

nullObject:
  description: null 
  type: object # exampleに文字列をおく都合上 object or string
  nullable: true
  example: null

参考リンク

Googleに表示されるためのfavicon設定に関してざっくり整理する

2020年1月時点で検索結果にfaviconが出るようになったのでざっくり調べた結果とか。HTML5の仕様とGoogleガイドラインを読んでざっくりやっておいたほうがいよね的な仕様。

そもそものfavicoの仕様

以前紹介してるが、HTML5から標準化されている

faviconの仕様はHTML5から標準化されている - コード日進月歩

Google検索向けの仕様

案内が下記ページにある。

検索結果に表示されるファビコンを定義する - Search Console ヘルプ

大きく以下4つに関して言及があるのでそれぞれざっくり引用ベースで記述します。

ファビコンの内容そのものの注意点

ファビコンの絵としてどういうものでないといけないかというものが定義されている。以下まま引用。

faviconがウェブサイトのブランドを視覚的に表したものとなっており、ユーザーが検索結果を見た際に一目でサイトを見分けられるようになっていること。 ・わいせつな表現やヘイト表現に関連するシンボル(例: かぎ十字章)などの不適切なファビコンは表示されません。該当する表現がファビコン内で見つかった場合は、デフォルトのアイコンに置き換えられます。

バイナリファイル内容としての注意点

かなり定義が大味のドキュメントとなっている、以下の通り。

  • faviconのサイズが 48 ピクセルの倍数になっていること
    • SVG ファイルの場合は、サイズに関して特別な指定はありません。
  • 有効なfacvion形式は、すべてサポートされています。

有効なファビコン設定が指しているのがWikipediaのファビコンのファイルサポートの項目なので明確に定義しているわけではない様子。なお執筆時点だと安全な選択肢は ico,png,gif

また、表示上は16pxで表示されるので、それでも崩れないようなデザインにして欲しいという旨の注意書きがあります。

HTML記述としての注意点

以下のfavicon記述が例示としてあげられている。

<link rel="shortcut icon" href="/path/to/favicon.ico">

rel属性でレギュレーションとして定められているのは以下の通り

  • shortcut icon
  • icon
  • apple-touch-icon
  • apple-touch-icon-precomposed

ということで 標準化された仕様である icon でもOKだし、Apple向けの apple-touch-icon でもOK

Googleのアクセスとしての注意点

パスやクローリングに関しての話。同じドメイン配下でクローリングできるようにしておいてね!!という感じに内容になっている。

上記を踏まえて見たほうがいいこと

Googleを考慮した場合、以下のような感じで設定するとGoogleにもよろしく、HTML5的な仕様感点からもはずれなそう。

  • faviconの基本仕様である rel = "icon" かつ ico or png で作っておけば大丈夫。
  • サイズは48の倍数ピクセル(96,144..) にすること
  • Googleの打ち出すレギュレーションに沿わないアイコンデザインにしないこと
  • クローリングするので、クローリングできるようにサイトと同一ドメインに配置すること

参考リンク

Resource blocked by content blocker というエラーが出るときはSafariのコンテンツブロック設定を確認する

他人の端末で広告でないときに、コンテンツブロッカー設定しているかの確かめかたおよびエラーと見方。

環境

Mobile Safari 13.0.4 (iOS 13.3)

症状

Safariを接続してエラーを見ると、以下のように Resource blocked by content blocker と表示される

解除の仕方

Safariの設定を確認する。

  1. 設定
  2. Safari(Safariの固有設定画面)
  3. コンテンツブロッカー を開く
  4. コンテンツブロッカーアプリをOFFにする

関連リンク

ITP2.3の作り関してざっくりまとめる

思った以上にえげつない仕様が盛り込まれているので調べる

ITPに関して

ITPのそもそもの話は過去にざっくり書いたのでそちらを参考のこと

Intelligent Tracking Prevention とはなにかざっくりまとめる - コード日進月歩

ITP2.3で起きること

対象 起きること この仕様になったver
3rd Party Cookie 従来方法で即時利用不可 ITP2.1
クライアント(≒JS)生成の1st Party Cookie 特定条件に当てはまる場合に利用期間が24時間になる ITP2.2
LocalStorage 特定条件下で即削除される ITP2.3
Referrer パラメータがある場合にドメイン情報のみになる ITP2.3

要素別に書いていく

3rd Party Cookie

期間を設けたり、パーティション化するなどしていたが、最終的にITP2.1にて規制が強化、ユーザにUI許可を求めるStorageAccess APIを使わないと取得できなくなった、こちらもルールがかなり煩雑かつSafariFirefoxでしか実装されていない。

1st Party Cookie

Set-Cookie でヘッダに仕込むクッキー(サーバサイドクッキーなどと呼称される)は今の所規制はないが、 document.cookie ベースのJSで作るCookie(クライアントクッキーなどと呼称される)はITP2.2にて下記の2つの条件両方に当てはまると24時間でアクセスができなくなる

  1. ITP1.0からある機械学習モデルでcross-site tracking 機能で分類されたドメインと認識されている
  2. 1のドメインで異なるドメインBへの遷移URLにクエリストリングやフラグメント識別子が含まれている

LocalStorage

HTML5から登場した、ブラウザが持つデータ領域のlocalStorage、こちらがITP2.3から規制対象となっていて、以下のような条件を満たすと削除される(らしい)。

  1. ユーザーがcross-site tracking 機能で分類されたドメインから、クエリ文字列やフラグメント識別子などがついていると、削除対象サイトとして記憶される(URL例: website.example?clickID=0123456789
  2. ユーザーがwebsite.exampleのWebページを操作せずに7日間Safariを使用すると、website.exampleのCookie以外のWebサイトの LocalStorageデータが削除されます。

Referrer

ITP2.3からトラッキング用途としてリファラが使われているというところに嘆きが入り、eLTD+1以上の情報はリファラにつかなくなる。

例としては https://sub.social.example/some/path/?clickID=0123456789 から遷移してきた場合に https://social.example としかReferrerでは取れない。

参考

TLD と eTLD と eTLD+1に関してざっくりまとめる

派生用語なのでまとめて

TLD

Top Level Domain の略。URLの文字列に使われるドメインにおいて、最上位レベルのドメイン文字列のことを指す。世界レベルで何があるかは決まっておりIANAが管理している。詳しくはWikipedia参考のこと。

トップレベルドメイン - Wikipedia

eTLD

Public Suffix と同等の意味で使われる Effecitve Top Level Domain のこと。mozillaが策定、管理している考え方で、Cookie維持の観点で従来のTLDだけでは正しく範囲を特定できないので、実質的にトップレベルドメインであるようなものをリストとして管理する、という考えがありその際に用いられる言葉。

eTLDの対象リストは以下のサイトで公開されている。

Public Suffix List

なお、CookieTLDの考え方に関しては以下のサイト参考のこと。

「Firefox 3」のセキュリティ機能について | 日経 xTECH(クロステック)

eTLD+1

eTLDに対して、サイトオーナーが独自に振る文字列一階層分までを示す言葉。+の数が増えるだけサブドメイン部も含まれるという意図の意味の言葉。

まとめ

ドメインA を sample.example.co.jp ドメインB を test.example.com とした場合

用語 ドメインAの場合 ドメインBの場合
TLD jp com
eTLD co.jp com
eTLD+1 example.co.jp example.com

参考サイト

Firebase HostingにあとからCloud Functionsを足す

あとから足すときって手順違うんだっけ?という疑問がでてやり方がよくわからなかったのでメモ、鮮度が短い情報なので2020/1時点のワークアラウンドとして捉えてもらえれば

firebaseコマンドのバージョン

$ firebase --version
7.11.0

やり方

initするだけ

$ firebase init functions

途中聞かれるのは以下のような質問

? What language would you like to use to write Cloud 
? Do you want to use ESLint to catch probable bugs and enforce style?
? Do you want to install dependencies with npm now? 
  1. JavaScriptとTypeScriptどっちつかう?
  2. ESLint使う?
  3. npmインストールする?

参考リンク