回答編集履歴

1

追記への対応

2020/09/08 05:26

投稿

miyabi-sun
miyabi-sun

スコア21203

test CHANGED
@@ -77,3 +77,95 @@
77
77
  `SameSite=None`はその辺のセキュリティ的な話で怒ってるってわけ。
78
78
 
79
79
  興味が出てきたら調べてみてね。
80
+
81
+
82
+
83
+ ---
84
+
85
+
86
+
87
+ > `TypeError: Cannot read property 'getDisplayMedia' of undefined`
88
+
89
+
90
+
91
+ これはJavaScript系あるある。
92
+
93
+
94
+
95
+ JavaScriptはオブジェクト指向プログラミング言語です。
96
+
97
+ 基本的にどの値はオブジェクトとして扱えるので
98
+
99
+ `A.B`という風にドットを使ってプロパティにアクセス出来ます。
100
+
101
+
102
+
103
+ しかし、JavaScriptはプロパティの所有が許されていない値が存在し、
104
+
105
+ それに対するプロパティへのアクセスを試みただけでエラーで落ちてしまいます。
106
+
107
+
108
+
109
+ - `null`値
110
+
111
+ - `undefined`値
112
+
113
+
114
+
115
+ ではもう一度エラー文を読んでみると、
116
+
117
+ `undefined`に対して`getDisplayMedia`プロパティを閲覧した事が原因と記述されているのがわかります。
118
+
119
+
120
+
121
+ 問題は`getDisplayMedia`プロパティではなく、
122
+
123
+ 何故`undefined`になってしまうのか?に着目するようにしましょう。
124
+
125
+
126
+
127
+ デバッグをしてみましょう。
128
+
129
+ JavaScriptやNode.jsには`console.log`というメソッドがあり、
130
+
131
+ これは複数の引数に対応しています。
132
+
133
+
134
+
135
+ それを利用していろんな箇所にデバッグプリントを仕込んでみましょう。
136
+
137
+
138
+
139
+ ```js
140
+
141
+ console.log(1, "start.");
142
+
143
+
144
+
145
+ const name = "taro";
146
+
147
+
148
+
149
+ console.log(2, name);
150
+
151
+
152
+
153
+ (undefined).name; // ここでundefinedに対してのプロパティアクセスを行いエラーを出す
154
+
155
+
156
+
157
+ console.log(3, "finish.");
158
+
159
+ ```
160
+
161
+
162
+
163
+ この場合2までは実行されるのがわかります。
164
+
165
+
166
+
167
+ こんな風にデバッグプリントを仕込む事で
168
+
169
+ 「ここまでは動く」とか「この値が変でそれ以降の動作がおかしくなってしまう」と理解できるようになります。
170
+
171
+ まずは頑張ってエラーが出る前後の値を洗い出してみましょう。