@adv-ui/re-vendor-by-consents-loader
v1.2.0
Published
Load vendors according to the allowed user's consents
Downloads
4,286
Maintainers
Keywords
Readme
Vendor by Consents Loader
Set of utilities to load vendors scripts according to user consents.
You only need to define purposes
and specialFeatureOptins
as they're the only configurable consents on the tfc
.
🔴 IMPORTANT: Before following the README, be sure you're loading the Stub from Boros TCF as it's required.
Loading list of vendors
import {
initVendorConsentsLoader,
addVendorLoadedEventListener
} from '@adv-ui/re-vendor-by-consents-loader'
const OPTIMIZELY_KEY = 'optimizely'
initVendorConsentsLoader({
vendors: {
tealium: {
script: 'https://frtassets.fotocasa.es/external-scripts/utag-pro.js',
consents: {
purposes: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
specialFeatureOptins: [1]
}
},
[OPTIMIZELY_KEY]: {
script: 'https://frtassets.fotocasa.es/external-scripts/optimizely.js',
consents: {
purposes: [1, 2]
}
}
}
})
addVendorLoadedEventListener(({vendor}) => {
vendor === OPTIMIZELY_KEY && console.log('Optimizely has been loaded')
})
Loading a single vendor
In some cases you might want to load a single vendor later in your code:
import {
loadSingleVendorByConsent,
addVendorLoadedEventListener
} from '@adv-ui/re-vendor-by-consents-loader'
const GOOGLE_ADSENSE_KEY = 'google_adsense'
loadSingleVendorByConsent({
name: GOOGLE_ADSENSE_KEY,
script: 'https://google.com/ads.js',
consents: {
purposes: [5, 6]
}
})
addVendorLoadedEventListener(({vendor}) => {
vendor === GOOGLE_ADSENSE_KEY && console.log('Google has been loaded')
})
You can also set a vendor configuration without an specific script
in case the vendor doesn't require it to work:
import {
loadSingleVendorByConsent,
addVendorLoadedEventListener
} from '@adv-ui/re-vendor-by-consents-loader'
const RTB_HOUSE_KEY = 'rtb_house'
loadSingleVendorByConsent({
name: RTB_HOUSE_KEY,
consents: {
purposes: [2, 6]
}
})
addVendorLoadedEventListener(({vendor}) => {
vendor === RTB_HOUSE_KEY && console.log('RTB House is ready')
})
Loading specific vendors
Some vendors are used across all Adevinta Spain products and, for sake of convenience, they've their own script to load them.
Comscore
import {
addVendorLoadedEventListener,
loadComscore
} from '@adv-ui/re-vendor-by-consents-loader'
loadComscore({comscoreClientId: '7109919'})
addVendorLoadedEventListener(({vendor}) => {
vendor === 'comscore' && console.log('Comscore has been loaded')
})
Using it in Monolithic apps
// First load the UMD module.
<script src="https://unpkg.com/@adv-ui/re-vendor-by-consents-loader/umd/index.js"></script>
<script>
// load comscore
window.sui.vendors.loadComscore({comscoreClientId: '7109919'})
// init vendors loader by consents
window.sui.vendors.initVendorConsentsLoader({
vendors: {
tealium: {
script: 'https://frtassets.fotocasa.es/external-scripts/utag-pro.js',
consents: {
purposes: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
specialFeatureOptins: [1]
}
}
}
})
// load a single vendor by consents
window.sui.vendors.loadSingleVendorByConsent({
name: 'google_adsense',
script: 'https://google.com/ads.js',
consents: {
purposes: [5, 6]
}
})
// add evento for listening comscore load
window.sui.vendors.addVendorLoadedEventListener(({vendor}) => {
vendor === 'comscore' && console.log('Comscore has been loaded')
vendor === 'tealium' && window._utag.init()
vendor === 'google_adsense' && window.gads.startAds()
})
//
</script>
List of Purposes
Purposes:
- 1 - Store and/or access information on a device
- 2 - Select basic ads
- 3 - Create a personalised ads profile
- 4 - Select personalised ads
- 5 - Create a personalised content profile
- 6 - Select personalised content
- 7 - Measure ad performance
- 8 - Measure content performance
- 9 - Apply market research to generate audience insights
- 10 - Develop and improve products
Special Purposes
- SP1 - Ensure security, prevent fraud, and debug
- SP2 - Technically deliver ads or content
Features
- F1 - Match and combine offline data sources
- F2 - Link different devices
- F3 - Receive and use automatically-sent device characteristics for identification
Special Features
- SF1 - Use precise geolocation data
- SF2 - Actively scan device characteristics for identification