pages/address-masking.md - Issue 29790573: Fixes #6 - Extend address masking to mask other attributes

Delta Between Two Patch Sets: pages/address-masking.md

Issue 29790573: Fixes #6 - Extend address masking to mask other attributes (Closed) Base URL: https://hg.adblockplus.org/website-defaults

Left Patch Set: Created May 25, 2018, 7:34 a.m.

Right Patch Set: Addressed NITs Created May 25, 2018, 9:01 a.m.

Left:
Right:

Use n/p to move between diff chunks; N/P to move between comments.

Jump to:

Left: Side by side diff | Download
Right: Side by side diff | Download

LEFT	RIGHT
1 title=Address Masking	1 title=Address Masking

2 description=Use address masking to avoid spam.	2 description=Use address masking to avoid spam.

3	3

4 # Address masking	4 # Address masking

5	5

6 Use address masking to avoid spam.	6 Use address masking to avoid spam.

7	7

8 ## Usage	8 ## Usage

9	9

10 ### Step 1: Include script on page	10 ### Step 1: Include script on page

11	11

12 Include the following script at the bottom of a page:	12 Include the following script at the bottom of a page:

13	13

14 ```	14 ```

15 <script src="/js/address-masking.js"></script>	15 <script src="/js/address-masking.js"></script>

16 ```	16 ```

17	17

18 ### Step 2: Base64 encode addresses	18 ### Step 2: Base64 encode addresses

19	19

20 Base64 encode sensitive `href` addresses into `data-mask` attributes.	20 Base64 encode sensitive `href` addresses into `data-mask` attributes.

21	21

22 #### Markdown (before processing)	22 #### Markdown (before processing)

23	23

24 ```	24 ```

25 [Private Email](#){: data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'	25 [Private Email](#){: data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'
ire 2018/05/25 07:35:05 This requires that we use a single quote for the o This requires that we use a single quote for the opening closing of the data-mask attribute juliandoucette 2018/05/25 08:50:59 You mean we can't just escape or flip the quotes t Show quoted text On 2018/05/25 07:35:05, ire wrote: > This requires that we use a single quote for the opening closing of the > data-mask attribute You mean we can't just escape or flip the quotes the other way (double outer, single inner)? If so, it's worth mentioning that on the page. ire 2018/05/25 09:02:10 No we can't. I will add that. Show quoted text On 2018/05/25 08:50:59, juliandoucette wrote: > On 2018/05/25 07:35:05, ire wrote: > > This requires that we use a single quote for the opening closing of the > > data-mask attribute > > You mean we can't just escape or flip the quotes the other way (double outer, > single inner)? > > If so, it's worth mentioning that on the page. No we can't. I will add that.
26	26

27 [#](#){: data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textConte nt": "dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'	27 [Email](#){: data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textC ontent": "dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'
juliandoucette 2018/05/25 08:50:59 TOL: Seems like we could make this friendlier than TOL: Seems like we could make this friendlier than "#"? ire 2018/05/25 09:02:10 Changed to "email" Show quoted text On 2018/05/25 08:50:59, juliandoucette wrote: > TOL: Seems like we could make this friendlier than "#"? Changed to "email"
28 ```	28 ```

	29

	30 Note that you are required to use single quotes `'` for the `data-mask` attribut e and double quotes `"` for the keys and values in the object.

29	31

30 #### HTML (before processing)	32 #### HTML (before processing)

31	33

32 ```	34 ```

33 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'>Private Email< /a>	35 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'>Private Email< /a>

34	36

35 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textContent": " dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'>#</a>	37 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textContent": " dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'>Email</a>

36 ```	38 ```

37	39

38 #### Output (after processing)	40 #### Output (after processing)

39	41

40 ```	42 ```

41 <a href="mailto:username@example.com">Private Email</a>	43 <a href="mailto:username@example.com">Private Email</a>

42	44

43 <a href="mailto:username@example.com">username@example.com</a>	45 <a href="mailto:username@example.com">username@example.com</a>

44 ```	46 ```

45	47

46 ## Example	48 ## Example

47	49

48 <script src="/js/address-masking.js"></script>	50 <script src="/js/address-masking.js"></script>

49	51

50 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'>Private Email< /a>	52 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t" }'>Private Email< /a>

51	53

52 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textContent": " dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'>#</a>	54 <a data-mask='{ "href": "bWFpbHRvOnVzZXJuYW1lQGV4YW1wbGUuY29t", "textContent": " dXNlcm5hbWVAZXhhbXBsZS5jb20=" }'>Email</a>

LEFT	RIGHT