I am trying to publish a Google Chrome Extension. Before doing it, there is a form to fill:
I am unsure about how to answer. The extension does use a bootstrap CDN via:
<link href="https://cdn.jsdelivr.net/npm/bootstrap#5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
On the side it says:
Remote code is any JS, Wasm, or CSS that is not included in the extension's package. This includes references to external files in tags, modules pointing to external files, and strings evaluated through eval()
Is this CDN use considered as remote code? Is it considered a module pointing to an external file?
Yes, remote code would include CSS files served by a CDN. There are various areas in the Chrome Extensions documentation that specifically define remote code as any code not bundled in your extension. They even include "Any library hosted on a CDN". In fact, they actually specifically reference Bootstrap on the Remotely hosted code restrictions page.
Although CSS is not something blocked by the new Manifest V3 restrictions on remote code, including remote code can make the review process take longer. Instead, it's better to include the library bundled with the extension (assuming the library's license allows it).
Related
I use npm as a package manager for my web frontend projects. I have a need to generate some fake data locally within JavaScript in a project. Faker.js seems to be the perfect library to do so.
Most libraries, when I install them with npm, either have usable js files at the root of the installed files or provide a dist or similar folder with the .js files that I can reference, e.g. <script src="node_modules/angular/angular.min.js"></script> Faker.js however does not include this.
The documentation for faker simply includes this line: <script src = "faker.js" type = "text/javascript"></script> Clearly this will not work since the package doesn't even install a file called faker.js anywhere. My assumption is that you're expected to either use it with Node.js (non web frontend) projects or you're expected to build it somehow to get the faker.js file.
One tutorial I found online says you can npm install faker and then use <script src="node_modules/faker/build/build/faker.js">. But I also do not have a build folder. The tutorial didn't give any instructions on building the faker.js file.
Can someone shed some light on how this works? I have actually seen at least one other package (jQuery) that is similar and does not include a compiled usable browser version in the distribution. In past projects I've simply downloaded a compiled .js file and included it in my source control, but I'd like to try to avoid that if at all possible!
(Please don't answer with "just use a CDN" - I am working in an environment with specific policy requirements that HTML on the production server may not directly reference any off-site assets or scripts, but it is OK to pull in those libraries and self-host them. Frustrating, yes, but I don't get to make the rules.)
I want to use autocompletion at my typo3 fluid templates for some viewhelpers i.e. vhs, but PhpStorm could not fetch the external resource. It only works, if I download the xsd schema file and "manually setup external resource". It would be very nice, If the program could do this.
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers"
v:schemaLocation="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers https://fluidtypo3.org/schemas/vhs-master.xsd">
<!-- my code -->
</div>
Not sure why your schemaLocation doesn't work, but try replacing the XSD URL with one you get from https://viewhelpers.fluidtypo3.org/ and re-download the schema from there. You'll have to pick a specific version, though.
The schemas there are generated fresh with a couple of fixes to the XML source they contain. Nothing that I expect would affect the download.
One thing though - both those URLs are served with a multi-hostname SSL certificate which means the version of openSSL you use must be at least I think it was 0.94.4 in order to be compatible. If your OS is very old it might help to update the openSSL library or do an OS update. But in all cases it should work if you use a browser to download since all current browsers understand SNI.
I would like to know how can I reference different javascript files on my html page in Visual Studio which reflect the appropriate environment - local dev vs. deployed (on Azure)
For example, when I am developing locally, I have something like this at the bottom of my <body> tag (abbreviated dummy names used)
<script src="js/local-1.js"></script>
<script src="js/local-2.js"></script>
<script src="js/local-3.js"></script>
When I am ready for deployment, I leverage grunt to concat and minify these files. The script I reference will now look as such
<script src="js/concat-and-minified.min.js"></script>
This works fine, but I am left with the manual process of ensuring I deploy the correct html page with the deployed script reference, then when interested in local development, I change it back
Surely you can see this is tedious and I think qualifies as an unnecessary step, but I am unable to find a way to achieve this.
So, is there a way to select which <script> tags exist on my html page depending on the environment of the site? Furthermore, is this primarily even an IDE consideration, or am I missing some other factor?
Additional details
Though this is in Visual Studio, the front end project is strictly Angular with a single page html file, so any sort of MVC bundling or .cshtml if/else logic is not applicable
When you build & run YUIDoc it gets some of his resources from http://yui.yahooapis.com/.... These resources include the stylesheet and yui.min.js.
How can I download and use these resources offline?
The reason for this is because we run our docs on a HTTPS server. The YUIDoc serves his files always over HTTP protocol.
I had the same problem and I really don’t understand why the don’t have a valid certificate for yui.yahooapis.com. Here’s what works for me (with YUIDoc 0.5.0):
Create a custom theme
First of all, you’ll need to create a new theme that overrides some parts of the default theme.
Create the following folder structure:
my_theme
├── assets
│ ├── css
│ └── yui
└── layouts
Modify the main layout
To avoid loading the remote CSS and scripts, you need to alter the main layout.
Copy the file called main.handlebars from the original theme to your my_theme/layouts/ folder. If you installed YUIDoc via node, the original file is located in node_modules/yuidocjs/themes/default/layouts/. Alternatively, you can grab it from the yuidoc GitHub repo.
Make the following changes in that file:
1.) Replace the link tag referencing the remote stylesheet:
<link rel="stylesheet" href="{{yuiGridsUrl}}">
<link rel="stylesheet" href="{{projectAssets}}/css/cssgrids-min.css">
2.) Replace the script tag referencing the remote YUI library:
<script src="{{yuiSeedUrl}}"></script>
<script src="{{projectAssets}}/yui/build/yui-base/yui-base-min.js"></script>
Add a local copy of the remote assets
1.) Fetch the CSS from Yahoo’s CDN
Download cssgrids-min.css from the Yahoo CDN and put it in your my_theme/assets/css folder.
2.) Download the YUI 3.9.1 library
Download YUI 3.9.1 from http://yui.zenfs.com/releases/yui3/yui_3.9.1.zip (Release Notes) and put the build folder from the archive to my_theme/assets/yui.
Build your docs
When building your docs, make sure you specify your custom theme:
$ yuidoc my_js_folder --themedir my_theme
Possible improvements
Since this adds a bunch of files to your project, it might make sense to dive a little deeper into YUIDoc and see which YUI modules are actually required and remove everything else. Also, combining the files would be desirable (the library served form Yahoo’s CDN does this and it should be possible to get this working locally as well).
I am trying to find an example of a CDN server written in nodejs that does the following:
Minification of CSS & JS
Pre-Compiling LESS
Pre-Compiling CoffeeScript
Static Redirection if content already available in another bucket
A management interface
I realize that something like this already exists (S3 etc) but my interest is academic. I am interested if something like this has been done in node, and how.
You should have a look at express-cdn, a module to deliver compressed, minified and assets combined assets to CDN servers (Currently Amazon S3). It lacks some management interface but implements a couple of features you require.
Look into grunt, it has plugins for every kind of asset pipeline.
I cant find a module to perform all your tasks at the same time. You should mix modules in your application. I recommend you look at npmjs.org
Minification of CSS & JS ---> Here
Pre-Compiling LESS ---> Here
Pre-compiling CoffeScript (The command-line version of coffee is available as a Node.js utility.) Here
Static Redirection if content already available in another bucket: Nothing clear, you should have some kind of db for the files, for the redirections go to nginx.org <3
A management interface: Any Easy to extend Web-based File Manager for node.js?