forked from w3c-html-ig-zh/notifications
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathnotifications.html
1465 lines (1078 loc) · 101 KB
/
notifications.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Notifications API</title>
<link href="https://www.whatwg.org/style/specification" rel="stylesheet">
<link href="https://resources.whatwg.org/bikeshed.css" rel="stylesheet">
<link href="https://resources.whatwg.org/logo-notifications.svg" rel="icon">
<meta content="Bikeshed 1.0.0" name="generator">
<script>
document.addEventListener("DOMContentLoaded", function(event) {
// no backrefs for index
document.querySelector('.indexlist').classList.add('no-backref');
// as bikeshed relocates script elements, add the script element for dfn.js
// after document loads
var script = document.createElement('script');
script.setAttribute('id', 'head');
script.setAttribute('src', 'https://resources.whatwg.org/dfn.js');
document.body.appendChild(script);
});
</script>
</head>
<body class="h-entry status-LS">
<div class="head">
<p data-fill-with="logo"><a class="logo" href="http://whatwg.org/">
<img alt="WHATWG" height="100" src="https://resources.whatwg.org/logo-notifications.svg">
</a>
</p>
<h1 class="p-name no-ref" id="title">Notifications API</h1>
<h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="content">Living Standard — Last Updated
<time class="dt-updated" datetime="2015-03-10">10 March 2015</time></span></h2>
<div data-fill-with="spec-metadata">
<dl>
<dt>参与:
<dd><span><a href="https://github.com/whatwg/notifications/issues/new">file a bug</a> (<a href="https://github.com/whatwg/notifications/issues">open bugs</a>)</span>
<dd><span><a href="https://whatwg.org/mailing-list">[email protected]</a> (<a href="https://whatwg.org/mailing-list#specs">archives</a>)</span>
<dd><span><a href="http://wiki.whatwg.org/wiki/IRC">IRC: #whatwg on Freenode</a></span>
<dt>提交:
<dd><span><a href="https://github.com/whatwg/notifications/commits">https://github.com/whatwg/notifications/commits</a></span>
<dd><span><a href="https://twitter.com/notifyapi">@notifyapi</a></span>
</dl>
</div>
<div data-fill-with="warning"></div>
</div>
<h2 class="no-num no-toc no-ref heading settled" id="abstract"><span class="content">Abstract</span></h2>
<div class="p-summary" data-fill-with="abstract">
<p>该标准定义了一个 API 来给终端用户显示通知，通常显示在顶层浏览上下文视口。该 API 被设计成与现有的 Notifications 系统兼容，但依然是平台独立的。</p>
</div>
<div data-fill-with="at-risk"></div>
<h2 class="no-num no-toc no-ref heading settled" id="contents"><span class="content">内容提纲</span></h2>
<div data-fill-with="table-of-contents" role="navigation">
<ul class="toc" role="directory">
<li><a href="#terminology"><span class="secno">1</span> <span class="content">术语</span></a>
<li><a href="#notifications"><span class="secno">2</span> <span class="content">Notifications</span></a>
<ul class="toc">
<li><a href="#lifetime-and-ui-integrations"><span class="secno">2.1</span> <span class="content">生命周期与 UI 整合</span></a>
<li><a href="#permission-model"><span class="secno">2.2</span> <span class="content">许可模式</span></a>
<li><a href="#direction"><span class="secno">2.3</span> <span class="content">方向</span></a>
<li><a href="#language"><span class="secno">2.4</span> <span class="content">语言</span></a>
<li><a href="#resources"><span class="secno">2.5</span> <span class="content">资源</span></a>
<li><a href="#showing-a-notification"><span class="secno">2.6</span> <span class="content">显示通知</span></a>
<li><a href="#activating-a-notification"><span class="secno">2.7</span> <span class="content">激活通知</span></a>
<li><a href="#closing-a-notification"><span class="secno">2.8</span> <span class="content">关闭通知</span></a>
<li><a href="#displaying-notification"><span class="secno">2.9</span> <span class="content">展示通知</span></a>
<li><a href="#replacing-a-notification"><span class="secno">2.10</span> <span class="content">更换通知</span></a>
</ul>
<li><a href="#api"><span class="secno">3</span> <span class="content">API</span></a>
<ul class="toc">
<li><a href="#garbage-collection"><span class="secno">3.1</span> <span class="content">垃圾回收</span></a>
<li><a href="#constructors"><span class="secno">3.2</span> <span class="content">构造函数</span></a>
<li><a href="#static-members"><span class="secno">3.3</span> <span class="content">静态成员</span></a>
<li><a href="#object-members"><span class="secno">3.4</span> <span class="content">对象成员</span></a>
<li><a href="#examples"><span class="secno">3.5</span> <span class="content">示例</span></a>
<ul class="toc">
<li><a href="#using-events"><span class="secno">3.5.1</span> <span class="content">使用事件</span></a>
<li><a href="#tags-example"><span class="secno">3.5.2</span> <span class="content">多实例使用 <code>tag</code> 成员</span></a>
<li><a href="#using-the-tag-member-for-a-single-instance"><span class="secno">3.5.3</span> <span class="content">单实例使用 <code>tag</code> 成员</span></a>
</ul>
</ul>
<li><a href="#service-worker-api"><span class="secno">4</span> <span class="content">服务线程 API</span></a>
<li><a href="#acknowledgments"><span class="secno"></span> <span class="content">Acknowledgments</span></a>
<li><a href="#conformance"><span class="secno"></span> <span class="content">Conformance</span></a>
<li><a href="#index"><span class="secno"></span> <span class="content">Index</span></a>
<ul class="toc">
<li><a href="#index-defined-here"><span class="secno"></span> <span class="content">Terms defined by this specification</span></a>
</ul>
<li><a href="#references"><span class="secno"></span> <span class="content">References</span></a>
<ul class="toc">
<li><a href="#normative"><span class="secno"></span> <span class="content">Normative References</span></a>
</ul>
<li><a href="#idl-index"><span class="secno"></span> <span class="content">IDL Index</span></a>
</ul></div>
<main>
<h2 class="heading settled" data-level="1" id="terminology"><span class="secno">1. </span><span class="content">术语</span><a class="self-link" href="#terminology"></a></h2>
<p>本规范中使用的一些术语取自DOM、Fetch、HTML、IDL、URL 和 振动 API 标准。
<a data-link-type="biblio" href="#biblio-dom">[DOM]</a>
<a data-link-type="biblio" href="#biblio-fetch">[FETCH]</a>
<a data-link-type="biblio" href="#biblio-html">[HTML]</a>
<a data-link-type="biblio" href="#biblio-webidl">[WEBIDL]</a>
<a data-link-type="biblio" href="#biblio-url">[URL]</a>
<a data-link-type="biblio" href="#biblio-vibration">[VIBRATION]</a>
</p>
<h2 class="heading settled" data-level="2" id="notifications"><span class="secno">2. </span><span class="content">Notifications</span><a class="self-link" href="#notifications"></a></h2>
<p><dfn data-dfn-type="dfn" data-lt="concept notification" data-noexport="" id="concept-notification">notification<a class="self-link" href="#concept-notification"></a></dfn> 是事件发生的抽象表示，如信息发出。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的 DOMString 类型的
<dfn data-dfn-type="dfn" data-lt="concept title" data-noexport="" id="concept-title">title<a class="self-link" href="#concept-title"></a></dfn>。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的 DOMString 类型的
<dfn data-dfn-type="dfn" data-noexport="" id="body">body<a class="self-link" href="#body"></a></dfn>。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的
<dfn data-dfn-type="dfn" data-lt="concept direction" data-noexport="" id="concept-direction">direction<a class="self-link" href="#concept-direction"></a></dfn> 其值是
<i>auto</i>, <i>ltr</i>, and <i>rtl</i>三者之一。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的 DOMString 类型的
<dfn data-dfn-type="dfn" data-lt="concept language" data-noexport="" id="concept-language">language<a class="self-link" href="#concept-language"></a></dfn> ，其值是一个有效的 BCP 47 语言标记或空字符串。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的 DOMString 类型的
<dfn data-dfn-type="dfn" data-noexport="" id="tag">tag<a class="self-link" href="#tag"></a></dfn>。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的
<dfn data-dfn-type="dfn" data-noexport="" id="data">data<a class="self-link" href="#data"></a></dfn>。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的
<dfn data-dfn-type="dfn" data-lt="concept origin" data-noexport="" id="concept-origin">origin<a class="self-link" href="#concept-origin"></a></dfn>。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的未被设置的
<dfn data-dfn-type="dfn" data-noexport="" id="renotify-preference-flag">renotify preference flag<a class="self-link" href="#renotify-preference-flag"></a></dfn>。 设置该标志表示运行<a data-link-type="dfn" href="#replace-steps">replace steps</a>后，最终用户会被警告。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的未被设置的
<dfn data-dfn-type="dfn" data-noexport="" id="silent-preference-flag">silent preference flag<a class="self-link" href="#silent-preference-flag"></a></dfn>。设置该标志表示不接收声音或者振动通知。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的未被设置的
<dfn data-dfn-type="dfn" data-noexport="" id="screen-off-preference-flag">screen off preference flag<a class="self-link" href="#screen-off-preference-flag"></a></dfn>。设置该标志表示设备屏幕不会被启用。
</p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> 有一个关联的未被设置的
<dfn data-dfn-type="dfn" data-noexport="" id="sticky-preference-flag">sticky preference flag<a class="self-link" href="#sticky-preference-flag"></a></dfn>。设置该标志表示最终用户将不能很容易地清除
<a data-link-type="dfn" href="#concept-notification">notification</a> <span class="note" role="note">仅适用于<a data-link-type="dfn" href="#persistent-notification">persistent notifications</a>.
</span></p>
<p>一个 <a data-link-type="dfn" href="#concept-notification">notification</a> <em>可以</em> 有关联的 <dfn data-dfn-type="dfn" data-noexport="" id="icon-url">icon URL<a class="self-link" href="#icon-url"></a></dfn>, <dfn data-dfn-type="dfn" data-noexport="" id="icon-resource">icon resource<a class="self-link" href="#icon-resource"></a></dfn>, <dfn data-dfn-type="dfn" data-noexport="" id="sound-url">sound URL<a class="self-link" href="#sound-url"></a></dfn>,
<dfn data-dfn-type="dfn" data-noexport="" id="sound-resource">sound resource<a class="self-link" href="#sound-resource"></a></dfn>, <dfn data-dfn-type="dfn" data-noexport="" id="vibration-pattern">vibration pattern<a class="self-link" href="#vibration-pattern"></a></dfn>，和
<dfn data-dfn-type="dfn" data-noexport="" id="service-worker-registration">service worker registration<a class="self-link" href="#service-worker-registration"></a></dfn>.
</p>
<p class="note" role="note">不鼓励开发者通过图标、声音或振动模式来给最终用户传达信息；除非这些信息
是最终用户可以访问的。
</p>
<p>一个 <dfn data-dfn-type="dfn" data-noexport="" id="non_persistent-notification">non-persistent notification<a class="self-link" href="#non_persistent-notification"></a></dfn> 是没有关联
<a data-link-type="dfn" href="#service-worker-registration">service worker registration</a> 的
<a data-link-type="dfn" href="#concept-notification">notification</a>。
</p>
<p>一个 <dfn data-dfn-type="dfn" data-noexport="" id="persistent-notification">persistent notification<a class="self-link" href="#persistent-notification"></a></dfn> 是关联了
<a data-link-type="dfn" href="#service-worker-registration">service worker registration</a> 的
<a data-link-type="dfn" href="#concept-notification">notification</a>。
</p>
<hr>
<p>为 <dfn data-dfn-type="dfn" data-noexport="" id="create-a-notification">create a notification<a class="self-link" href="#create-a-notification"></a></dfn>，给定一个<var>title</var> 和
<var>options</var>，执行这些步骤：
</var></p>
<ol>
<li>
<p>设 <var>notification</var> 是一个新的
<a data-link-type="dfn" href="#concept-notification">notification</a>.
</p>
<li>
<p>如果 <var>options</var> 的 <code>silent</code> 为 true, 那么
<var>options</var> 的 <code>sound</code> 出现时或者 <var>options</var> 的
<code>vibrate</code> 出现时， <a data-link-type="dfn" href="http://heycam.github.io/webidl/#dfn-throw">throw</a> 一个 <code>TypeError</code>
异常。
</p>
<li>
<p>如果 <var>options</var> 的 <code>renotify</code> 为 true 并且
<var>options</var> 的 <code>tag</code> 为空字符串，那么 <a data-link-type="dfn" href="http://heycam.github.io/webidl/#dfn-throw">throw</a> 一个
<code>TypeError</code> 异常。
</p>
<li>
<p>设置 <var>notification</var> 的 <a data-link-type="dfn" href="#data">data</a> 为一个<var>options</var> 的 <code>data</code>的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/interaction.html#structured-clone">structured clone</a>。重新抛出任何异常。
</p>
<li>
<p>设置 <var>notification</var> 的 <a data-link-type="dfn" href="#concept-title">title</a>
为 <var>options</var> 的 <code>title</code>.
</p>
<li>
<p>设置 <var>notification</var> 的
<a data-link-type="dfn" href="#concept-direction">direction</a> 为 <var>options</var> 的
<code>dir</code>.
</p>
<li>
<p>如果 <var>options</var> 的 <code>lang</code> 是一个有效的 BCP 47
语言标记或空字符串, 设置 <var>notification</var> 的
<a data-link-type="dfn" href="#concept-language">language</a> 为 <var>options</var>的
<code>lang</code>；否则将之设置为空字符串。 <a data-link-type="biblio" href="#biblio-lang">[LANG]</a>
</p>
<li>
<p>设置 <var>notification</var> 的 <a data-link-type="dfn" href="#concept-origin">origin</a> 为
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a>。
</p>
<li>
<p>设置 <var>notification</var> 的 <a data-link-type="dfn" href="#body">body</a> 为 <var>options</var> 的
<code>body</code>.
</p>
<li>
<p>设置<var>notification</var> 的 <a data-link-type="dfn" href="#tag">tag</a> 为 <var>options</var> 的
<code>tag</code>.
</p>
<li>
<p>设 <var>baseURL</var> 为
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 指定的 API 基础 URL。 <span class="XXX">或现任？</span>
</p>
<li>
<p>如果 <var>options</var> 存在 <code>icon</code> ，用
<var>baseURL</var> <a data-link-type="dfn" href="https://url.spec.whatwg.org/#concept-url-parser">parse</a> 它；解析无误时，设置 <var>notification</var> 的 <a data-link-type="dfn" href="#icon-url">icon URL</a> 为该解析值。（否则 <a data-link-type="dfn" href="#icon-url">icon URL</a> 未设置。）
</p>
<li>
<p>如果 <var>options</var> 的 <code>sound</code> 存在，
用
<var>baseURL</var> <a data-link-type="dfn" href="https://url.spec.whatwg.org/#concept-url-parser">parse</a> 它；解析无误时，设置 <var>notification</var> 的 <a data-link-type="dfn" href="#sound-url">sound URL</a> 为该解析值。（否则 <a data-link-type="dfn" href="#sound-url">sound URL</a> 未设置。）
</p>
<li>
<p>如果 <var>options</var> 的 <code>vibrate</code> 存在，
<a data-link-type="dfn" href="http://www.w3.org/TR/vibration/#dfn-validate-and-normalize">validate and normalize</a> 它，
并设置 <var>notification</var> 的
<a data-link-type="dfn" href="#vibration-pattern">vibration pattern</a> 为该规范化值。
（否则<a data-link-type="dfn" href="#vibration-pattern">vibration pattern</a>未设置。）
</p>
<li>
<p>如果 <var>options</var> 的 <code>renotify</code> 为 true，设置
<var>notification</var> 的 <a data-link-type="dfn" href="#renotify-preference-flag">renotify preference flag</a>.
</p>
<li>
<p>如果 <var>options</var> 的 <code>silent</code> 为 true，设置
<var>notification</var> 的 <a data-link-type="dfn" href="#silent-preference-flag">silent preference flag</a>.
</p>
<li>
<p>如果 <var>options</var> 的 <code>noscreen</code> 为 true，设置
<var>notification</var> 的 <a data-link-type="dfn" href="#screen-off-preference-flag">screen off preference flag</a>.
</p>
<li>
<p>如果 <var>options</var> 的 <code>sticky</code> 为 true，设置
<var>notification</var> 的 <a data-link-type="dfn" href="#sticky-preference-flag">sticky preference flag</a>.
</p>
<li>
<p>返回 <var>notification</var>.
</p></ol>
<h3 class="heading settled" data-level="2.1" id="lifetime-and-ui-integrations"><span class="secno">2.1. </span><span class="content">生命周期与 UI 整合</span><a class="self-link" href="#lifetime-and-ui-integrations"></a></h3>
<p>用户代理必须保留一个由零或多个 <a data-link-type="dfn" href="#concept-notification">notifications</a> 组成的 <dfn data-dfn-type="dfn" data-noexport="" id="list-of-notifications">list of notifications<a class="self-link" href="#list-of-notifications"></a></dfn>。
</p>
<p>用户代理应该在创建 <a data-link-type="dfn" href="#non_persistent-notification">non-persistent notification</a> 之后的几秒种内执行<a data-link-type="dfn" href="#close-steps">close steps</a>。
</p>
<p>用户代理不应该在平台的“通知中心”（如果有的话）显示 <a data-link-type="dfn" href="#non_persistent-notification">non-persistent notification</a>。
</p>
<p>用户代理应该保持 <a data-link-type="dfn" href="#persistent-notification">persistent notifications</a>，直至被移除出<a data-link-type="dfn" href="#list-of-notifications">list of notifications</a>。
</p>
<p class="example">一个 <a data-link-type="dfn" href="#persistent-notification">persistent notification</a> 可通过其 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象来调用
<code class="idl"><a class="idl-code" data-link-type="method" href="#dom-notification-close">close()</a></code> 方法。
</p>
<p>用户代理应该在平台的“通知中心”（如果有的话）显示 <a data-link-type="dfn" href="#persistent-notification">persistent notification</a> 。
</p>
<h3 class="heading settled" data-level="2.2" id="permission-model"><span class="secno">2.2. </span><span class="content">许可模式</span><a class="self-link" href="#permission-model"></a></h3>
<p><a data-link-type="dfn" href="#concept-notification">Notifications</a> 当且仅当被用户（或用户代理）授予<dfn data-dfn-type="dfn" data-noexport="" id="permission">permission<a class="self-link" href="#permission"></a></dfn>时，才能被显示。 为给定 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a> 显示 <a data-link-type="dfn" href="#concept-notification">notifications</a> 的 <a data-link-type="dfn" href="#permission">permission</a> 是下面三个字符串之一：
</p>
<dl>
<dt>"<code>default</code>"
<dd>
<p>相当于 "<code>denied</code>"，但用户没有作出明确的选择。
</p>
<dt>"<code>denied</code>"
<dd>
<p>意味着用户不希望被
<a data-link-type="dfn" href="#concept-notification">notifications</a>.
</p>
<dt>"<code>granted</code>"
<dd>
<p>意味着可以显示 <a data-link-type="dfn" href="#concept-notification">notifications</a>。
</p></dl>
<p class="note" role="note">"<code>default</code>" 从不会等同于 "<code>granted</code>"。如果那样
的话，
"<code>granted</code>" 会被滥用，应用程序再也不必请求 <a data-link-type="dfn" href="#permission">permission</a>。
</p>
<h3 class="heading settled" data-level="2.3" id="direction"><span class="secno">2.3. </span><span class="content">方向</span><a class="self-link" href="#direction"></a></h3>
<p>本节所使用的术语等同于 HTML 规范中渲染部分所使用的。 <a data-link-type="biblio" href="#biblio-html">[HTML]</a>
</p>
<p>期望用户代理使用 Unicode 语义来解析
<a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-title">title</a> 和 <a data-link-type="dfn" href="#body">body</a>中的文本。展示它们时，应视之为由双向
算法规则P1、P2和P3所定义的一个或多个双向算法段落组成的独立集合，例如包括支持换行
符 U+000A (LF) 带来的段落分割。对
<a data-link-type="dfn" href="#concept-title">title</a> 和 <a data-link-type="dfn" href="#body">body</a>中的
每一段，<a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-direction">direction</a>
属性在其值非 "<code>auto</code>"时，将覆盖双向算法P2和P3规则。 <a data-link-type="biblio" href="#biblio-bidi">[BIDI]</a>
</p>
<h3 class="heading settled" data-level="2.4" id="language"><span class="secno">2.4. </span><span class="content">语言</span><a class="self-link" href="#language"></a></h3>
<p><a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-language">language</a> 属性指定了
<a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-title">title</a> 和 <a data-link-type="dfn" href="#body">body</a>的主要语言。语言属性值要么是一个有效的 BCP 47 语言标记，要么是一个空
字符串。空字符串表示主要语言是未知的。 <a data-link-type="biblio" href="#biblio-lang">[LANG]</a>
</p>
<h3 class="heading settled" data-level="2.5" id="resources"><span class="secno">2.5. </span><span class="content">资源</span><a class="self-link" href="#resources"></a></h3>
<p>对给定
<a data-link-type="dfn" href="#concept-notification">notification</a> <var>notification</var> 的 <dfn data-dfn-type="dfn" data-noexport="" id="fetch-steps">fetch steps<a class="self-link" href="#fetch-steps"></a></dfn> 是：
</p>
<ol>
<li>
<p>如果通知平台支持图标，并且通知设置了<a data-link-type="dfn" href="#icon-url">icon URL</a>，则 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-fetch">fetch</a>
<var>notification</var> 的 <a data-link-type="dfn" href="#icon-url">icon URL</a>。
</p>
<p>然后， <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#in-parallel">in parallel</a>:
</p>
<ol>
<li>
<p>等待 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response">response</a>.
</p>
<li>
<p>如果 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response">response</a> 的 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-internal-response">internal response</a> 的
<a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response-type">type</a> 是 <i>default</i>，试图作为图像解码该资源。
</p>
<li>
<p>如果平台支持该图像格式，设置 <var>notification</var> 的
<a data-link-type="dfn" href="#icon-resource">icon resource</a> 为该解码后的资源。（否则 <var>notification</var> 没有 <a data-link-type="dfn" href="#icon-resource">icon resource</a>。）
</p>
</ol>
<li>
<p>如果通知平台支持声音，并且通知设置了 <a data-link-type="dfn" href="#sound-url">sound URL</a> ，则 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-fetch">fetch</a>
<var>notification</var>的 <a data-link-type="dfn" href="#sound-url">sound URL</a> 。
</p>
<p>然后, <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#in-parallel">in parallel</a>：
</p>
<ol>
<li>
<p>等待 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response">response</a>。
</p>
<li>
<p>如果 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response">response</a> 的 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-internal-response">internal response</a> 的
<a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-response-type">type</a> 是 <i>default</i>，试图作为声音解码该资源。
</p>
<li>
<p>如果平台支持该声音格式，设置 <var>notification</var> 的
<a data-link-type="dfn" href="#sound-resource">sound resource</a> 为解码后的资源。（否则，
<var>notification</var> 没有 <a data-link-type="dfn" href="#sound-resource">sound resource</a>。）
</p>
</ol>
</ol>
<h3 class="heading settled" data-level="2.6" id="showing-a-notification"><span class="secno">2.6. </span><span class="content">显示通知</span><a class="self-link" href="#showing-a-notification"></a></h3>
<p>对给定 <a data-link-type="dfn" href="#concept-notification">notification</a> <var>notification</var> ，其<dfn data-dfn-type="dfn" data-noexport="" id="show-steps">show steps<a class="self-link" href="#show-steps"></a></dfn>是：
</p>
<ol>
<li>
<p>如果 <a data-link-type="dfn" href="#list-of-notifications">list of notifications</a> 里存在某一 <a data-link-type="dfn" href="#concept-notification">notification</a>，
其 <a data-link-type="dfn" href="#tag">tag</a> 非空字符串且等于 <var>notification</var>的 <a data-link-type="dfn" href="#tag">tag</a>，其
<a data-link-type="dfn" href="#concept-origin">origin</a> 和
<var>notification</var> 的 <a data-link-type="dfn" href="#concept-origin">origin</a> 是 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#same-origin">same origin</a>， 那么对该 <a data-link-type="dfn" href="#concept-notification">notification</a> 执行
<a data-link-type="dfn" href="#replace-steps">replace steps</a>，而后终止这些步骤。
</p>
<li>
<p>否则，对 <var>notification</var> 执行 <a data-link-type="dfn" href="#display-steps">display steps</a>。
</p></ol>
<h3 class="heading settled" data-level="2.7" id="activating-a-notification"><span class="secno">2.7. </span><span class="content">激活通知</span><a class="self-link" href="#activating-a-notification"></a></h3>
<p>当用户激活 <a data-link-type="dfn" href="#concept-notification">notification</a> <var>notification</var> 时，假设底层通知平台支持激活，用户代理必须（除非另有规定）执行这些步骤：
</p>
<ol>
<li>
<p>如果 <var>notification</var> 是 <a data-link-type="dfn" href="#persistent-notification">persistent notification</a>，执行这些子步骤：
</p>
<ol>
<li>
<p>设 <var>callback</var> 是 <var>global</var> 所调用的一种算法，对给定
<var>global</var> 上的 <var>notification</var> <a data-link-type="dfn" href="#fire-a-service-worker-notification-event-named-e">
fires a service worker notification event</a> 命名为
<code>notificationclick</code>。
</p>
<li>
<p>而后对
<var>notification</var> 的 <a data-link-type="dfn" href="#service-worker-registration">service worker registration</a> 和
<var>callback</var> 运行 <a data-link-type="dfn" href="https://slightlyoff.github.io/ServiceWorker/spec/service_worker/#handle-functional-event">Handle Functional Event</a>。
</p>
</ol>
<li>
<p>否则，<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#queue-a-task">queue a task</a> 来执行这些子步骤：
</p>
<ol>
<li>
<p>在表示
<var>notification</var> 的 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象上 <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#concept-event-fire">Fire an event</a> 属性为 <code>click</code>，其 <code> <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#dom-event-cancelable">cancelable</a></code> 属性初始化为 true。
</p>
<p class="note" role="note">鼓励用户代理在 <code>click</code> 事件监听器中使用 <code>
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/interaction.html#dom-window-focus">window.focus()</a></code>。
</p>
<li>
<p>如果没有设置该 <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#concept-event">event</a> 的 <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#canceled-flag">canceled flag</a>，用户
代理应该聚焦 <var>notification</var> 相关的
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#browsing-context">browsing context</a> 的 viewport。
</p>
</ol>
</ol>
<p class="note" role="note">纵观整个网络平台，“激活”被故意名不副实地称为“点击”。
</p>
<h3 class="heading settled" data-level="2.8" id="closing-a-notification"><span class="secno">2.8. </span><span class="content">关闭通知</span><a class="self-link" href="#closing-a-notification"></a></h3>
<p>不论是底层通知平台还是用户，在关闭 <a data-link-type="dfn" href="#concept-notification">notification</a> 时，
都必须执行 <a data-link-type="dfn" href="#close-steps">close steps</a>。
</p>
<p>对给定 <var>notification</var> ，其 <dfn data-dfn-type="dfn" data-noexport="" id="close-steps">close steps<a class="self-link" href="#close-steps"></a></dfn> 是:
</p>
<ol>
<li>
<p>如果 <var>notification</var> 不在 <a data-link-type="dfn" href="#list-of-notifications"> 中，终止这些步骤。
</p>
<li>
<p>从 <a data-link-type="dfn" href="#list-of-notifications">list of notifications</a> 中删除 <var>notification</var>。
</p></ol>
<h3 class="heading settled" data-level="2.9" id="displaying-notification"><span class="secno">2.9. </span><span class="content">展示通知</span><a class="self-link" href="#displaying-notification"></a></h3>
<p>对给定 <var>given notification</var>，其<dfn data-dfn-type="dfn" data-noexport="" id="display-steps">display steps<a class="self-link" href="#display-steps"></a></dfn> 是：
</p>
<ol>
<li>
<p>等待所有的 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-fetch">fetches</a> 完成，并且如果有的话，设置好
<var>notification</var> 的 <a data-link-type="dfn" href="#icon-resource">icon resource</a> 和 <a data-link-type="dfn" href="#sound-resource">sound resource</a>。
</p>
<li>
<p>在设备上展示 <var>notification</var>（例如通过调用相应的通知平台）。
</p>
<p>同时，如果有的话，播放 <var>notification</var> 的 <a data-link-type="dfn" href="#sound-resource">sound resource</a>，使用 <var>notification</var> 的 <a data-link-type="dfn" href="#vibration-pattern">vibration pattern</a>
<a data-link-type="dfn" href="http://www.w3.org/TR/vibration/#dfn-perform-vibration">perform vibration</a>。
</p>
<li>
<p>追加 <var>notification</var> 到 <a data-link-type="dfn" href="#list-of-notifications">list of notifications</a>。
</p></ol>
<h3 class="heading settled" data-level="2.10" id="replacing-a-notification"><span class="secno">2.10. </span><span class="content">更换通知</span><a class="self-link" href="#replacing-a-notification"></a></h3>
<p>将 <var>old</var>
<a data-link-type="dfn" href="#concept-notification">notification</a> 更换为 <var>new</var> 到， <dfn data-dfn-type="dfn" data-noexport="" id="replace-steps">replace steps<a class="self-link" href="#replace-steps"></a></dfn> 是：
</p>
<ol>
<li>
<p>等待所有的 <a data-link-type="dfn" href="https://fetch.spec.whatwg.org/#concept-fetch">fetches</a> 完成，并且如果有的话，设置好
<var>notification</var> 的 <a data-link-type="dfn" href="#icon-resource">icon resource</a> 和 <a data-link-type="dfn" href="#sound-resource">sound resource</a>。
</p>
<li>
<p>在 <a data-link-type="dfn" href="#list-of-notifications">list of notifications</a> 相同的位置，将 <var>old</var> 更换为 <var>new</var>。
</p>
<p>如果通知平台不支持更换要求，那么可对 <var>old</var> 运行 <a data-link-type="dfn" href="#close-steps">close steps</a> 而后对 <var>new</var> 运行 <a data-link-type="dfn" href="#display-steps">display steps</a>。
</p>
<p class="note" role="note">强烈建议通知平台支持原生更换，它要好得多。
</p></ol>
<h2 class="heading settled" data-level="3" id="api"><span class="secno">3. </span><span class="content">API</span><a class="self-link" href="#api"></a></h2>
<pre class="idl">[<dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="constructor" data-export="" data-global-name="Notification<interface>/Notification(title, options)<constructor>" data-lt="Notification(title, options)" id="dom-notification-notificationtitle-options">Constructor<a class="self-link" href="#dom-notification-notificationtitle-options"></a></dfn>(DOMString <dfn class="idl-code" data-dfn-for="Notification/Notification(title, options)" data-dfn-type="argument" data-export="" data-global-name="Notification<interface>/Notification(title, options)<method>/title<argument>" id="dom-notification-notificationtitle-options-title">title<a class="self-link" href="#dom-notification-notificationtitle-options-title"></a></dfn>, optional <a data-link-type="idl-name" href="#dictdef-notificationoptions">NotificationOptions</a> <dfn class="idl-code" data-dfn-for="Notification/Notification(title, options)" data-dfn-type="argument" data-export="" data-global-name="Notification<interface>/Notification(title, options)<method>/options<argument>" id="dom-notification-notificationtitle-options-options">options<a class="self-link" href="#dom-notification-notificationtitle-options-options"></a></dfn>),
Exposed=(Window,Worker)]
interface <dfn class="idl-code" data-dfn-type="interface" data-export="" data-global-name="" id="notification">Notification<a class="self-link" href="#notification"></a></dfn> : <a data-link-type="idl-name" href="https://dom.spec.whatwg.org/#eventtarget">EventTarget</a> {
static readonly attribute <a data-link-type="idl-name" href="#enumdef-notificationpermission">NotificationPermission</a> <a class="idl-code" data-global-name="Notification<interface>/permission<attribute>" data-link-type="attribute" data-readonly="" data-type="NotificationPermission " href="#dom-notification-permission">permission</a>;
[Exposed=<a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/browsers.html#window">Window</a>] static void <a class="idl-code" data-global-name="Notification<interface>/requestPermission(callback)<method>/requestPermission()<method>" data-link-type="method" href="#dom-notification-requestpermission">requestPermission</a>(optional <a data-link-type="idl-name" href="#callbackdef-notificationpermissioncallback">NotificationPermissionCallback</a> callback);
attribute <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/webappapis.html#eventhandler">EventHandler</a> <a class="idl-code" data-global-name="Notification<interface>/onclick<attribute>" data-link-type="attribute" data-type="EventHandler " href="#dom-notification-onclick">onclick</a>;
attribute <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/webappapis.html#eventhandler">EventHandler</a> <a class="idl-code" data-global-name="Notification<interface>/onerror<attribute>" data-link-type="attribute" data-type="EventHandler " href="#dom-notification-onerror">onerror</a>;
readonly attribute DOMString <a class="idl-code" data-global-name="Notification<interface>/title<attribute>" data-link-type="attribute" data-readonly="" data-type="DOMString " href="#dom-notification-title">title</a>;
readonly attribute <a data-link-type="idl-name" href="#enumdef-notificationdirection">NotificationDirection</a> <a class="idl-code" data-global-name="Notification<interface>/dir<attribute>" data-link-type="attribute" data-readonly="" data-type="NotificationDirection " href="#dom-notification-dir">dir</a>;
readonly attribute DOMString <a class="idl-code" data-global-name="Notification<interface>/lang<attribute>" data-link-type="attribute" data-readonly="" data-type="DOMString " href="#dom-notification-lang">lang</a>;
readonly attribute DOMString <a class="idl-code" data-global-name="Notification<interface>/body<attribute>" data-link-type="attribute" data-readonly="" data-type="DOMString " href="#dom-notification-body">body</a>;
readonly attribute DOMString <a class="idl-code" data-global-name="Notification<interface>/tag<attribute>" data-link-type="attribute" data-readonly="" data-type="DOMString " href="#dom-notification-tag">tag</a>;
readonly attribute USVString <a class="idl-code" data-global-name="Notification<interface>/icon<attribute>" data-link-type="attribute" data-readonly="" data-type="USVString " href="#dom-notification-icon">icon</a>;
readonly attribute USVString <a class="idl-code" data-global-name="Notification<interface>/sound<attribute>" data-link-type="attribute" data-readonly="" data-type="USVString " href="#dom-notification-sound">sound</a>;
// 目前还没有暴露振动属性；见 bug 23682
readonly attribute boolean <a class="idl-code" data-global-name="Notification<interface>/renotify<attribute>" data-link-type="attribute" data-readonly="" data-type="boolean " href="#dom-notification-renotify">renotify</a>;
readonly attribute boolean <a class="idl-code" data-global-name="Notification<interface>/silent<attribute>" data-link-type="attribute" data-readonly="" data-type="boolean " href="#dom-notification-silent">silent</a>;
readonly attribute boolean <a class="idl-code" data-global-name="Notification<interface>/noscreen<attribute>" data-link-type="attribute" data-readonly="" data-type="boolean " href="#dom-notification-noscreen">noscreen</a>;
readonly attribute boolean <a class="idl-code" data-global-name="Notification<interface>/sticky<attribute>" data-link-type="attribute" data-readonly="" data-type="boolean " href="#dom-notification-sticky">sticky</a>;
[SameObject] readonly attribute any <a class="idl-code" data-global-name="Notification<interface>/data<attribute>" data-link-type="attribute" data-readonly="" data-type="any " href="#dom-notification-data">data</a>;
void <a class="idl-code" data-global-name="Notification<interface>/close()<method>" data-link-type="method" href="#dom-notification-close">close</a>();
};
dictionary <dfn class="idl-code" data-dfn-type="dictionary" data-export="" data-global-name="" id="dictdef-notificationoptions">NotificationOptions<a class="self-link" href="#dictdef-notificationoptions"></a></dfn> {
<a data-link-type="idl-name" href="#enumdef-notificationdirection">NotificationDirection</a> <dfn class="idl-code" data-default=""auto"" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/dir<dict-member>" data-type="NotificationDirection " id="dom-notificationoptions-dir">dir<a class="self-link" href="#dom-notificationoptions-dir"></a></dfn> = "auto";
DOMString <dfn class="idl-code" data-default="""" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/lang<dict-member>" data-type="DOMString " id="dom-notificationoptions-lang">lang<a class="self-link" href="#dom-notificationoptions-lang"></a></dfn> = "";
DOMString <dfn class="idl-code" data-default="""" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/body<dict-member>" data-type="DOMString " id="dom-notificationoptions-body">body<a class="self-link" href="#dom-notificationoptions-body"></a></dfn> = "";
DOMString <dfn class="idl-code" data-default="""" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/tag<dict-member>" data-type="DOMString " id="dom-notificationoptions-tag">tag<a class="self-link" href="#dom-notificationoptions-tag"></a></dfn> = "";
USVString <dfn class="idl-code" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/icon<dict-member>" data-type="USVString " id="dom-notificationoptions-icon">icon<a class="self-link" href="#dom-notificationoptions-icon"></a></dfn>;
USVString <dfn class="idl-code" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/sound<dict-member>" data-type="USVString " id="dom-notificationoptions-sound">sound<a class="self-link" href="#dom-notificationoptions-sound"></a></dfn>;
<a data-link-type="idl-name" href="http://www.w3.org/TR/vibration/#idl-def-vibratepattern">VibratePattern</a> <dfn class="idl-code" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/vibrate<dict-member>" data-type="VibratePattern " id="dom-notificationoptions-vibrate">vibrate<a class="self-link" href="#dom-notificationoptions-vibrate"></a></dfn>;
boolean <dfn class="idl-code" data-default="false" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/renotify<dict-member>" data-type="boolean " id="dom-notificationoptions-renotify">renotify<a class="self-link" href="#dom-notificationoptions-renotify"></a></dfn> = false;
boolean <dfn class="idl-code" data-default="false" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/silent<dict-member>" data-type="boolean " id="dom-notificationoptions-silent">silent<a class="self-link" href="#dom-notificationoptions-silent"></a></dfn> = false;
boolean <dfn class="idl-code" data-default="false" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/noscreen<dict-member>" data-type="boolean " id="dom-notificationoptions-noscreen">noscreen<a class="self-link" href="#dom-notificationoptions-noscreen"></a></dfn> = false;
boolean <dfn class="idl-code" data-default="false" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/sticky<dict-member>" data-type="boolean " id="dom-notificationoptions-sticky">sticky<a class="self-link" href="#dom-notificationoptions-sticky"></a></dfn> = false;
any <dfn class="idl-code" data-default="null" data-dfn-for="NotificationOptions" data-dfn-type="dict-member" data-export="" data-global-name="NotificationOptions<dictionary>/data<dict-member>" data-type="any " id="dom-notificationoptions-data">data<a class="self-link" href="#dom-notificationoptions-data"></a></dfn> = null;
};
enum <dfn class="idl-code" data-dfn-type="enum" data-export="" data-global-name="" id="enumdef-notificationpermission">NotificationPermission<a class="self-link" href="#enumdef-notificationpermission"></a></dfn> {
"default",
"denied",
"granted"
};
callback <dfn class="idl-code" data-dfn-type="callback" data-export="" data-global-name="" id="callbackdef-notificationpermissioncallback">NotificationPermissionCallback<a class="self-link" href="#callbackdef-notificationpermissioncallback"></a></dfn> = void (<a data-link-type="idl-name" href="#enumdef-notificationpermission">NotificationPermission</a> <dfn class="idl-code" data-dfn-for="NotificationPermissionCallback" data-dfn-type="argument" data-export="" data-global-name="NotificationPermissionCallback/permission<argument>" id="dom-notificationpermissioncallback-permission">permission<a class="self-link" href="#dom-notificationpermissioncallback-permission"></a></dfn>);
enum <dfn class="idl-code" data-dfn-type="enum" data-export="" data-global-name="" id="enumdef-notificationdirection">NotificationDirection<a class="self-link" href="#enumdef-notificationdirection"></a></dfn> {
"auto",
"ltr",
"rtl"
};
</pre>
<p>一个 <a data-link-type="dfn" href="#non_persistent-notification">non-persistent notification</a> 由一个 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code>
对象来表示，并且可以通过 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 的
<a href="#dom-notification-notification">constructor</a>来创建
</p>
<p>一个 <a data-link-type="dfn" href="#persistent-notification">persistent notification</a> 由零或多个
<code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象来表示，并且可以通过
<code class="idl"><a data-link-type="idl" href="#dom-serviceworkerregistration-shownotification">showNotification()</a></code> 方法来创建。
</p>
<h3 class="heading settled" data-level="3.1" id="garbage-collection"><span class="secno">3.1. </span><span class="content">垃圾回收</span><a class="self-link" href="#garbage-collection"></a></h3>
<p>当 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象相对应的 <a data-link-type="dfn" href="#concept-notification">notification</a> 在
<a data-link-type="dfn" href="#list-of-notifications">list of notifications</a> 时，该对象有一个 <b>type</b> 为
<code>click</code> 或 <code>error</code> 的 <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#concept-event-listener">event listener</a>，那么该 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象
一定不能被垃圾回收。
</p>
<h3 class="heading settled" data-level="3.2" id="constructors"><span class="secno">3.2. </span><span class="content">构造函数</span><a class="self-link" href="#constructors"></a></h3>
<p>当调用 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="constructor" data-export="" data-lt="Notification()" id="dom-notification-notification"><code>Notification(title, options)
</code><a class="self-link" href="#dom-notification-notification"></a></dfn> 构造函数时，必须（除非另有说明）执行这些步骤：
</p>
<ol>
<li>
<p>如果 <var>options</var> 存在 <code>sticky</code> ，<a data-link-type="dfn" href="http://heycam.github.io/webidl/#dfn-throw">throw</a> <code>TypeError</code> 异常。
</p>
<li>
<p>如果 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#global-object">global object</a> 是一个
<code class="idl"><a data-link-type="idl" href="https://slightlyoff.github.io/ServiceWorker/spec/service_worker/#serviceworkerglobalscope">ServiceWorkerGlobalScope</a></code> 对象， <a data-link-type="dfn" href="http://heycam.github.io/webidl/#dfn-throw">throw</a> 一个
<code>TypeError</code> 异常。
</p>
<li>
<p>设 <var>notification</var> 是给定
<var>title</var> 和 <var>options</var> 之后
<a data-link-type="dfn" href="#create-a-notification">creating a notification</a> 的。重新抛出任一异常。
</p>
<li>
<p>设 <var>n</var> 是与
<var>notification</var> 相关联的新 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> .
</p>
<li>
<p> <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#in-parallel">in parallel</a> 执行这些子步骤：
</p>
<ol>
<li>
<p>如果对 <var>notification</var> 的 <a data-link-type="dfn" href="#concept-origin">origin</a> 的 <a data-link-type="dfn" href="#permission">permission</a> 不是 "<code>granted</code>"，在 <var>n</var> 上
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#queue-a-task">queue a task</a> 来 <a data-link-type="dfn" href="https://dom.spec.whatwg.org/#concept-event-fire">fire an event</a> 命名为
<code>error</code>，并终止这些步骤。
</p>
<li>
<p>对 <var>notification</var> 执行 <a data-link-type="dfn" href="#fetch-steps">fetch steps</a>。
</p>
<li>
<p>对 <var>notification</var> 执行 <a data-link-type="dfn" href="#show-steps">show steps</a>。
</p>
</ol>
<li>
<p>返回 <var>n</var>.
</p></ol>
<h3 class="heading settled" data-level="3.3" id="static-members"><span class="secno">3.3. </span><span class="content">静态成员</span><a class="self-link" href="#static-members"></a></h3>
<p>获取静态属性 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-permission"><code>permission</code><a class="self-link" href="#dom-notification-permission"></a></dfn>
的值必须返回对
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a> 的 <a data-link-type="dfn" href="#permission">permission</a>。
</p>
<p>当调用静态方法 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="method" data-export="" data-lt="requestPermission()" id="dom-notification-requestpermission"><code>requestPermission(callback)
</code><a class="self-link" href="#dom-notification-requestpermission"></a></dfn> 时，必须执行这些步骤：
</p>
<ol>
<li>
<p>返回，但依然 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#in-parallel">in parallel</a> 执行这些子步骤：
</p>
<li>
<p>设 <var>permission</var> 是对
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a><a data-link-type="dfn" href="#permission">permission</a>。
</p>
<li>
<p>如果 <var>permission</var> 是 "<code>default</code>"，询问用户对 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a> 进行显示通知是否可接受。如果可接受，设置许可为
"<code>granted</code>"，否则设置许可为 "<code>denied</code>" 。
</p>
<li>
<p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#queue-a-task">Queue a task</a> 来设置 <a data-link-type="dfn" href="#permission">permission</a> 为
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object">entry settings object</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/browsers.html#origin">origin</a> 的 <var>permission</var>，并且当存在 <var>callback</var> 时将 <var>permission</var> 作为参数调用该
<var>callback</var> 。如果有任何异常抛出，
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#report-the-exception">report the exception</a>.
</p></ol>
<p class="warning">设计时，通知平台是迄今为止询问用户许可比较有意义的实例。其他 API
的规范没有必要使用该模式，相反可使用
<a href="http://robert.ocallahan.org/2011/06/permissions-for-web-applications_30.html">
更多合适的替代品</a>之一。
</p>
<h3 class="heading settled" data-level="3.4" id="object-members"><span class="secno">3.4. </span><span class="content">对象成员</span><a class="self-link" href="#object-members"></a></h3>
<p><code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象必须作为属性支持下列 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#event-handlers">event handlers</a> （及其相应的
<a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#event-handler-event-types">event handler event types</a>）。
</p>
<table>
<thead>
<tr>
<th><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#event-handlers">事件处理程序</a>
<th><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#event-handler-event-types">事件处理事件类型</a>
<tbody>
<tr>
<td><dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-onclick"><code>onclick</code><a class="self-link" href="#dom-notification-onclick"></a></dfn>
<td><code>click</code>
<tr>
<td><dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-onerror"><code>onerror</code><a class="self-link" href="#dom-notification-onerror"></a></dfn>
<td><code>error</code>
</table>
<p>当调用 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="method" data-export="" id="dom-notification-close"><code>close()</code><a class="self-link" href="#dom-notification-close"></a></dfn> 方法时，
必须对 <a data-link-type="dfn" href="#concept-notification">notification</a> 执行 <a data-link-type="dfn" href="#close-steps">close steps</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-title"><code>title</code><a class="self-link" href="#dom-notification-title"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-title">title</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-dir"><code>dir</code><a class="self-link" href="#dom-notification-dir"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-direction">direction</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-lang"><code>lang</code><a class="self-link" href="#dom-notification-lang"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#concept-language">language</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-body"><code>body</code><a class="self-link" href="#dom-notification-body"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#body">body</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-tag"><code>tag</code><a class="self-link" href="#dom-notification-tag"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的 <a data-link-type="dfn" href="#tag">tag</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-icon"><code>icon</code><a class="self-link" href="#dom-notification-icon"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#icon-url">icon URL</a>, <a data-link-type="dfn" href="https://url.spec.whatwg.org/#concept-url-serializer">serialized</a>, ，或者当 <a data-link-type="dfn" href="#concept-notification">notification</a> 没有 <a data-link-type="dfn" href="#icon-url">icon URL</a>
时返回空字符串。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-sound"><code>sound</code><a class="self-link" href="#dom-notification-sound"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a>’s
<a data-link-type="dfn" href="#sound-url">sound URL</a>, <a data-link-type="dfn" href="https://url.spec.whatwg.org/#concept-url-serializer">serialized</a>，或者当 <a data-link-type="dfn" href="#concept-notification">notification</a> 的 <a data-link-type="dfn" href="#sound-url">sound URL</a>时
返回空字符串。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-renotify"><code>renotify</code><a class="self-link" href="#dom-notification-renotify"></a></dfn> 属性值必须
返回
<a data-link-type="dfn" href="#concept-notification">notification</a>’s <a data-link-type="dfn" href="#renotify-preference-flag">renotify preference flag</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-silent"><code>silent</code><a class="self-link" href="#dom-notification-silent"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#silent-preference-flag">silent preference flag</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-noscreen"><code>noscreen</code><a class="self-link" href="#dom-notification-noscreen"></a></dfn> 属性值必须
返回
<a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#screen-off-preference-flag">screen off preference flag</a>.
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-sticky"><code>sticky</code><a class="self-link" href="#dom-notification-sticky"></a></dfn> 属性值必须
返回 <a data-link-type="dfn" href="#concept-notification">notification</a> 的
<a data-link-type="dfn" href="#sticky-preference-flag">sticky preference flag</a>。
</p>
<p>获取 <dfn class="idl-code" data-dfn-for="Notification" data-dfn-type="attribute" data-export="" id="dom-notification-data"><code>data</code><a class="self-link" href="#dom-notification-data"></a></dfn> 属性值必须
返回
<a data-link-type="dfn" href="#concept-notification">notification</a> 的 <a data-link-type="dfn" href="#data">data</a> 的 <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/interaction.html#structured-clone">structured clone</a>。
</p>
<h3 class="heading settled" data-level="3.5" id="examples"><span class="secno">3.5. </span><span class="content">示例</span><a class="self-link" href="#examples"></a></h3>
<h4 class="heading settled" data-level="3.5.1" id="using-events"><span class="secno">3.5.1. </span><span class="content">使用事件</span><a class="self-link" href="#using-events"></a></h4>
<p>开发者可以使用 <code class="idl"><a data-link-type="idl" href="#notification">Notification</a></code> 对象在其生命周期内发出的事件来产生所需要的行为。
</p>
<p>当用户激活一个通知时会触发 <code>click</code> 事件。
</p>
<pre class="example">var not = new Notification("Gebrünn Gebrünn by Paul Kalkbrenner", { icon: "newsong.svg", tag: "song" })
notification.onclick = function() { displaySong(this) }</pre>
<h4 class="heading settled" data-level="3.5.2" id="tags-example"><span class="secno">3.5.2. </span><span class="content">多实例使用 <code>tag</code> 成员</span><a class="self-link" href="#tags-example"></a></h4>
<p>Web 应用程序常常在多实例中进行并发操作，比如用户在多个浏览器标签中打开一个邮件
应用程序。由于桌面是一种共享资源，通知 API 通过 <code>tag</code> 成员提供一种很
容易协调的方式进行通知。
</p>
<p>表示相同概念的事件可以使用相同的标记，当两个通知同时显示时，用户只会收到一个通知。
</p>
<pre class="example">实例 1 | 实例 2
|
// 有个新邮件的通知实例 |
new Notification("New mail from John Doe", |
{ tag: 'message1' }); |
|
| // 稍后该实例通知有个新邮件。
| new Notification("New mail from John Doe",
| { tag: 'message1' });</pre>
<p>如果用户代理遵循这里的算法，这种情况的结果就是，用户收到
<strong>单一的</strong> 通知 "New mail from John Doe".
</p>
<h4 class="heading settled" data-level="3.5.3" id="using-the-tag-member-for-a-single-instance"><span class="secno">3.5.3. </span><span class="content">单实例使用 <code>tag</code> 成员</span><a class="self-link" href="#using-the-tag-member-for-a-single-instance"></a></h4>
<p>单实例应用程序也可以使用 <code>tag</code>成员来尽可能保持其通知的最新状态变化。
</p>
<p>例如，Alice 和 Bob 正在使用一个聊天应用程序，当 Alice 空闲时 Bob 发送了多条信息，
应用程序可能更倾向于 Alice 没有看到每个消息的通知界面。
</p>
<pre class="example">// Bob 说 "Hi"
new Notification("Bob: Hi", { tag: 'chat_Bob' });
// Bob 说 "Are you free this afternoon?"
new Notification("Bob: Hi / Are you free this afternoon?", { tag: 'chat_Bob' });</pre>
<p>这种情况的结果就是<i>单一的</i>通知；第二条消息会替换第一条消息，因为它们具有
相同的标签。在该队列通知（先进先出）平台，使用标签允许通知保持其在队列中的位置。
在总是最先显示最新通知的平台里，也可以使用 <code class="idl"><a class="idl-code" data-link-type="method" href="#dom-notification-close">close()</a></code> 方法实现类似的结果。
</p>
<h2 class="heading settled" data-level="4" id="service-worker-api"><span class="secno">4. </span><span class="content">服务线程 API</span><a class="self-link" href="#service-worker-api"></a></h2>