-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #29 from IABTechLab/jyg-UID2-1411-create-CSTG-preb…
…id-example-app jyg-uid2-1411 create cstg prebid example app
- Loading branch information
Showing
10 changed files
with
352 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| FROM nginx:latest | ||
| COPY ./nginx/default.conf.template /etc/nginx/templates/ | ||
| COPY ./html /usr/share/nginx/html |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| # Prebid.js UID2 with client-side token generation | ||
|
|
||
| To run this project, use the VS Code `Launch CSTG Prebid Integration (Chrome)` launch task. | ||
|
|
||
| As configured, you will need the Operator running locally using `local-config.json` (usually done via IntelliJ) to ensure test keys are available. | ||
|
|
||
| Alternatively, you can create a separate client side keypair and update the `Run Prebid CSTG Container` section in `tasks.json` with appropriate values for `SERVER_PUBLIC_KEY` and `SUBSCRIPTION_ID`. |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,136 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="UTF-8" /> | ||
| <title>UID2 Prebid.js CSTG Integration Example</title> | ||
| <link rel="stylesheet" type="text/css" href="/stylesheets/app.css" /> | ||
| <link rel="shortcut icon" href="/images/favicon.png" /> | ||
| <script async src="/scripts/prebid.js"></script> | ||
| <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | ||
| <script> | ||
| function updateGuiElements() { | ||
| const uid2 = pbjs.getUserIds().uid2; | ||
| $('#targeted_advertising_ready').text(uid2 ? 'yes' : 'no'); | ||
| $('#advertising_token').text(uid2 ? String(uid2.id) : ''); | ||
| if (!uid2) { | ||
| $('#login_form').show(); | ||
| $('#clear_storage_form').hide(); | ||
| } else { | ||
| $('#login_form').hide(); | ||
| $('#clear_storage_form').show(); | ||
| } | ||
| } | ||
|
|
||
| async function handleLogin() { | ||
| const email = $('#email').val(); | ||
| setUid2Config(email); | ||
| await pbjs.refreshUserIds(); | ||
| updateGuiElements(); | ||
| } | ||
|
|
||
| function handleClearStorage() { | ||
| localStorage.removeItem('__uid2_advertising_token'); | ||
| location.reload(); | ||
| } | ||
|
|
||
| function onDocumentReady() { | ||
| $('#login').click(handleLogin); | ||
| $('#clear_storage').click(handleClearStorage); | ||
|
|
||
| updateGuiElements(); | ||
| } | ||
|
|
||
| function setUid2Config(email) { | ||
| const cstgParams = email ? {email, subscriptionId: '{{ SUBSCRIPTION_ID }}', serverPublicKey: '{{ SERVER_PUBLIC_KEY }}'} : {}; | ||
| const uid2Params = { | ||
| uid2ApiBase: '{{ UID2_BASE_URL }}', | ||
| ...cstgParams, | ||
| }; | ||
| pbjs.setConfig({ | ||
| debug: true, | ||
| userSync: { | ||
| userIds: [ | ||
| { | ||
| name: 'uid2', | ||
| params: uid2Params, | ||
| }, | ||
| ], | ||
| syncDelay: 5000, | ||
| auctionDelay: 1000, | ||
| }, | ||
| }); | ||
| } | ||
|
|
||
| var adUnits = [ | ||
| { | ||
| code: 'test-div', | ||
| mediaTypes: { | ||
| banner: { | ||
| sizes: [ | ||
| [300, 250], | ||
| [300, 600], | ||
| [728, 90], | ||
| ], | ||
| }, | ||
| }, | ||
| bids: [ | ||
| { | ||
| bidder: 'appnexus', | ||
| params: { | ||
| placementId: 13144370, | ||
| }, | ||
| }, | ||
| ], | ||
| }, | ||
| ]; | ||
|
|
||
| var pbjs = pbjs || {}; | ||
| pbjs.que = pbjs.que || []; | ||
| pbjs.que.push(function () { | ||
| setUid2Config(); | ||
| pbjs.addAdUnits(adUnits); | ||
| pbjs.requestBids(); | ||
|
|
||
| $(document).ready(onDocumentReady); | ||
| }); | ||
| </script> | ||
| </head> | ||
| <body> | ||
| <h1>UID2 Prebid.js CSTG Integration Example</h1> | ||
| <p class="intro"> | ||
| This example demonstrates how a content publisher can use the <a href="https://unifiedid.com/docs/guides/integration-prebid">Prebid.js UID2 module</a> | ||
| to generate client-side UID2 advertising tokens. | ||
| </p> | ||
| <table id="uid2_state"> | ||
| <tr> | ||
| <td class="label">Ready for Targeted Advertising:</td> | ||
| <td class="value"><pre id="targeted_advertising_ready"></pre></td> | ||
| </tr> | ||
| <tr> | ||
| <td class="label">UID2 Advertising Token:</td> | ||
| <td class="value"><pre id="advertising_token"></pre></td> | ||
| </tr> | ||
| </table> | ||
| <div id="test-div"> | ||
| </div> | ||
| <div id="login_form" style="display: none" class="form"> | ||
| <div class="email_prompt"> | ||
| <input | ||
| type="text" | ||
| id="email" | ||
| name="email" | ||
| placeholder="Enter an email address" | ||
| style="border-style: none" | ||
| value="[email protected]" | ||
| /> | ||
| </div> | ||
| <div><button type="button" class="button" id="login">Log In</button></div> | ||
| </div> | ||
| <div id="clear_storage_form" style="display: none" class="form"> | ||
| <form> | ||
| <button type="button" class="button" id="clear_storage">Clear Storage</button> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </body> | ||
| </html> |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,102 @@ | ||
| body { | ||
| padding: 50px; | ||
| font: | ||
| 14px 'Lucida Grande', | ||
| Helvetica, | ||
| Arial, | ||
| sans-serif; | ||
| } | ||
|
|
||
| a { | ||
| color: #00b7ff; | ||
| } | ||
|
|
||
| .button { | ||
| border-style: none; | ||
| cursor: pointer; | ||
| align-items: center; | ||
| height: 40px; | ||
| width: 401px; | ||
| text-align: center; | ||
| position: absolute; | ||
| letter-spacing: 0.28px; | ||
| box-sizing: border-box; | ||
| color: white; | ||
| font-family: 'Raleway', Helvetica, Arial, serif; | ||
| font-size: 14px; | ||
| font-style: normal; | ||
| font-weight: 700; | ||
| text-transform: none; | ||
| text-indent: 0; | ||
| text-shadow: none; | ||
| margin: 0; | ||
| padding: 1px 6px; | ||
| background-color: rgba(2, 10, 64); | ||
| border-image: initial; | ||
| } | ||
|
|
||
| .form { | ||
| margin-top: 40px; | ||
| } | ||
|
|
||
| .email_prompt { | ||
| align-items: center; | ||
| align-self: center; | ||
| background-color: white; | ||
| border: 1px solid rgba(2, 10, 64); | ||
| border-radius: 2px; | ||
| box-sizing: border-box; | ||
| display: inline-flex; | ||
| flex-direction: row; | ||
| flex-shrink: 0; | ||
| height: 40px; | ||
| justify-content: flex-start; | ||
| margin-right: 1px; | ||
| margin-bottom: 20px; | ||
| min-width: 399px; | ||
| padding: 0 16px; | ||
| position: relative; | ||
| width: auto; | ||
| } | ||
|
|
||
| #email { | ||
| background-color: white; | ||
| flex-shrink: 0; | ||
| height: auto; | ||
| letter-spacing: 0.12px; | ||
| line-height: 16px; | ||
| min-height: 16px; | ||
| position: relative; | ||
| text-align: left; | ||
| white-space: nowrap; | ||
| width: 351px; | ||
| color: rgba(2, 10, 64, 1); | ||
| font-family: 'Raleway', Helvetica, Arial, serif; | ||
| font-size: 12px; | ||
| font-style: normal; | ||
| font-weight: 500; | ||
| padding: 1px 2px; | ||
| outline: none; | ||
| } | ||
|
|
||
| h1 { | ||
| padding-bottom: 20px; | ||
| } | ||
|
|
||
| #uid2_state .label { | ||
| white-space: nowrap; | ||
| padding-right: 20px; | ||
| } | ||
| #uid2_state tr { | ||
| margin-top: 10px; | ||
| } | ||
|
|
||
| .message { | ||
| color: green; | ||
| padding: 20px; | ||
| margin-left: -22px; | ||
| font-size: 16px; | ||
| font-weight: 500; | ||
| border: 2px solid green; | ||
| border-radius: 5px; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| server { | ||
| listen 80; | ||
| server_name localhost; | ||
| root /usr/share/nginx/html; | ||
|
|
||
| #access_log /var/log/nginx/host.access.log main; | ||
|
|
||
| location / { | ||
| sub_filter '{{ UID2_BASE_URL }}' '${UID2_BASE_URL}'; | ||
| sub_filter '{{ SERVER_PUBLIC_KEY }}' '${SERVER_PUBLIC_KEY}'; | ||
| sub_filter '{{ SUBSCRIPTION_ID }}' '${SUBSCRIPTION_ID}'; | ||
| sub_filter_types *; | ||
| sub_filter_once off; | ||
| } | ||
| } |