How can you incorporate advertisements into a Chrome extension?

As outlined in the Google Developer program policy (https://developer.chrome.com/webstore/program_policies), incorporating ads into your Chrome extension is permissible under certain conditions:

Ads should be contextually relevant or clearly identified with the associated app or extension. Additionally, users must have the ability to easily remove ads by adjusting settings or uninstalling the app completely. Ads should not mimic system notifications or warnings.

With this directive in mind, I decided to include ads in my extension using Chitika, as AdSense was restricted. However, implementing these ads has been a complex process. It required modifying minified files and ensuring compliance with the Chrome extension manifest's content_security_policy. Presently, only one company's ads are displaying correctly, while others are blocked due to the following error message:

getads.js:340 Refused to execute inline script due to Content Security Policy restrictions. To allow inline execution, consider using 'unsafe-inline', hashes, or nonces.

I attempted adding the keyword unsafe-inline, but encountered another issue:

Ignored insecure CSP value "'unsafe-inline'" in directive 'object-src'.

Given these challenges, I am seeking advice on resolving this situation. Since I lack control over how ads are integrated into my software, I face limitations. Any suggestions for overcoming this obstacle? Alternatively, are there other ad platforms suitable for Chrome extensions that can deliver unobtrusive 320x50 ads? Generating income from my popular chrome extension, which receives 8 million page impressions monthly, remains a priority!

Your insights and assistance are greatly appreciated.

Edit: The provided ad code snippet is as follows:

( function() {
if (window.CHITIKA === undefined) { window.CHITIKA = { 'units' : [] }; };
var unit = {"calltype":"async[2]","publisher":"USER_NAME","width":300,"height":250,"sid":"Chitika Default"};
var placement_id = window.CHITIKA.units.length;
window.CHITIKA.units.push(unit);
document.write('<div id="chitikaAdBlock-' + placement_id + '"></div>');
}());

Please remember to include:

<script type="text/javascript" src="../../js/getads.js" async></script>
, accessible via: , after replacing all domain names with the secure https version.

Edit 2: My content_security_policy configuration:

"content_security_policy": "script-src 'self' https://www.google-analytics.com https://secure.adnxs.com https://gum.criteo.com https://ib.adnxs.com https://mm.chitika.net https://cdn.chitika.net; object-src 'self'",

Answer №1

According to the guidelines outlined on the developer program policies website, it is stated that:

As per the AdSense policies, AdSense cannot be utilized for displaying ads in Chrome Extensions or Chrome Apps.

This essentially means that ads can no longer be used in Chrome extensions.

Answer №2

If you find that unsafe-inline is not effective, consider using a hash to uniquely identify each script you want to run. By assigning specific hashes to the code you wish to execute in your HTML, you can ensure it is allowed to run. For more information on this method, visit: http://www.w3.org/TR/2015/CR-CSP2-20150721/#script-src-hash-usage

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to preserve the numerical type of a percentage when applying number formatting?

After applying number formatting, I converted a numerical value of 150 to 150.00%. Although this is the desired display format with the percentage sign included, the data type remains as string instead of number. Is there a method to convert it back to a ...

Navigating through two nested arrays in JavaScript to access an object

Having difficulty extracting the nested car values using JavaScript (lodash). Take a look at the JSON data below: { "cars":[ { "nestedCars":[ { "car":"Truck", "color" ...

"Implementing a filter with multiple select options in AngularJS

As a beginner delving into Angular, I find myself working with a multiple select feature to filter a list by name. <select multiple ng-options="data.name for data in datas" ng-model="filterData"> </select> Currently, I am able to filter with ...

Currently I am developing a Minimax Algorithm implementation for my reversi game using react.js, however I am encountering a RangeError

I've been implementing a Minimax Algorithm for my reversi game to create a strong AI opponent for players. However, I ran into the following error message: "RangeError: Maximum call stack size exceeded" How can I go about resolving this issue? Here ...

Utilizing pjax to open internal pages in a new tab

I have incorporated pjax into one of my projects, but I am facing a challenge when trying to open a page in a new tab or window. It appears that pjax opens all links in the same window except for those that lead to external websites. Below is the snippet ...

When the button is clicked, the image vanishes into thin

One common issue is the image disappearing when users click on the Rotate Anti-clockwise or Rotate Clockwise buttons. This can be a frustrating problem to tackle! Check out this link for more information. If you run into this issue, here are some tips: ...

Retrieve user data from the database

As I work on developing a full stack app, I have been relying on tutorials and videos to learn the necessary skills. However, I am facing an issue with a GET request to retrieve information about a user who is logged into the system. To troubleshoot, I hav ...

The ng-repeat track by function is not functioning as expected, displaying slow performance and continuing to create $$hashKey

In my code, I have an ng-repeat setup like this: ng-repeat="article in main[main.mode].primary | orderBy: main[main.mode].primary.filter.order track by article.url" The main[main.mode].primary array contains the data and the .filter.order string is used ...

guarantee that a DOM setting is ready for enzyme

Encountering an issue with Enzyme's mount function while testing a React application in Jest from the command line. The error message indicates that a DOM environment is not loaded, leading to speculation about the need to set up JSDOM. However, it&ap ...

By pressing enter, Combobox autocomplete feature automatically selects the first item in the suggestion list

I have successfully implemented a jQuery combobox autocomplete feature, similar to the one on the demo below. jQuery combobox autocomplete Is there a way to configure the jQuery combobox autocomplete to automatically select the top suggestion when the ...

A guide to sorting JSON objects in Node.js

let data={ '0': { benchmark: null, hint: '', _id: '54fe44dadf0632654a000fbd', date: '2015-05-10T01:11:54.479Z' }, '1': { benchmark: null, hint: '', _id: ...

Calculating the 3D Longitude and Latitude coordinates in a THREE.js globe using the radius along with the x and y values

Currently, I am exploring a Codepen where JSON data is being utilized to feed into a JavaScript application that maps coordinates using x and y values. Rather than utilizing longitude and latitude to map a location like Hong Kong, the developer uses these ...

When lines are added to a file in Node.js, the content is written in a haphazard sequence

I've encountered an issue with the code I wrote where the header line is not consistently at the top. It seems to randomly appear on the second or third line instead. I've tried troubleshooting multiple times without success, so any help would be ...

What is the best way to test the validity of a form while also verifying email availability?

I am currently working on implementing async validation in reactive forms. My goal is to disable the submit button whenever a new input is provided. However, I am facing an issue where if duplicate emails are entered, the form remains valid for a brief per ...

Updating state in React is not possible

I am having trouble updating my state (specifically with setCoords). The API request is returning a 200 status code and the elements I need are present: https://i.stack.imgur.com/a8QzN.png Below is the code I am working with: const App = () => { co ...

Experience live streaming of web content in the browser via GitLab CI utilizing selenium/standalone-chrome integration

Utilizing Docker Desktop, I have configured a setup for conducting local tests by utilizing the selenium/standalone-chrome Docker container. This container serves two ports - 4444 for Selenium and 7900 for a noVNC player, allowing me to view the browser an ...

Is there a way to display the specific information of a flatlist item in a pop-up window?

Welcome to the HomesScreen.js! This section handles rendering the flat list elements. import { StatusBar } from 'expo-status-bar'; import { Button, Image, Modal, StyleSheet, Text, TouchableOpacity, View } from 'react-native'; import { ...

Struggling with a 400 Bad Request Error in Angular with WebAPI Integration

I've been working on creating a database to keep track of comics, and so far I can successfully add new comics and retrieve them using GET requests. However, I've hit a roadblock when trying to update existing comics using PUT requests. Every tim ...

"Implementing the Keydown event while in full screen mode using the FullScreen

I am currently using the JavaScript FullScreen API along with jQuery in both Chrome and Firefox. My goal is to prevent the keydown event from bubbling, as I do not want users to exit fullscreen mode using hotkeys like F11 or Esc. However, I have encounte ...

Creating a Cascading State and City Dropdown Using Knockout JS and JSON Data

When the user selects a state from two fields, state and city, a call is sent to the server returning JSON data. This data needs to be used to update the city field in knockout, but there seems to be an issue with the syntax of getting the ajax data. Here ...